To convert HTML5 canvas to PNG, follow the below-given steps −
You need to add the generated data URL to the href attribute of an <a> tag.
Dialog for base64 image −
<img src="data:image/png;base64,iOBVRw0KGgoAAAANSUhEUg...." class="image" />
Add a filename −
<a download="newimg.png" href="...">
Now define http headers −
headers=Content-Disposition: attachment; filename=newimg.png
To deal with the RAM of the web browser and make its utilization less −
// generated the data URL dynamically function myCanvas() { var d = canvas.toDataURL('image/png'); this.href = d; }; d.addEventListener('click', myCanvas, false);