embedding an manipulated image inside the box

unddasnoch · 2023-12-05T22:45:17.527Z

i tried to manipulate an image and adding it to the embedded box as an attachment url but its not inside the embedded box like here

D

d.js toolkit•12/5/23, 10:45 PM

What's your exact discord.js

npm list discord.js

npm list discord.js

and node

node -v

node -v

version?

Not a discord.js issue? Check out #other-js-ts.
Consider reading #how-to-get-help to improve your question!
Explain what exactly your issue is.
Post the full error stack trace, not just the top part!
Show your code!
Issue solved? Press the button!
```
✅
```
```
✅
```
Marked as resolved by staff

U

unddasnochOP•12/5/23, 10:46 PM

im using discord.js v14 and canvas btw

U

unddasnochOP•12/5/23, 10:49 PM

    const canvas = createCanvas(400, 200);
    const ctx = canvas.getContext('2d');

    const backgroundImage = await loadImage('./src/background.png');
    ctx.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);

    const userAvatar = await loadImage(member.user.displayAvatarURL({ extension: "png" }));
    ctx.beginPath();
    ctx.arc(200, 100, 70, 0, Math.PI * 2, true);
    ctx.closePath();
    ctx.clip();
    ctx.drawImage(userAvatar, 130, 30, 140, 140);

    const attachedImage = new AttachmentBuilder(canvas.toBuffer(), 'welcomeImage.png');

    const embedWelcomeBox = new EmbedBuilder()
        .setTitle(`${member.displayName}, Welcome to this great server`)
        .setImage('attachment://welcomeImage.png')
        .setColor(0xc36bdb)

    channel.send({ embeds: [embedWelcomeBox], files: [attachedImage] });

    const canvas = createCanvas(400, 200);
    const ctx = canvas.getContext('2d');

    const backgroundImage = await loadImage('./src/background.png');
    ctx.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);

    const userAvatar = await loadImage(member.user.displayAvatarURL({ extension: "png" }));
    ctx.beginPath();
    ctx.arc(200, 100, 70, 0, Math.PI * 2, true);
    ctx.closePath();
    ctx.clip();
    ctx.drawImage(userAvatar, 130, 30, 140, 140);

    const attachedImage = new AttachmentBuilder(canvas.toBuffer(), 'welcomeImage.png');

    const embedWelcomeBox = new EmbedBuilder()
        .setTitle(`${member.displayName}, Welcome to this great server`)
        .setImage('attachment://welcomeImage.png')
        .setColor(0xc36bdb)

    channel.send({ embeds: [embedWelcomeBox], files: [attachedImage] });

    const canvas = createCanvas(400, 200);
    const ctx = canvas.getContext('2d');

    const backgroundImage = await loadImage('./src/background.png');
    ctx.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);

    const userAvatar = await loadImage(member.user.displayAvatarURL({ extension: "png" }));
    ctx.beginPath();
    ctx.arc(200, 100, 70, 0, Math.PI * 2, true);
    ctx.closePath();
    ctx.clip();
    ctx.drawImage(userAvatar, 130, 30, 140, 140);

    const attachedImage = new AttachmentBuilder(canvas.toBuffer(), 'welcomeImage.png');

    const embedWelcomeBox = new EmbedBuilder()
        .setTitle(`${member.displayName}, Welcome to this great server`)
        .setImage('attachment://welcomeImage.png')
        .setColor(0xc36bdb)

    channel.send({ embeds: [embedWelcomeBox], files: [attachedImage] });

    const canvas = createCanvas(400, 200);
    const ctx = canvas.getContext('2d');

    const backgroundImage = await loadImage('./src/background.png');
    ctx.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);

    const userAvatar = await loadImage(member.user.displayAvatarURL({ extension: "png" }));
    ctx.beginPath();
    ctx.arc(200, 100, 70, 0, Math.PI * 2, true);
    ctx.closePath();
    ctx.clip();
    ctx.drawImage(userAvatar, 130, 30, 140, 140);

    const attachedImage = new AttachmentBuilder(canvas.toBuffer(), 'welcomeImage.png');

    const embedWelcomeBox = new EmbedBuilder()
        .setTitle(`${member.displayName}, Welcome to this great server`)
        .setImage('attachment://welcomeImage.png')
        .setColor(0xc36bdb)

    channel.send({ embeds: [embedWelcomeBox], files: [attachedImage] });

D

d.js docsAPP•12/5/23, 10:50 PM

Files in embeds should be attached via the message option object and referenced in the embed:

const attachment = new AttachmentBuilder('./image.png', { name: 'image1.png' });
const embed = new EmbedBuilder()
  .setTitle('Attachments')
  .setImage(`attachment://${attachment.name}`);

channel.send({
  embeds: [embed],
  files: [attachment]
});

const attachment = new AttachmentBuilder('./image.png', { name: 'image1.png' });
const embed = new EmbedBuilder()
  .setTitle('Attachments')
  .setImage(`attachment://${attachment.name}`);

channel.send({
  embeds: [embed],
  files: [attachment]
});

const attachment = new AttachmentBuilder('./image.png', { name: 'image1.png' });
const embed = new EmbedBuilder()
  .setTitle('Attachments')
  .setImage(`attachment://${attachment.name}`);

channel.send({
  embeds: [embed],
  files: [attachment]
});

const attachment = new AttachmentBuilder('./image.png', { name: 'image1.png' });
const embed = new EmbedBuilder()
  .setTitle('Attachments')
  .setImage(`attachment://${attachment.name}`);

channel.send({
  embeds: [embed],
  files: [attachment]
});

U

unddasnochOP•12/5/23, 10:52 PM

yeah that was the problem thanks

Similar Threads

Similar Threads

Similar Threads