Sync Crosshiar across multiple charts with date time over Axis Y - CanvasJS JavaScript Charts

Sync Crosshiar across multiple charts with date time over Axis Y - CanvasJS JavaScript Charts

by canvasjs

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer1" style="height: 300px; width: 30%; display: inline-block;"></div>
<div id="chartContainer2" style="height: 300px; width: 30%; display: inline-block;"></div>
<div id="chartContainer3" style="height: 300px; width: 30%; display: inline-block;"></div>

JavaScript

var chart1 = new CanvasJS.Chart("chartContainer1", {
  title: {
    text: "Chart 1"
  },
  toolTip:{
    shared: true,
    content:"{x}-" + CanvasJS.formatDate(Number("{y}"), "D/MMM/YY")
  },
  axisY: {
    includeZero: false,
    labelFormatter: function(e) {
      return CanvasJS.formatDate(e.value, "D-MMM-YY")
    },
    crosshair: {
      enabled: true,
      labelFormatter: function(e) {
        return CanvasJS.formatDate(e.value, "D-MMM-YY")
      },
    },
  },
  data: [{
    type: "line",
    dataPoints: randomData(1, 50, 1000)
  },{
    type: "line",
    dataPoints: randomData(1, 30, 1000)
  },{
    type: "line",
    dataPoints: randomData(1, 30, 1000)
  }]
});

var chart2 = new CanvasJS.Chart("chartContainer2", {
  title: {
    text: "Chart 2"
  },
  toolTip:{
    shared: true,
    content:"{x}-" + CanvasJS.formatDate(Number("{y}"), "D/MMM/YY")
  },  
  axisY: {
    includeZero: false,
    labelFormatter: function(e) {
      return CanvasJS.formatDate(e.value, "D-MMM-YY")
    },
     crosshair: {
      enabled: true,
      labelFormatter: function(e) {
        return CanvasJS.formatDate(e.value, "D-MMM-YY")
      },
    },
  },
  data: [{
    type: "line",
    dataPoints: randomData(1, 50, 1000)
  },{
    type: "line",
    dataPoints: randomData(1, 90, 1000)
  }]
});

var chart3 = new CanvasJS.Chart("chartContainer3", {
  title: {
    text: "Chart 3"
  },
  toolTip:{
    shared: true,
    content:"{x}-" + CanvasJS.formatDate(Number("{y}"), "D/MMM/YY")
  },  
  axisY: {
    includeZero: false,
    labelFormatter: function(e) {
      return CanvasJS.formatDate(e.value, "D-MMM-YY")
    },
     crosshair: {
      enabled: true,
      labelFormatter: function(e) {
        return CanvasJS.formatDate(e.value, "D-MMM-YY")
      },
    },
  },
  data: [{
    type: "line",
    dataPoints: randomData(1, 90, 400)
  },
         {
           type: "line",
           dataPoints: randomData(1, 90, 1000)
        ...