fabric.js setOverlayImage callback
HTML
<script src="https://rawgithub.com/kangax/fabric.js/master/dist/fabric.js"></script>
<img id="p" src="http://mattharrison.s3.amazonaws.com/card.png" />
<canvas id="c" width="500" height="500"></canvas>
CSS
canvas {
border: 1px solid #999;
}
img {
display: none;
}
JavaScript
/**
* fabric.js template for bug reports
*
* Please update the name of the jsfiddle (see Fiddle Options).
* This templates uses latest dev verison of fabric.js (https://rawgit.com/kangax/fabric.js/master/dist/fabric.js).
*/
// initialize fabric canvas and assign to global windows object for debug
var canvas = window._canvas = new fabric.Canvas('c', {imageSmoothingEnabled: true});
canvas.selection = true;
// Do some initializing stuff
fabric.Object.prototype.set({
transparentCorners: false,
cornerColor: 'rgba(102,153,255,0.5)',
cornerSize: 12,
padding: 5
});
console.log(canvas.imageSmoothingEnabled);
// ADD YOUR CODE HERE
canvas.setDimensions({width: 400, height: 400});
console.log(canvas.imageSmoothingEnabled);
var img = document.getElementById('p');
var circle = new fabric.Image(img, {height: 360, width: 228})
canvas.add(circle);