【问题标题】:chart.js label color change based on valuechart.js 标签颜色根据值变化
【发布时间】:2019-07-24 03:17:49
【问题描述】:

我有一个 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
                }
            }]
        }   
    }
});`

有什么想法吗?

【问题讨论】:

    标签: javascript charts chart.js chartjs-2.6.0


    【解决方案1】:

    用途:

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

    【讨论】:

      猜你喜欢
      • 2016-06-08
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-07-08
      • 1970-01-01
      • 1970-01-01
      • 2016-10-21
      相关资源
      最近更新 更多