How to set the initial cropper rectangular?

Hi, first of all: Thanks for your excellent work!

Background: I’m using Angular 7 with face detection tool and would have available the proposed rectangular to crop from original image.

My issue: I’m sorry but I could not find out how to set the initial cropper rectangular coordinates. And yes, I tried cropper, but no success 😦

This did NOT work as intended: HTML: <image-cropper ... [cropper]="cropper"></image-cropper> JS: cropper:any = { x1: 0, y1: 0, x2: 200, y2: 300 };

Thank’s for any hints!

Similar to #52

[anantksingh]

HI, I am unable to set cropper position fix, it take full space <image-cropper [imageChangedEvent]=“imageChangedEvent” [maintainAspectRatio]=“true” [aspectRatio]=“1/1” [resizeToWidth]=“0” [onlyScaleDown]=“true” [roundCropper]=“false” format=“fileExtention” outputType=“both” (imageCropped)=“imageCropped($event)” (imageLoaded)=“imageLoaded()” (cropperReady)=“cropperReady()” (loadImageFailed)=“loadImageFailed()” [cropper] =“coordinates” [style.display]=“showCropper ? null : ‘none’”> </image-cropper>
Declare in two place
fileChangeEvent(event: any,templateUpload): void {
this.coordinates={x1: 161.5, y1: 34, x2: 360.5, y2: 233};
} imageLoaded() { this.showCropper = true; setTimeout(() => { this.coordinates={x1: 161.5, y1: 34, x2: 360.5, y2: 233}; console.log(‘Image loaded’,this.coordinates) }, 1000);

}

[NavjotKumar]

Cropper is not working

cropper = { x1: 0, y1: 0, x2: 410, y2: 546 };

i have added timeout also imageLoaded() { this.cropperReady = true; if (this.cropperReady === true) { setTimeout(() => { this.cropper = { x1: 0, y1: 0, x2: 410, y2: 546 }; }); console.log(this.cropper ); } }

this is html part

<image-cropper [imageChangedEvent]=“imageChangedEvent” [maintainAspectRatio]=“true” [aspectRatio]=“selectedRatio” format=“png” [imageQuality]=“85” [resizeToWidth]=“410” (imageLoaded)=“imageLoaded()” (loadImageFailed)=“loadImageFailed()” (imageCroppedBase64)=“imageCropped($event)” [style.display]=“cropperReady ? null : ‘none’”
outputType=“both” [cropper]=“cropper” [autoCrop]=false ></image-cropper>

Cropper is working fine in “ngx-image-cropper”: “0.1.21” i have tried your (@Mawi137 ) starblitz exaple https://stackblitz.com/edit/image-cropper-set-position

But not in “ngx-image-cropper”: “^1.3.8” https://stackblitz.com/edit/image-cropper

Both are your example only