This project is read-only.

border on image


I just discovered a small issue where a jpeg I loaded but never adjusted the crop handles for ended up being generated with a 1px border on the left and right of the image.
I fixed this by adjusting the crop in the backoffice to pull the handles inside the edges of the preview, and then back out again and the bars are gone, but it took us a while of trying to figure out why our images were not "visually" lining up with the containers (they were in fact, it just had a white line on left & right)
I seem to recall having a similar issue when using jCrop myself in a different project and think I handled this by checking if the crop coordinates were outside my expected range and clamping them before further processing.


agrath wrote Feb 17, 2014 at 7:55 PM

Further to this, we've identified when this happens and it's not to do with the crop handles being lined up with the edges of the image as I first thought.
From what I can tell, it occurs when doing an aspect ratio crop and for some reason the output image is 1px out in height compared to width, so the aspect ratio is ever so slightly wrong.
I suspect this is due to the cropper itself having a different size window and therefore the crop location needs to be scaled to the image location and a rounding error is introduced.
In our scenario, we had a fixed width/height container that was a rectangular aspect ratio and then defined a crop that matched that size exactly. On some crops, we would get a white line in the container (background shining through, image was 1px not high enough) but if we slightly adjusted the crop size, it would be fine.
Moving the crop location didn't seem to affect whether we got an image that was 1px too small or not.
Seems like rounding