更改条形图的最后一个条形颜色

时间:2016-02-02 04:02:02

标签: javascript

我正在使用chart.js来创建图表。到目前为止,一切都很好。我的目标是给条形图的最后一个条带一个不同的颜色。我查看了chart.js文档,但我没有找到任何动态更改条形颜色的选项。

这是我目前的代码:

var barChartData = { labels : livelabels, 
                     datasets : [ { fillColor : "#E76E42", 
                                    strokeColor : "#C7754C", 
                                    data : livedata, } ] }; 
function showBarChart() { 
    var ctx = document.getElementById("barChartCanvas").getContext("2d"); 
    var myBarChart = new Chart(ctx).Bar(barChartData,options); 
}   

$('#barChart').appear( function(){  
    $(this).css({ opacity: 1 }); 
    setTimeout(showBarChart,300); 
    },{accX: 20, accY: -10},'easeInCubic'); 

1 个答案:

答案 0 :(得分:0)

以下代码可用于为条形图上色。

 BarChart.datasets[0].bars[0].fillColor = "#c53938"; //bar 1
 BarChart.datasets[0].bars[0].strokeColor = "#c53938"; //bar 1
 BarChart.datasets[0].bars[0].highlightFill = "#c53938"; //bar 1
 BarChart.datasets[0].bars[0].highlightStroke = "#c53938"; //bar 1

您可以根据需要使用条形码。

希望这有帮助。

- 帮助:)