图表看起来只有灰色，不显示颜色 - Chartjs,discordjs

Question

我正在设计一个 discord.js 代码，它将显示成员的消息和语音统计信息，根据它的排行榜可能会导致奖品。

通常，我的图表以某种方式应该看起来像这些图表：

（上图分别是discord服务器的语音和消息统计）

但是当我输入命令时，它会显示这些无色图形：（不是关于它的设计，而是关于它的颜色）

在这两个图之间，没有代码差异，没有 node.js 版本更改，没有平台更改等。

我已经在这个项目上工作了很长时间，但一个月左右后，我仍然找不到我的代码有任何错误。也许我错过了什么。有人可以帮我吗？谢谢。

一般统计命令：

const { Client, Message, MessageEmbed, MessageAttachment } = require("discord.js");
const Stat = require("../../Models/Database/Stat");
const tm = require("../../Managers/TimeManager");

const moment = require("moment");
require("moment-duration-format");

const cm = require("../../Managers/ChartManager");

/**
 * @param {Client} client 
 * @param {Message} message 
 * @param {Array<String>} args 
 */
module.exports.execute = async(client, message, args) => {
    let victim = message.mentions.users.first() || client.users.cache.get(args[0]) || message.author;

    let embed = new MessageEmbed()
        .setAuthor(victim.username, victim.avatarURL({ dynamic: true }))
        .setFooter("?statistik bilgileri");

    let data = await Stat.findOne({ Id: victim.id });
    if (!data) data = {};
    let day = await tm.getDay(message.guild.id);

    let dataMessage = new Array(day).fill(0, 0, day),
        dataVoice = new Array(day).fill(0, 0, day),
        dataColors = new Array(day).fill('rgba(0, 92, 210, 0.5)');

    if (data.Message) {
        let günlükmesaj = 0,
            haftal?kmesaj = 0,
            ayl?kmesaj = 0,
            toplammesaj = 0;
        let days = Object.keys(data.Message);
        days.forEach(_day => {
            let sum = Object.values(data.Message[_day]).reduce((x, y) => x + y, 0);
            toplammesaj += sum;
            dataMessage[_day - 1] = sum;
            if (day == Number(_day)) günlükmesaj += sum;
            if (_day <= 7) haftal?kmesaj += sum;
            if (_day <= 30) ayl?kmesaj += sum;
        });
        embed.addField(`Mesaj ?statisti?i`, `
        __Toplam:__ \`${toplammesaj} mesaj\`

        Günlük: \`${günlükmesaj} mesaj\`
        Haftal?k: \`${haftal?kmesaj} mesaj\`
        Ayl?k: \`${ayl?kmesaj} mesaj\`
        `, true)
    }
    if (data.Voice) {
        let günlükses = 0,
            haftal?kses = 0,
            ayl?kses = 0,
            toplamses = 0;
        let days = Object.keys(data.Voice);
        let max = Math.max(dataMessage);
        days.forEach(_day => {
            let sum = Object.values(data.Voice[_day]).reduce((x, y) => x + y, 0);
            if (isNaN(sum)) sum = 0;
            toplamses += sum;

            dataVoice[_day - 1] = (sum / (1000 * 60))
            if (day == Number(_day)) günlükses += sum;
            if (_day <= 7) haftal?kses += sum;
            if (_day <= 30) ayl?kses += sum;
        });
        embed.addField(`Ses ?statisti?i`, `
        __Toplam:__ \`${moment.duration(toplamses).format("H [saat, ] m [dakika]")}\`

        Günlük: \`${moment.duration(günlükses).format("H [saat, ] m [dakika]")}\`
        Haftal?k: \`${moment.duration(haftal?kses).format("H [saat, ] m [dakika]")}\`
        Ayl?k: \`${moment.duration(ayl?kses).format("H [saat, ] m [dakika]")}\`
        `, true)
    }

    let dataDate = [];
    for (let index = 0; index < day; index++) {
        let date = new Date(Date.now() - (1000 * 60 * 60 * 24 * (day - (index + 1))));
        dataDate.push(date.toTurkishFormatDate());
    }

    let buffer = await cm.ImageFromData({
        width: 600,
        height: 290,
        type: 'line',

        data: {
            labels: [].concat(dataDate),
            datasets: [{
                    label: "Toplam Mesaj ?statisti?i (Adet)",
                    data: [].concat(dataMessage),
                    backgroundColor: [
                        'rgba(0, 112, 255, 0.25)'
                    ],
                    borderColor: [].concat(dataColors),
                    borderWidth: 1
                },
                {
                    label: "Toplam Ses ?statisti?i (Dakika)",
                    data: dataVoice,
                    backgroundColor: [
                        'rgba(4, 255, 0, 0.25)'
                    ],
                    borderColor: [].concat(new Array(day).fill('rgba(4, 255, 0, 0.5)')),
                    borderWidth: 1
                }
            ]
        },
        options: {

        }
    });

    embed.setImage("attachment://Graph.png");
    let attachment = new MessageAttachment(buffer, "Graph.png");

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

module.exports.settings = {
    Commands: ["istatistikler", "istatistik"],
    Usage: "istatistik [@ki?i|ID]",
    Description: "Sunucudaki genel ses ve mesaj istatisti?inle alakal? bilgi al?rs?n.",
    Category: "istatistikler",
    Activity: true,
    cooldown: 20000
}

消息统计命令：

const { Client, Message, MessageEmbed, MessageAttachment } = require("discord.js");
const Stat = require("../../Models/Database/Stat");

const tm = require("../../Managers/TimeManager");

const cm = require("../../Managers/ChartManager");

module.exports.execute = async(client, message, args) => {
        let victim = message.mentions.users.first() || client.users.cache.get(args[0]) || message.author;

        let embed = new MessageEmbed()
            .setAuthor(victim.username, victim.avatarURL({ dynamic: true }))
            .setFooter(`${message.guild.name} sunucusuda ${victim.username} ki?isinin bilgileri.`)

        let data = await Stat.findOne({ Id: victim.id }, { Voice: 0 });
        if (!data) data = {};
        let day = await tm.getDay(message.guild.id);
        embed.setDescription(`${victim} ki?isinin ${day} gün boyunca yapm?? oldu?u mesaj aktifli?i a?a??da detayl? olarak s?ralanm??t?r.`);
        embed.setColor("2f3136");

        let dataValue = new Array(day).fill(0);
        let dataDate = [];
        let dataColors = new Array(day).fill('rgba(0, 92, 210, 0.5)');

        if (data.Message) {
            let günlükmesaj = 0,
                haftal?kmesaj = 0,
                ayl?kmesaj = 0,
                toplammesaj = 0;
            let days = Object.keys(data.Message);

            let haftal?k = {},
                ayl?k = {},
                günlük = [];

            days.forEach(_day => {
                let sum = Object.values(data.Message[_day]).reduce((x, y) => x + y, 0);
                toplammesaj += sum;
                dataValue[_day - 1] = sum;

                if (day == Number(_day)) {
                    günlükmesaj += sum;
                    günlük = Object.keys(data.Message[_day]).map(e => Object.assign({ Channel: e, Value: data.Message[_day][e] }));
                }
                if (_day <= 7) {
                    haftal?kmesaj += sum;
                    let keys = Object.keys(data.Message[_day]);
                    keys.forEach(key => {
                        if (haftal?k[key]) haftal?k[key] += data.Message[_day][key];
                        else haftal?k[key] = data.Message[_day][key];
                    });
                }
                if (_day <= 30) {
                    ayl?kmesaj += sum;
                    let keys = Object.keys(data.Message[_day]);
                    keys.forEach(key => {
                        if (ayl?k[key]) ayl?k[key] += data.Message[_day][key];
                        else ayl?k[key] = data.Message[_day][key];
                    });
                }
            });
            embed.addField("**Günlük Mesaj ?statisti?i**", `
        __Toplam:__ ${günlükmesaj} mesaj

        ${günlük.sort((x, y) => y.Value - x.Value).splice(0, 5).map((data, index) => {
            let channel = message.guild.channels.cache.get(data.Channel);
            return `\`${index + 1}.\` ${channel ? channel : "deleted-channel"}: \`${data.Value} mesaj\``;
        }).join("\n")}\n\n** **
        `);

        embed.addField("**Haftal?k Mesaj ?statisti?i**", `
        __Toplam:__ ${haftal?kmesaj} mesaj

        ${Object.keys(haftal?k).sort((x, y) => haftal?k[y] - haftal?k[x]).splice(0, 5).map((data, index) => {
            let channel = message.guild.channels.cache.get(data);
            return `\`${index + 1}.\` ${channel ? channel : "deleted-channel"}: \`${haftal?k[data]} mesaj\``;
        }).join("\n")}\n\n** **
        `);

        embed.addField("**Ayl?k Mesaj ?statisti?i**", `
        __Toplam:__ ${haftal?kmesaj} mesaj

        ${Object.keys(ayl?k).sort((x, y) => ayl?k[y] - ayl?k[x]).splice(0, 5).map((data, index) => {
            let channel = message.guild.channels.cache.get(data);
            return `\`${index + 1}.\` ${channel ? channel : "deleted-channel"}: \`${ayl?k[data]} mesaj\``;
        }).join("\n")}\n\n** **
        `);

        embed.addField(`Genel Mesaj ?statisti?i`, `
        __Toplam:__ ${toplammesaj} mesaj

        Günlük: \`${günlükmesaj} mesaj\`
        Haftal?k: \`${haftal?kmesaj} mesaj\`
        Ayl?k: \`${ayl?kmesaj} mesaj\`
        `, true)
    }
    else {
        embed.setDescription("Herhangi bir kay?t bulunamad?.");
    }

    for (let index = 0; index < day; index++) {
        let date = new Date(Date.now() - (1000 * 60 * 60 * 24 * (day - (index + 1))));
        dataDate.push(date.toTurkishFormatDate());
    }

    let buffer = await cm.ImageFromData({
        width: 600,
        height: 290,
        type: 'line',

        data: {
            labels: [].concat(dataDate),
            datasets: [{
                label: "Toplam Mesaj ?statisti?i (Adet)",
                data: [].concat(dataValue),
                backgroundColor: [
                    'rgba(0, 112, 255, 0.25)'
                ],
                borderColor: [].concat(dataColors),
                borderWidth: 1
            }]
        },
        options: {

        }
    });

    embed.setImage("attachment://Graph.png");
    let attachment = new MessageAttachment(buffer, "Graph.png");

    message.channel.csend({
        embeds: [embed],
        files: [attachment]
    });
}
module.exports.settings = {
    Commands: ["mesajistatistikleri"],
    Usage: "mesajistatistikleri",
    Description: "Sunucudaki mesaj istatisti?inle alakal? bilgi al?rs?n.",
    Category: "istatistikler",
    Activity: true,
    cooldown: 15000
}

