Custom labelFormatter for axis Y labels - CanvasJS JavaScript Charts

Custom labelFormatter for axis Y labels - 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="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

var chart = new CanvasJS.Chart("chartContainer",
	{
		title: {
			text: "Custom labelFormatter for axisY"
		},
		axisY: {
    	includeZero:false,
			interval: 10,
			labelFormatter: function (e) {
				return customLabel(e.value);
			}
		},
		data: [
      {
        type: "line",          
        dataPoints: [
          { x:new Date(2015, 02, 1), y:  14 },
          { x:new Date(2015, 02, 5), y:  21 },
          { x:new Date(2015, 02, 10), y: 38 },
          { x:new Date(2015, 02, 15), y: 30 },
        ]
      }
		]
	});
  
var arr = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten"];
var labels = {};
var interval = chart.options.axisY.interval;

for(var i = 0; i < arr.length; i++){
  labels[interval.toString()] = arr[i];
  interval += chart.options.axisY.interval;
}

chart.render();

function customLabel(value) {
	if (value && labels[value])
  	return labels[value];
  else
   	return value;
}