chart.js标签基于值的颜色变化

时间:2019-03-02 05:54:57

标签: javascript charts chart.js chartjs-2.6.0

我有一个chart.js的水平图表,看起来像这样。my bar chart

我正在寻找一种更改左侧“ Boozman John,Eldridge Conner等”标签的方法。基于我从ajax调用中获得的列表中的值。

我尝试过类似的事情

labels {
    fontColor: labelcolors
},

带有for循环以获取“ labelcolors”列表中的颜色,但无效。

这是我的代码

`var ctx = document.getElementById("GeneralChart");
var GeneralChart = new Chart(ctx, {
    type: "horizontalBar",
    data: {
  labels: gen_candidate,
  datasets: [
    {
      label: "Committee expenditure",
      backgroundColor: "orange",
      borderColor: "yellow",
      borderWidth: 1,
      xAxisID: "expenditure",
      data: gen_expenditure
    },
    {
      label: "General votes",
      backgroundColor: "green",
      borderColor: "green",
      borderWidth: 1,
      xAxisID: "votes",
      data: general_votes
    },
  ]
},
    options: {
    responsive: true,
    legend: {
        position: "top"
    },
    title: {
        display: true,
        text: "Money and Votes for General Election "+ state
    },
    scales: {
        yAxes: [{
                    position:"left",
                    id: "y-axis",
                    ticks: {
                        autoSkip: false,
                    }
                }],
        xAxes: [{
            type: 'linear',  //type: 'linear', is needed for horizontal vote
            position: "top",
            id: "expenditure",
        }, {
            type: 'linear',
            position: "bottom",
            id: "votes",
        ticks: {
            beginAtZero: true
                }
            }]
        }   
    }
});`

有什么主意吗?

1 个答案:

答案 0 :(得分:0)

使用:

ticks: { 
    fontColor: "#377216", 
    beginAtZero: true 
    }