JSFiddle - React, Tailwind, and code Playground

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="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

var data = [];
var data2 = [];
var chartData = [
  {
    'January':'1',
    'February':'2',
    'March':'3',
    'April':'4',
    'May':'5',
    'June':'6',
    'July':'7',
    'August':'8',
    'September':'9',
    'October':'10',
    'November':'11',
    'December':'12'
  },
  {
    'January':'12',
    'February': '11',
    'March':'10',
    'April':'9',
    'May':'8',
    'June':'7',
    'July':'6',
    'August':'5',
    'September':'4',
    'October':'3',
    'November':'2',
    'December':'1'
  }
]

for( var i=0; i<chartData.length; i++) {
  var dataPoints = [];
  var axisYType = "primary";
  //nsole.log(chartData[i])
  for (var obj in chartData[i]) {
    if(i == 0){
      if (chartData[i].hasOwnProperty(obj)) {      	
        dataPoints.push({label : obj, y: Number(chartData[i][obj])});
      }
    }
    else
    {
      if (chartData[i].hasOwnProperty(obj)) {
        dataPoints.push({label : obj, y: Number(chartData[i][obj])});
      }
      axisYType = "secondary"
    }
  }
  data.push({
    type: 'line',
    axisYType: axisYType,
    dataPoints: dataPoints
  })
}
var chart= new CanvasJS.Chart('chartContainer', {
  title:{
    text: 'Multiple y – axis'
  },
  axisY2: {
  },
  axisY: {
  },
  toolTip: {
    shared: true
  },
  data:data
});
chart.render();