Show Image of Chart by exporting chart as base64 Image - CanvasJS JavaScript Charts

Show Image of Chart by exporting chart as base64 Image - CanvasJS JavaScript Charts

by canvasjs

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 360px; width: 100%;"></div>
<div id="imageContainer">
  <img id="chartImage" width="100%" height="360px">
</div>

JavaScript

var chart = new CanvasJS.Chart("chartContainer",
{
		title: {
			text: "Export Chart as base64 Image"
		},
		data: [
		{
			type: "spline",
			dataPoints: [ 
				{ x: 10, y: 4 }, 
				{ x: 20, y: 7 },
				{ x: 30, y: 2 },
				{ x: 40, y: 3 },
				{ x: 50, y: 5 }
			]
		}
		]
});

chart.render();

var base64Image = chart.canvas.toDataURL();
document.getElementById('chartContainer').style.display = 'none';
document.getElementById('chartImage').src = base64Image;