Chartjs-Chart.js will not show up second line

by

0👍

✅

Your second dataset data array is double wrapped:

data: [
        [8.43, 8.5, 8.39, 8.38, 8.38],
      ],

Removing the second set of brackets generates the graph correctly.

var config = {
  type: 'line',
  data: {
    labels: ['16:30', '17:30', '18:30', '19:30', '20:30'],
    datasets: [{
      label: 'High',
      backgroundColor: 'blue',
      borderColor: 'blue',
      data: [10.43, 10.42, 10.44, 10.43, 10.40],
      fill: false,
    }, {
      label: 'low',
      fill: true,
      backgroundColor: 'red',
      borderColor: 'red',
      data: [8.43, 8.5, 8.39, 8.38, 8.38], // ****THIS IS WHERE THE UPDATE IS****
    }]
  },
  options: {
    responsive: true,
    title: {
      display: true,
      text: 'Test'
    },
    tooltips: {
      mode: 'index',
      intersect: false,
    },
    hover: {
      mode: 'nearest',
      intersect: true
    },
    scales: {
      xAxes: [{
        display: true,
        scaleLabel: {
          display: true,
          labelString: 'Time'
        }
      }],
      yAxes: [{
        display: true,
        scaleLabel: {
          display: true,
          labelString: 'Value'
        }
      }]
    }
  }
};
var ctx = $('#dia');
var myChart = new Chart(ctx, config);
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.js"></script>


<canvas id="dia"></canvas>

Leave a comment