语音统计命令：

const { Client, Message, MessageEmbed, MessageAttachment } = require("discord.js");
const Stat = require("../../Models/Database/Stat");

const moment = require("moment");
require("moment-duration-format");

const tm = require("../../Managers/TimeManager");

const cm = require("../../Managers/ChartManager");


/**
 * @param {Client} client 
 * @param {Message} message 
 * @param {Array<String>} args 
 */
module.exports.execute = async(client, message, args) => {
        let victim = message.mentions.users.first() || client.users.cache.get(args[0]) || message.author;

        let embed = new MessageEmbed()
            .setAuthor(victim.username, victim.avatarURL({ dynamic: true }))
            .setFooter(`${message.guild.name} sunucusuda ${victim.username} ki?isinin bilgileri.`)

        let data = await Stat.findOne({ Id: victim.id }, { Message: 0 });
        if (!data) data = {};
        let day = await tm.getDay(message.guild.id);
        embed.setDescription(`${victim} ki?isinin ${day} gün boyunca yapm?? oldu?u ses aktifli?i a?a??da detayl? olarak s?ralanm??t?r.`);
        embed.setColor("2f3136");

        let dataValue = new Array(day).fill(0);
        let dataDate = [];
        let dataColors = [];

        if (data.Voice) {
            let günlükses = 0,
                haftal?kses = 0,
                ayl?kses = 0,
                toplamses = 0;
            let days = Object.keys(data.Voice);

            let haftal?k = {},
                ayl?k = {},
                günlük = [];

            days.forEach(_day => {
                let sum = Object.values(data.Voice[_day]).reduce((x, y) => x + y, 0);
                toplamses += sum;
                dataValue[_day - 1] = convert(sum);
                dataColors.push('rgba(4, 255, 0, 0.5)');


                if (day == Number(_day)) {
                    günlükses += sum;
                    günlük = Object.keys(data.Voice[_day]).map(e => Object.assign({ Channel: e, Value: data.Voice[_day][e] }));
                }
                if (_day <= 7) {
                    haftal?kses += sum;
                    let keys = Object.keys(data.Voice[_day]);
                    keys.forEach(key => {
                        if (haftal?k[key]) haftal?k[key] += data.Voice[_day][key];
                        else haftal?k[key] = data.Voice[_day][key];
                    });
                }
                if (_day <= 30) {
                    ayl?kses += sum;
                    let keys = Object.keys(data.Voice[_day]);
                    keys.forEach(key => {
                        if (ayl?k[key]) ayl?k[key] += data.Voice[_day][key];
                        else ayl?k[key] = data.Voice[_day][key];
                    });
                }
            });
            embed.addField("**Günlük Ses ?statisti?i**", `
        __Toplam:__ ${moment.duration(günlükses).format("H [saat, ] m [dakika]")}

        ${günlük.sort((x, y) => y.Value - x.Value).splice(0, 5).map((data, index) => {
            let channel = message.guild.channels.cache.get(data.Channel);
            return `\`${index + 1}.\` #${channel ? channel.name : "deleted-channel"}: \`${moment.duration(data.Value).format("H [saat, ] m [dakika]")}\``;
        }).join("\n")}\n\n** **
        `);

        embed.addField("**Haftal?k Ses ?statisti?i**", `
        __Toplam:__ ${moment.duration(haftal?kses).format("H [saat, ] m [dakika]")}

        ${Object.keys(haftal?k).sort((x, y) => haftal?k[y] - haftal?k[x]).splice(0, 5).map((data, index) => {
            let channel = message.guild.channels.cache.get(data);
            return `\`${index + 1}.\` #${channel ? channel.name : "deleted-channel"}: \`${moment.duration(haftal?k[data]).format("H [saat, ] m [dakika]")}\``;
        }).join("\n")}\n\n** **
        `);

        embed.addField("**Ayl?k Ses ?statisti?i**", `
        __Toplam:__ ${moment.duration(ayl?kses).format("H [saat, ] m [dakika]")}

        ${Object.keys(ayl?k).sort((x, y) => ayl?k[y] - ayl?k[x]).splice(0, 5).map((data, index) => {
            let channel = message.guild.channels.cache.get(data);
            return `\`${index + 1}.\` #${channel ? channel.name : "deleted-channel"}: \`${moment.duration(ayl?k[data]).format("H [saat, ] m [dakika]")}\``;
        }).join("\n")}\n\n** **
        `);

        embed.addField(`Genel Ses ?statisti?i`, `
        __Toplam:__ ${moment.duration(toplamses).format("H [saat, ] m [dakika]")}

        Günlük: \`${moment.duration(günlükses).format("H [saat, ] m [dakika]")}\`
        Haftal?k: \`${moment.duration(haftal?kses).format("H [saat, ] m [dakika]")}\`
        Ayl?k: \`${moment.duration(ayl?kses).format("H [saat, ] m [dakika]")}\`
        `, true)
    }
    else {
        embed.setDescription("Herhangi bir kay?t bulunamad?.");
    }

    for (let index = 0; index < day; index++) {
        let date = new Date(Date.now() - (1000 * 60 * 60 * 24 * (day - (index + 1))));
        dataDate.push(date.toTurkishFormatDate());
    }

    let buffer = await cm.ImageFromData({
        width: 600,
        height: 290,
        type: 'line',

        data: {
            labels: [].concat(dataDate),
            datasets: [{
                label: "Toplam Ses ?statisti?i (Dakika)",
                data: [].concat(dataValue),
                backgroundColor: [
                    'rgba(4, 255, 0, 0.25)'
                ],
                borderColor: [].concat(dataColors),
                borderWidth: 1
            }]
        },
        options: {

        }
    });

    embed.setImage("attachment://Graph.png");
    let attachment = new MessageAttachment(buffer, "Graph.png");

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


