FabricJS - Rotate Object via Variable Name on Button Click
Using a button click, rotate an object on the FabircJS Canvas that is specified by a variable.
by Simon060694
HTML
<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<script src="http://promincproductions.com/gaTrackingJSFiddle.js"></script>
<button id="rotate">Rotate Image 15°</button>
<canvas id="c" width="400" height="400"></canvas>
CSS
canvas{
border-width: 1pz;
border-style: solid;
border-color: #000;
}
JavaScript
var canvas = new fabric.Canvas('c');
var src = "http://fabricjs.com/lib/pug.jpg";
var rotateThisImage;
fabric.Image.fromURL(src, function(oImg) {
oImg.set({
width: 200,
height: 200,
originX: 'left',
originY: 'top'
});
canvas.add(oImg);
canvas.centerObject(oImg);
canvas.renderAll();
rotateThisImage = oImg;
});
var curAngle = 0;
$("#rotate").click(function(){
rotateThisImage.setAngle(curAngle+15);
canvas.renderAll();
});