#@napi-rs/canvas images not loading properly

5 messages · Page 1 of 1 (latest)

carmine folio 
module.exports = async (client) => {
    const json = await get();

    const items = json.data.featured.entries;
    const images = [[]];
    items.forEach((item, index) => {
        if (index % 9 === 8)
            images.push([]);
        images[images.length-1].push(item.newDisplayAsset.materialInstances[0].images.Background);
    });

    const canvas = Canvas.createCanvas(650, 540 + 70 * images.length);
    const context = canvas.getContext('2d');

    context.fillStyle = "#4287f5";
    context.fillRect(0, 0, canvas.width, canvas.height);

    context.fillStyle = "white";
    context.fillRect(0, 240, canvas.width, 20);
    context.fillRect(0, canvas.height - 260, canvas.width, 20);

    let height = 260;
    images.forEach(async (row, rowIndex) => {
        let x = 0;

        row.forEach(async (image, index) => {
            const img = await Canvas.loadImage(image);

            context.drawImage(img, x + 20, height + 20, 50, 50);
            x += 70;
        });
        height += 70;
    });

    const attachment = new AttachmentBuilder(await canvas.encode('png'), { name: 'daily-shop.png' });

    const channel = client.guilds.cache.get(config.guildID).channels.cache.get(config.gamingUpdates);
    channel.send({ files: [attachment] });
}

I have this code that takes a 2-dimensional array images of image URLs, and is supposed to put them onto the canvas. I am not sure why, but the images just aren't there in the end result (as shown in the image below). I know all URLs are valid, what could be wrong?

neat gullBOT
  • 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 OP
sacred fiber
carmine folio
sacred fiber