如何根据图表中的标签值改变条形图的颜色

How to change bar color acording to label value in chartjs

本文关键字：标签 条形图 颜色 改变 何根      更新时间：2023-09-26

我需要在chartjs中使用条形，我需要所有的条形都是一种颜色，只有中间的一个是其他颜色。如果我能根据特定的颜色创建一个值范围，那将是最好的。

http://s24.postimg.org/4jg17tm5h/graf.png

我用命令

手动绘制了这一栏
myLine.datasets[0].bars[50].fillColor = "red";

，但我需要它是自动的，选择一个值，并根据其限制选择颜色。这可能吗?

查看文档中的getBarsAtEvent方法。

下面是一个如何使用它的例子，尽管你可能需要根据你的具体需要修改它:

canvas.onmousemove = function(evt) {
    var bars = chart.getBarsAtEvent(evt);
    for (var i = 0; i < bars.length; i++) {
        setColor(bars[i]);
    }
};
function setColor(bar) {
    if (bar.value < 10) {
        bar.fillColor = "red";
    } else if (bar.value < 20) {
        bar.fillColor = "yellow";
    } else {
        bar.fillColor = "green";
   }
}

我已经使用了您的部分解决方案并解决了问题

        for (var i = 0; i < myLine.datasets[0].bars.length; i++) {
        console.log(myLine.datasets[0].bars[i].value);
        if(myLine.datasets[0].bars[i].value < 10) {
            myLine.datasets[0].bars[i].fillColor = "red";
        } else if (myLine.datasets[0].bars[i].value > 20) {
            myLine.datasets[0].bars[i].fillColor = "yellow";
        }
    }

这是我需要的，谢谢，我不知道如何访问酒吧的值

相关文章：