Question

我一直试图改变背景线的颜色，以及轴的字体大小和颜色，但无济于事。我目前正在使用最新版本的chart.js，而且似乎无法弄清楚如何进行更改。在旧版本的图表中，我可以更改它们，但该代码不再有效。

http://www.chartjs.org/docs

这是我的代码：

var lineoptions = {
    legend:{
      display:false
    },
    scales:{
      yAxes:[{
        display:false
      }]
    },
    tooltips:{
      enabled:false
    },
    elements:{
      point:{
        radius:4,
        borderWidth:2
      }
    }
  };
  var linedata = {
    labels:[
      "618",
      "39",
      "1734",
      "3459"
    ],
    datasets:[
    {
      data:[618,39,1734,3459],
      fill:false,
      borderColor:"rgba(227,6,20,1)",
      pointBorderColor:"rgba(227,6,20,1)",
      pointBackgroundColor:"rgba(255,255,255,1)",
      pointHoverBackgroundColor:"rgba(255,255,255,1)",
      pointHoverBorderColor:"rgba(227,6,20,1)",
    }]
  };
  var linechart = document.getElementById("canvas-line").getContext("2d");
  var myLineChart = new Chart(linechart,{
    type:'line',
    data:linedata,
    options:lineoptions
  });

*编辑*

我设法通过使用以下方法更改轴信息的颜色：

defaultFontColor:'#6d6e71',

但我仍然需要弄清楚如何更改图表本身的背景线（x和y线）。

Answer 1

好的，我明白了：

scales:{
  xAxes:[{
    gridLines:{
      color:"rgba(255,255,255,0.5)",
      zeroLineColor:"rgba(255,255,255,0.5)"
    }
  }],
  yAxes:[{
    display:false
  }],
}

图表js更改折线图轴字体大小/颜色和背景线

1 个答案: