Chartjs-timeseries-simple

by jpeter06

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js"></script>

    <title>Chart.js - Time series line chart</title>
</head>
<body>
    <canvas id="my-simple-chart"></canvas>
</body>

<script>
var data1 = {
    label: 's1',
    borderColor: 'blue',
    data: [
            { x: '2022-12-01 21:00', y: 50 },
            { x: '2022-12-02 21:00', y: 91 },
            { x: '2022-12-03 21:00', y: 150 },
        ]
};

var ctx = document.getElementById('my-simple-chart').getContext('2d');
var chart = new Chart(ctx, {
  type: 'line',pointStyle:'rect',
  data: { datasets: [data1] },
  options: {
    responsive: true,
    elements: {pointStyle:'rect'},
    scales: {
      xAxes: [{pointStyle:'rect',
        type: 'time'
      }]
    }
  }
});
</script>
</html>