Question

我似乎找不到足够好的答案来解决这个问题。

我正在试图弄清楚如何为x和y轴定制工具提示标签，

使用此代码，我可以为每个工具提示自定义yLabel：

    options: {
    
    tooltips: {
        callbacks: {
            label: function(tooltipItem, data) {
                return "Energi, Vatten och Återvinning: " + Number(tooltipItem.yLabel).toFixed(0).replace(/./g, function(c, i, a) {
                    return i > 0 && c !== "." && (a.length - i) % 3 === 0 ? "," + c : c;
                });
            }
        }
    },

tooltip as shown

由于我的JS知识有限，我似乎无法将脚本修改为在值后显示百分号，以及显示x轴的标签。

Answer 1

你可能会把我的腿拉到这里，因为不需要任何花哨的东西，只需在标签功能返回结束时添加+“％”：

    options: {
    
    tooltips: {
        callbacks: {
            label: function(tooltipItem, data) {
                return "Energi, Vatten och Återvinning: " + Number(tooltipItem.yLabel).toFixed(0).replace(/./g, function(c, i, a) {
                    return i > 0 && c !== "." && (a.length - i) % 3 === 0 ? "," + c : c;
                })+ " %";
            }
        }
    },

另外，在我看来，你的整个功能至少可以简化为：

    options: {
    
    tooltips: {
        callbacks: {
            label: function(tooltipItem, data) {
                return "Energi, Vatten och Återvinning: " +  Number(tooltipItem.yLabel).toFixed(0)+ " %";
            }
        }
    },

Chart JS自定义工具提示，带有％和X轴和Y轴的标签

1 个答案: