Skip to content

Instantly share code, notes, and snippets.

@abc0990cba
Forked from Kaundur/canvasDownload.js
Created January 9, 2024 10:00
Show Gist options
  • Select an option

  • Save abc0990cba/caf94ccbf12144518813292fb0015cd2 to your computer and use it in GitHub Desktop.

Select an option

Save abc0990cba/caf94ccbf12144518813292fb0015cd2 to your computer and use it in GitHub Desktop.
JS to automatically download canvas as a png
// This code will automatically save the current canvas as a .png file.
// Its useful as it can be placed in a loop to grab multiple canvas frames, I use it to create thumbnail gifs for my blog
// Only seems to work with Chrome
// Get the canvas
var canvas = document.getElementById("canvas");
// Convert the canvas to data
var image = canvas.toDataURL();
// Create a link
var aDownloadLink = document.createElement('a');
// Add the name of the file to the link
aDownloadLink.download = 'canvas_image.png';
// Attach the data to the link
aDownloadLink.href = image;
// Get the code to click the download link
aDownloadLink.click();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment