Skip to content

Instantly share code, notes, and snippets.

@sonthanhdan

sonthanhdan/canvasDownload.js

Forked from Kaundur/canvasDownload.js
Created September 19, 2024 10:34
Show Gist options
  • Save sonthanhdan/af8d15d3acc1c9bbd851f759adce2ba8 to your computer and use it in GitHub Desktop.
Save sonthanhdan/af8d15d3acc1c9bbd851f759adce2ba8 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @Kaundur Kaundur created this gist Jun 8, 2017.
    16 changes: 16 additions & 0 deletions canvasDownload.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,16 @@
    // 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();