如何使用JavaScript仅在X轴上绘制?

时间:2019-07-02 21:05:36

标签: javascript

对于示例30,

Y轴将是恒定的。x轴中的每个单位都会有不同的颜色。如何使用javascript解决此问题?

我正在使用char.js。这是我的代码:

var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
  type: 'bar',
    options: {
      legend: {
        display: false,
      },
      scales: {
        xAxes: [{
          gridLines: {
            display: false,
          },
          ticks: {
            fontSize: 15,
            fontColor: 'lightgrey'
          }
        }],
        yAxes: [{
          gridLines: {
            drawBorder: false,
            display: false,
          },
          ticks: {
            beginAtZero: true,
            fontSize: 15,
            fontColor: 'lightgrey',
            maxTicksLimit: 5,
            padding: 25,
          }
        }]
      },
      tooltips: {
        backgroundColor: '#1e90ff'
      }
    },
    data: {
      labels: ['M', 'Tu', 'W', 'Th', 'F', 'Sa', 'Su'],
    datasets: [{
      data: [0, 0, 0, 11, 9, 17, 13],
      tension: 0.0,
      borderColor: 'rgb(255,190,70)',
      backgroundColor: 'rgba(0,0,0,0.0)',
      pointBackgroundColor: ['white', 'white', 'white', 'white', 'white', 'white', 'rgb(255,190,70)'],
      pointRadius: 1,
      borderWidth: 1
    }]
  }
});

我需要制作仅在x轴上的自定义条形图。

0 个答案:

没有答案