search

cstefanache / angular2-img-cropper

Angular 2 Image Cropper
MIT License
364 stars 135 forks source link

Resize Cropper #181

Closed stefannikolei closed 6 years ago

stefannikolei commented 7 years ago

Is there a way to resize the width of the cropper?

I am only able to initially set the width and heights. I want to set this dynamically.

cstefanache commented 7 years ago

please check dynamicSizing=true on the settings

stefannikolei commented 7 years ago

i have not set dynamicSizing. Setting it to true results into displaying nothing.

stefannikolei commented 7 years ago

this.cropperSettings = new CropperSettings(); this.cropperSettings.width = 250; this.cropperSettings.height = 250; this.cropperSettings.canvasWidth = 250; this.cropperSettings.canvasHeight = 250; this.cropperSettings.croppedWidth = this.cropperSettings.canvasWidth; this.cropperSettings.croppedHeight = this.cropperSettings.canvasHeight; this.cropperSettings.noFileInput = true; this.cropperSettings.cropperDrawSettings = new CropperDrawSettings(); this.cropperSettings.cropperDrawSettings.strokeColor = '#C41622'; this.cropperSettings.cropperDrawSettings.strokeWidth = 2;

Those are my settings

This is my Template <img-cropper #myCropper [image]="data" [(settings)]="cropperSettings" [ngClass]="{hidden: !data.original}"></img-cropper>

zbarbuto commented 7 years ago

Set it to true and add some sass/css to the canvas by giving it a class with cropperClass:

this.cropperSettings.cropperClass = 'myCropper';
.myCropper {
  display: block;
  width: 100%;
  height: 100%;
}