function convert(ms) {
    return (ms / (1000 * 60)).toFixed(0);
}

module.exports.settings = {
    Commands: ["sesistatistikleri"],
    Usage: "sesistatistikleri",
    Description: "Sunucudaki kendi ses istatisti?ine bakars?n.",
    Category: "istatistikler",
    Activity: true,
    cooldown: 15000
}

消息排行榜命令：

const { Client, Message, MessageEmbed, MessageAttachment } = require("discord.js");
const Stat = require("../../Models/Database/Stat");
const Helper = require("../../Utils/Helper");

const tm = require("../../Managers/TimeManager");

const cm = require("../../Managers/ChartManager");

/**
 * @param {Client} client 
 * @param {Message} message 
 * @param {Array<String>} args 
 */
module.exports.execute = async(client, message, args) => {
    let embed = new MessageEmbed()
        .setAuthor(message.author.username, message.author.avatarURL({ dynamic: true }))
        .setFooter(`${message.guild.name} sunucusunun mesaj istatistikleri.`)
    let day = await tm.getDay(message.guild.id);
    embed.setDescription(`${message.guild.name} sunucusunda kullan?c?lar?n **${day}** gün boyunca yapm?? oldu?u mesaj aktifli?i a?a??da detayl? olarak s?ralanm??t?r.`);
    embed.setColor("2f3136");

    Stat.aggregate([
        { $project: { Voice: 0 } },
        { $sort: { AllMessage: -1 } }
    ]).limit(10).exec(async(err, docs) => {
        if (err) return message.reply("bir hata ile kar??la??ld?.");
        let users = [],
            usersToEmbed = [];

        if (docs.length > 0) {
            for (let index = 0; index < docs.length; index++) {
                const doc = docs[index];
                let stat = doc;
                if (!stat) continue;

                if (stat.AllMessage <= 0) continue;

                if (stat.Message) {
                    let days = Object.keys(stat.Message);
                    let dataValues = new Array(day).fill(0);
                    days.forEach(_day => {
                        let sum = Object.values(stat.Message[_day]).reduce((x, y) => x + y, 0);
                        dataValues[_day - 1] = sum;
                    });
                    let user = (await Helper.GetUser(doc.Id));
                    usersToEmbed.push({
                        User: user,
                        Value: dataValues.reduce((x, y) => x + y, 0)
                    });
                    let borderColors = new Array(dataValues.length).fill(getColor(index, "0.8"));
                    let backgroundColors = new Array(dataValues.length).fill(getColor(index, "0.1"))
                    let pointBackgroundColors = new Array(dataValues.length).fill(getColor(index, "1"));
                    let data = {
                        label: `${user.username}`,
                        data: dataValues,
                        backgroundColor: backgroundColors,
                        borderColor: borderColors,
                        pointBackgroundColor: pointBackgroundColors,
                        borderWidth: 1.5,
                    };
                    users.push(data);
                }
            }

            let dataDate = [];
            for (let index = 0; index < day; index++) {
                let date = new Date(Date.now() - (1000 * 60 * 60 * 24 * (day - (index + 1))));
                dataDate.push(date.toTurkishFormatDate());
            }

            let buffer = awai

    

Answer 1

您现在获得的颜色是库设置的默认颜色rgba(0, 0, 0, 0.1)，这是因为您提供的是数组而不是字符串或画布图案/渐变对象borderColor: [].concat(dataColors)。一般统计命令行 97

欲了解更多信息，您可以在这里查看 https://www.chartjs.org/docs/latest/general/colors.html