Showing Date-Time values on a Chart Axis - 1 | JSFiddle Sample Code

Showing Date-Time values on a Chart Axis - 1 | JSFiddle Sample Code

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>

  <div id="chartContainer" style="height: 300px; width: 100%;">
  </div>
<div style="margin-top:16px;color:dimgrey;font-size:9px;font-family: Verdana, Arial, Helvetica, sans-serif;text-decoration:none;">Source: <a href="https://canvasjs.com/docs/charts/basics-of-creating-html5-chart/date-time-axis/" target="_blank" title="Showing Date-Time values on a Chart Axis ">https://canvasjs.com/docs/charts/basics-of-creating-html5-chart/date-time-axis/</a></div>

JavaScript

window.onload = function() {
  var chart = new CanvasJS.Chart("chartContainer", {
    zoomEnabled: true,

    axisX: {
      valueFormatString: "YYYY-MM-DD HH:mm K",
    },
    data: [{
      type: "area",
      xValueType: "dateTime",
      dataPoints: [{
          "x": 1601006400003,
          "y": 0.004
        },
        {
          "x": 1601007299997,
          "y": 0.003
        },
        {
          "x": 1601008200000,
          "y": 0.003
        },
        {
          "x": 1601009100003,
          "y": 0.003
        },
        {
          "x": 1601009999997,
          "y": 0.003
        },
        {
          "x": 1601010900000,
          "y": 0.004
        },
        {
          "x": 1601011800003,
          "y": 0.005
        },
        {
          "x": 1601012699997,
          "y": 0.005
        },
        {
          "x": 1601013600000,
          "y": 0.006
        },
        {
          "x": 1601014500003,
          "y": 0.008
        }
      ]
    }]
  });

  chart.render();
}