jQuery plugin to crop images within an area (fully responsive), allowing to drag (touch support), zoom and rotate.
Hi is there a way to update a guillotine instance? I try doing
var picture = $('#image');
picture.guillotine('remove');
picture.guillotine({width:300, height:400, init: {x: 10, y:10}})
but this gives very strange results, the height/width becomes a lot bigger then the values I put in.
I'm working on a cropper that should be able to crop in multiple sizes so I need to be able to switch the cropper size dynamically
<?php
$img = new Imagick('example.jpg');
$img->scaleImage($imgWidth * $scale, 0);
?>
No. Removing Guillotine's instance doesn't unbind events from your buttons.
For example, if you binded the zoom in button like this:
picture.on('load', function(){
$('#zoom-in-button').click(function(){
picture.guillotine('zoomIn');
});
});
Doesn't matter if you removed and recreated the instance, picture.guillotine('zoomIn')
calls wichever Guillotine instance is present over picture
.
Then if you also swaped/reloaded images over the same element (changed picture
's src attribute), each time an image is loaded you bind a new onclick
event to the same button.
If you load the image 3 times, then picture.guillotine('zoomIn')
will be called 3 times every time you click the zoom-in button.
onload
event like above, use jQuery's one instead of on
. That will call the handler only the first time, not each time the picture loads.
var ctx = canvas.getContext("2d");
ctx.drawImage(picture, 0, 0);