После создания диаграммы js линейный график на оси x не отображаются все значения, пока я не нажму на один из наборов данных, чтобы скрыть / показать его. - PullRequest
0 голосов
/ 05 мая 2020

Я создал диаграмму js линейную диаграмму, но когда я загружаю свою страницу, она показывает только 2 значения по оси x диаграмма с 2 значениями на оси x

enter image description here

Каждый раз, когда я нажимаю на один из наборов данных в верхней части диаграммы, появляются остальные значения.

диаграмма, показывающая все значения после нажатия легенды

enter image description here

Ниже приведена диаграмма js код

const canvas = document.getElementById('canvas') as HTMLCanvasElement;
const ctx = canvas.getContext('2d');
this.chart = new Chart(ctx, {
  type: 'line',
  data: {
    labels: this.statDates,
    datasets: [
      {
        label: 'CPU %',
        data: this.cpustat,
        borderColor: '#3cba9f',
        fill: false
      },
      {
        label: 'RAM %',
        data: this.ramstat,
        borderColor: '#ffcc00',
        fill: false
      },
      {
        label: 'DiskIO %',
        data: this.diskiostat,
        borderColor: '#FF4500',
        fill: false
      },
      {
        label: 'DiskRead %',
        data: this.diskreadstat,
        borderColor: '#FF00FF',
        fill: false
      },
      {
        label: 'Disk Write %',
        data: this.diskwritestat,
        borderColor: '#800000',
        fill: false
      },
    ]
  },
  options: {
    legen: {
      display: false
    },
    scales: {
      xAxes: [{
        display: true
      }],
      yAxes: [{
        disable: true,
        ticks: {
          suggestedMin: 0,
          suggestedMax: 100
      }
      }]
    }
  }
}

Ниже приведен документ html для диаграммы

    <div>
<canvas id="canvas"> {{chart}} </canvas>
</div>

Я использую Angular v 9.1.3

...