vendure icon indicating copy to clipboard operation
vendure copied to clipboard

On admin-ui the picture of the product is not centered so it seem is missing

Open giosueDelgado opened this issue 1 year ago • 1 comments

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

  1. go inside a product page
  2. scroll down to the pictures section
  3. click on a picture
  4. click on preview
  5. 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

giosueDelgado avatar Feb 06 '24 16:02 giosueDelgado

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.

michaelbromley avatar Feb 07 '24 09:02 michaelbromley