CanvasImageSaver
Cool library that let's you save your canvas as a png image on desktop and mobile. It also provides cropping options.
For mobile compatibility you need Cordova and Canvas2ImagePlugin as dependencies.
Installation
Bower
- Install with bower:
bower install canvas-image-saver --save
- Add script tag in your index.html:
<script src="bower_components/canvas-image-saver/dist/canvasImageSaver.min.js"></script>
Npm & Browserify
- Install with npm:
npm install canvas-image-saver --save
- Require with browserify:
var CanvasImageSaver = require('canvas-image-saver');
Parameters
canvas
: The canvas HTML5 element you want to save as image.cropOptions
: Optional.successCallback
: Optional.errorCallback
Optional.callbackContext
Optional.
Crop Options
xCropOffset
: Optional. The x coordinate where to start clipping.yCropOffset
: Optional. The y coordinate where to start clipping.width
: Optional. The width of the clipped image.height
: Optional. The height of the clipped image.
Usage (Phaser example)
var canvasImageSaver = thisgamecanvas xCropOffset: 180 yCropOffset: 0 width: 470 height: thisgameheight { // Success callback } { // Error callback } this; canvasImageSaver;
TODO: Refactor using Q promises