Multiple y - axis - CanvasJS
Multiple y - axis - CanvasJS
by katsukino
HTML
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 360px; width: 100%;"></div>
JavaScript
var chart= new CanvasJS.Chart("chartContainer", {
zoomEnabled:true,
zoomType:"xy",
title:{
text: "Multiple y - axis"
},
axisY2: {
includeZero: false,
title: "Secondary Y - Axis"
},
axisY: {
title: "Primary Y - Axis"
},
data: [
{
type: "line",
dataPoints: [
{ x: 10, y: 14.00 },
{ x: 20, y: 13.75 },
{ x: 30, y: 16.30 },
{ x: 40, y: 18.30 },
{ x: 50, y: 12.30 },
{ x: 60, y: 19.30 },
]
},
{
type: "line",
axisYType: "secondary",
dataPoints: [
{ x: 10, y: 50.00 },
{ x: 20, y: 45.50 },
{ x: 30, y: 30.50 },
{ x: 40, y: 35.50 },
]
}
]
});
chart.render();