JSFiddle - React, Tailwind, and code Playground

by baumrock

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/moment.js"></script>
<canvas id="chart"></canvas>

JavaScript

var options = {
  type: 'line',
  data: {
    labels: ['one'],
    datasets: [{
      label: 'ONE',
      backgroundColor: 'red',
      borderColor: 'red',
      fill: false,
      data: [{
        x: "2021-02-01",
        y: 10
      }, {
        x: "2021-03-01",
        y: 10
      }, {
        x: "2021-04-01",
        y: 10
      }, {
        x: "2021-05-01",
        y: 10
      }],
    }]
  },
  options: {
    plugins: {
      title: {
        text: 'Chart.js Time Scale',
        display: true
      }
    },
    scales: {
      x: {
        type: 'time',
        time: {
          tooltipFormat: 'DD T'
        },
        title: {
          display: true,
          text: 'Date'
        }
      },
      y: {
        title: {
          display: true,
          text: 'value'
        }
      }
    },
  },
}
var chart = new Chart(document.getElementById('chart'), options);