为什么@napi-rs/canvas 没有按应有的方式渲染文本?

问题描述 投票:0回答:0

我一直在尝试找出如何解决这个问题大约 3 个小时,如果有人能提供帮助,那就太好了。

这是一个使用 @napi-rs/canvas 的 discord.js 项目。出于某种原因,@napi-rs/canvas 根本没有渲染任何文本。

当代码运行时,它给出this image.

我在线运行这段代码,使用railway.app

client.on("guildMemberAdd", async function(member){
  if (member.guild.id != guildId) return
    const canvas = Canvas.createCanvas(800, 500);
    const context = canvas.getContext('2d');
    const pfp = await Canvas.loadImage(member.displayAvatarURL({format: "png"}))
    const bg = await Canvas.loadImage('./joinbg.png')
    const uname = member.user.username
    const dcrim = member.user.discriminator
    console.log(uname+"#"+dcrim+" has joined! sending join img + verification!")
    
    context.drawImage(bg, 0, 0, canvas.width, canvas.height)
    context.strokeStyle = "#ffffff"
    //context.strokeRect(0, 0, canvas.width, canvas.height);
    context.fillStyle = 'rgba(255,255,255,1)'
    context.font = '50px sans-serif'
    context.fillText(""+uname, 200, 100)
    //context.fillText(text, 0, 0)
    context.fillStyle = 'rgba(155, 155, 155, 1)'
    context.font = '30px sans-serif'
    context.fillText("#" + dcrim, 200, 140)
    //context.fillText(text2, 0, 0)
    // Pick up the pen
    context.beginPath();

    // Start the arc to form a circle
    context.arc(106.5, 105.5, 92.5, 92.5, Math.PI * 1, true);

    // Put the pen down
    context.closePath();

    // Clip off the region you drew on
    context.clip();
    context.drawImage(pfp, 14, 13, 185, 185)

    const a = new ActionRowBuilder()
    .addComponents(
        new ButtonBuilder()
        .setCustomId('tos')
        .setLabel('View ToS')
        .setStyle(ButtonStyle.Secondary),
    )

    const newimg = new AttachmentBuilder(await canvas.encode('png'), { name: uname+'#'+dcrim+'-joined.png' })
    client.guilds.fetch("" + process.env.guildid) .then((guild) => {
      guild.channels.fetch("" + process.env.welcomechannelid) .then((channel) => {
        channel.send({ files: [newimg] })
        member.send({
          content: "**Welcome to Plot Block [LIFESTEAL]!**\n\nWe hope you have a good time here!\nPlease click on the button below to begin the first step of the verification process!",
          components: [a]
        })
      })
    })
})

我试图恢复到旧版本的@napi-rs/canvas(特别是 ^0.1.30)

如果你能帮忙,请帮忙。 如果您需要更多信息,我可以提供。

我试图制作一个以前工作得很好的连接图像,但现在当我尝试制作一个新图像时,它就无法正常工作了。由于某种原因,文本不会呈现。

node.js discord.js html5-canvas
© www.soinside.com 2019 - 2024. All rights reserved.