Open adi-wtag opened 2 months ago
Hi @Mawi137 , any suggestion ?
Did you try setting the min-height of the image cropper itself to 265px? You can then use the transform input to center the image vertically.
@Mawi137 , If I set the min height on image cropper itself, it does take the height, but the canvas is still small. I can't go outside of it.
I am trying the canvas to take the whole space of the image cropper and then on scale increase or decrease, it should zoom in and out.
I haven't checked, but I think the canvas size can't be bigger than the image size. If you share code with us we can have a look and see what's going wrong.
I think what mawi is saying is to vertically center the inner red box in your screenshot.
Here is a demo I made, it might help you: https://stackblitz.com/~/github.com/alpesh88ww/ngx-image-cropper-primeng
Thanks for the demo :)
I wanted to see how @adi-wtag had his code set up, but it doesn't really matter now. I had a look at the code and how it is now what they're asking for can't be done.
The HTML is image-cropper > div > and all the elements that render the stuff in the little red box. That's why the canvas isn't setting up the entire space. That div's css needs to change for that to happen. Also the cropper box css. It uses fixed px values for positioning and size. Maybe using % would work.
But some questions... Your small img is going to look pixelated from the start if you do this. Is that what you want? Also what do you mean by zooming in and out? The smaller red box becoming bigger and smaller?
I have implemented the image cropper with a static height and width of 170 for cropper and a aspect ratio of 2.25 For large image everything is working properly. For example :
But if i choose a image that has insignificant dimension, for example : 100 x 100
It looks like this :
The reason behind this is that I was wrapping the image cropper with a wrapper that has min height set to 265 px.
I want the canvas size to be of height 265px always regardless of image dimension. How can I achieve this ? Any suggestion would really mean so much for me. I am kinda stuck here.