ovidiua2003
commented
6 years ago It's true, the plunker shows the cropped image as broken image. However I have tested locally and it works BUT the resulting crop doesn't have the size i want (150x150) but 1700x1700 from an original image of 5292x3528px;
Also, if I use the same image without preserveSize set to true, the resulting thumbnail is pixelated due to the cropping of the compressed image in the canvas.
Here are my cropper settings:
this.cropperSettings = new CropperSettings(); this.cropperSettings.width = 150; this.cropperSettings.height = 150; this.cropperSettings.croppedWidth =150; this.cropperSettings.croppedHeight = 150; this.cropperSettings.canvasWidth = 230; this.cropperSettings.canvasHeight = 200; this.cropperSettings.rounded = true; this.cropperSettings.keepAspect = true; this.cropperSettings.noFileInput = true; this.cropperSettings.preserveSize = true;
Also cannot add this.cropperSettings.cropOnResize as it's not part of my version of code, which I cannot update due to
npm WARN ng2-img-cropper@0.8.8 requires a peer of @angular/common@4.0.0 but none was installed. npm WARN ng2-img-cropper@0.8.8 requires a peer of @angular/compiler@4.0.0 but none was installed. npm WARN ng2-img-cropper@0.8.8 requires a peer of @angular/core@4.0.0 but none was installed.
yet those 3 are all at 4.3.5 as my package.json says
"@angular/common": "4.3.5", "@angular/compiler": "4.3.5", "@angular/core": "4.3.5",
Any advice from the author?
I have been struggling with the cropper on large images.
I have found that the image is not set correctly for large image.
To reproduce:
Modify the sample plunkr to have settings this.cropperSettings1.preserveSize = true;
And upload the following large image https://eoimages.gsfc.nasa.gov/images/imagerecords/73000/73751/world.topo.bathy.200407.3x21600x21600.B2.jpg
The cropped image will not display.