ipx icon indicating copy to clipboard operation
ipx copied to clipboard

Support auto-rotation based on EXIF data

Open ascorbic opened this issue 3 years ago • 6 comments

If sharp's rotate() function is called without arguments then it will try to automatically rotate the image based on exif data. ipx currently doesn't support this, and can only do explicit rotation. It would be good if it either allowed rotate to be called without an angle, or if auto-rotation was the default (which would be my suggestion)

ascorbic avatar Aug 09 '22 11:08 ascorbic

Seems a good idea. Sharp has a global useExifOrientation option. We had it in previous versions of IPX (See #13) which can add back support and possibly enable by default. However not sure what was reasons sharp kept it disabled by default.

pi0 avatar Aug 09 '22 11:08 pi0

The global option does seem like a good idea

ascorbic avatar Aug 09 '22 12:08 ascorbic

Hi both, I started using ipx / nuxt-image and have just stumbled upon this issue for images in portrait format that I've been using. Indeed, it seems that the useExifOrientation option (introduced 6 years ago in this commit of sharp) was set to false from the beginning. See commit text.

Any idea when this could be implemented in ipx?

tmlmt avatar Mar 08 '23 02:03 tmlmt

Turns out it works just by providing the useExifOrientation option to sharp.

For instance in my case in Nuxt with the image module, in nuxt.config.ts:

  image: {
    sharp: {
      useExifOrientation: true,
    },
  },

or for IPX only, with the Programatic API:

const ipx = createIPX({
    // ...
    sharpOptions: {
        useExifOrientation: true,
    }
});

tmlmt avatar Oct 16 '23 02:10 tmlmt

Turns out it works just by providing the useExifOrientation option to sharp.

For instance in my case in Nuxt with the image module, in nuxt.config.ts:

  image: {
    sharp: {
      useExifOrientation: true,
    },
  },

or for IPX only, with the Programatic API:

const ipx = createIPX({
    // ...
    sharpOptions: {
        useExifOrientation: true,
    }
});

THat didn't seem to work for me. I'm using NextJS, does it make a difference?

michaelmannucci avatar Oct 20 '23 18:10 michaelmannucci