首页 > 解决方案 > Discord.js 画布合并两个图像

问题描述

我想要做的是将两个图像混合或合并到一个图像但这里的问题是我发现的唯一教程主要是关于欢迎图像和排名图像这对我没有帮助例如我想要做的是混合这两个图像在此处输入图像描述

在此处输入图像描述

像这样将第一个附件(耳朵)放在第二个附件(船员)的头上 在此处输入图像描述

我可以用画布做到这一点吗?我唯一尝试但没有接近但失败的事情就是这个

const canvas = Canvas.createCanvas(700, 250);
        const ctx = canvas.getContext('2d');
        
        const background = await Canvas.loadImage('assets/colors/red.png');
        ctx.drawImage(background, 0, 0, canvas.width, canvas.height);
        
        ctx.strokeStyle = '#74037b';
        ctx.strokeRect(0, 0, canvas.width, canvas.height);

        const avatar = await Canvas.loadImage(message.author.displayAvatarURL({ format: 'png' }));

        ctx.drawImage(avatar, 25, 0, 200, canvas.height);

        const attachment = new Discord.MessageAttachment(canvas.toBuffer(), 'test.png');

        message.channel.send(attachment);

我什至无法调整图像以适应这就是为什么我需要帮助忽略“message.author.displayAvatarURL()”我只是用另一个图像测试 red.png 看看我是否能做到我想自动化这个过程因为颜色和帽子是随机的,而不仅仅是 red.png 和 cat hat

标签: node.jscanvasdiscord.js

解决方案


推荐阅读