andrefarzat / ng-jcrop

Angular directive to jCrop jQuery plugin
GNU General Public License v2.0
101 stars 39 forks source link

Increase size of image? #29

Closed johneriksson closed 9 years ago

johneriksson commented 9 years ago

I haven't found a way to set the size of the cropper-div. No matter what css-width or height I apply, it remains roughly 300 x 170. Or is it some config I have to do in app.config?

johneriksson commented 9 years ago

I was able to solve my problem by editing some lines in ng-jcrop.js.

ng-jcrop.js line 247: changed from

"aspectRatio: 1,"

to

"aspectRatio: $rootScope.aspectRatio,"

So to change the size and aspect ratio I just call:

ngJcropConfig.widthLimit = 1000;
ngJcropConfig.heightLimit = 250;
ngJcropConfig.jcrop.maxHeight = 250;
ngJcropConfig.jcrop.maxWidth = 1000;
$rootScope.aspectRatio = 4;

from my controller.

If this is not a good way to do it or not the way you have in mind please update the instructions.

andrefarzat commented 9 years ago

You could have used the ngJcropConfigProvider to change the aspectRatio. Example:

app.config(function(ngJcropConfigProvider){
    // [optional] To change the jcrop configuration
    // All jcrop settings are in: http://deepliquid.com/content/Jcrop_Manual.html#Setting_Options
    ngJcropConfigProvider.setJcropConfig({
        bgColor: 'black',
        bgOpacity: .4,
        aspectRatio: 16 / 9
    });
)};