如何根据图表js中的标签值更改条形颜色
How to change bar color acording to label value in chartjs
我需要在 chartjs 中使用条形图,我需要所有条形图都是一种颜色,中间只有一个是其他颜色。如果我能根据使用特定颜色创建值范围,那将是最好的。
http://s24.postimg.org/4jg17tm5h/graf.png
我已经用这个命令手动绘制了这一栏
myLine.datasets[0].bars[50].fillColor = "red";
但我需要它自动选择一个值并根据其限制选择颜色。可能吗?
查看 documentation 中的 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";
}
}
这就是我需要的,谢谢,我不知道如何访问柱的值。
我需要在 chartjs 中使用条形图,我需要所有条形图都是一种颜色,中间只有一个是其他颜色。如果我能根据使用特定颜色创建值范围,那将是最好的。
http://s24.postimg.org/4jg17tm5h/graf.png
我已经用这个命令手动绘制了这一栏
myLine.datasets[0].bars[50].fillColor = "red";
但我需要它自动选择一个值并根据其限制选择颜色。可能吗?
查看 documentation 中的 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";
}
}
这就是我需要的,谢谢,我不知道如何访问柱的值。