vendure
vendure copied to clipboard
On admin-ui the picture of the product is not centered so it seem is missing
Describe the bug
The product picture preview is not centered and it doesn't show the full photo width and height. The picture is cut.
To Reproduce
- go inside a product page
- scroll down to the pictures section
- click on a picture
- click on preview
- see error. Clicking on the file name is possible to see the full dimension picture
Expected behavior What I expect to see is the centered picture without any difference in terms of width and eight with the original picture.
Environment (please complete the following information):
- @vendure/core version: v2.1.3
- Nodejs version: 16
- Database (mysql/postgres etc): postgres
Additional context
If no focal point is set for an image, then when it is cropped it will by default use Sharp's "entropy" strategy (docs) which will "focus on the region with the highest Shannon entropy ."
Here's the Vendure source code where that happens: https://github.com/vendure-ecommerce/vendure/blob/5a0cbe61f3297119368c6aec76249e286760249b/packages/asset-server-plugin/src/transform-image.ts#L33
In most cases this makes a reasonable guess as to where to center a cropped image. It is not always right though, which is why we have the "focal point" feature so you can manually specify the center point of an image and then that will be used when cropping rather than the entropy stragtegy.