Documentation
Learn all about jCanvasjCanvas
Canvas
- Clear Canvas
- Rotate Canvas
- Scale Canvas
- Translate Canvas
- Pixel Manipulation
- Get Canvas Image
- Draw Manually
- Detect Pixel Ratio
Drawings
Layers
Events
Styles
Get Canvas Image
The getCanvasImage()
method retrieves the canvas’s image data as a string. The string is a base64-encoded image URL, which can be used as a valid image URL for any purpose.
$('canvas').getCanvasImage();
The default image type is PNG, although you can specify PNG, or JPEG.
$('canvas').getCanvasImage('png');
$('canvas').getCanvasImage('jpeg');
Setting Quality
If you choose to retrieve the canvas image as a JPEG, you may also set the JPEG’s quality (which ranges from 0
to 1
).
$('canvas').getCanvasImage('jpeg', 0.5);
Notes
This method does not work on Google Chrome if the page is served from a file URL (file://
). This is a limitation of Google Chrome’s sandboxing architecture, and therefore cannot be fixed. However, this method still works when the page is served from a server (either online or running locally via localhost://
).