Show Legend Text even when DataPoints are not present in a DataSeries - CanvasJS JavaScript Charts

Show Legend Text even when DataPoints are not present in a DataSeries - 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: "Show Legend even when DataPoints is empty"
		},
		data: [{
				type: "line",
				showInLegend: true,				
				dataPoints: []
		},
		{
				type: "line",
				showInLegend: true,				
				dataPoints: [
						{ x: 10, y: 7 },
						{ x: 20, y: 5 },
						{ x: 30, y: 5 },
						{ x: 40, y: 6 },
						{ x: 50, y: 9 },
						{ x: 60, y: 6 },
						{ x: 70, y: 2 },
						{ x: 80, y: 3 },
						{ x: 90, y: 1 }

				]
		}
		]
});

addOrRemoveDatapoints(chart);
chart.render();

function addOrRemoveDatapoints(chart) {
    for(var i = 0; i < chart.options.data.length; i++)	{		
        if(chart.options.data[i].dataPoints.length < 1){
          chart.options.data[i].dataPoints.push({});
        }
        for(var j = 0; j < chart.options.data[i].dataPoints.length; j++){
            if(jQuery.isEmptyObject(chart.options.data[i].dataPoints[j]) && chart.options.data[i].dataPoints.length > 1){
                 chart.options.data[i].dataPoints.splice(j, 1);
            }
        }
    }
}