Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

resize(rotate: xx) in gatsby-transformer-sharp is not work. #5086

Closed
b6pzeusbc54tvhw5jgpyw8pwz2x6gs opened this issue Apr 23, 2018 · 4 comments · Fixed by #14302
Closed

resize(rotate: xx) in gatsby-transformer-sharp is not work. #5086

b6pzeusbc54tvhw5jgpyw8pwz2x6gs opened this issue Apr 23, 2018 · 4 comments · Fixed by #14302
Labels
help wanted Issue with a clear description that the community can help with. type: bug An issue or pull request relating to a bug in Gatsby

Comments

@b6pzeusbc54tvhw5jgpyw8pwz2x6gs

Description

GraphQL functionresize(width: 125, height: 125, rotate: 180) is not work.

Steps to reproduce

Visit demo page https://image-processing.gatsbyjs.org/
Compare images in resize part with the original images

I also checked that problem on my local test code.

Expected result

In demo page, images in resize part should be rotated.

Actual result

In demo page, images in resize part is not rotated.

Environment

Please check here https://github.com/gatsbyjs/gatsby/blob/master/examples/image-processing/package.json

@m-allanson m-allanson added type: question or discussion Issue discussing or asking a question about Gatsby type: bug An issue or pull request relating to a bug in Gatsby help wanted Issue with a clear description that the community can help with. and removed type: question or discussion Issue discussing or asking a question about Gatsby labels Apr 24, 2018
@m-allanson
Copy link
Contributor

Huh, that's odd. Would love if you have time to investigate what's causing this.

@pieh
Copy link
Contributor

pieh commented Apr 26, 2018

So i've did some digging and it seems this was broken for quite some time.

Here we do "empty" rotation to orient image using EXIF information - https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-plugin-sharp/src/index.js#L75

Later we do actual rotation if rotate arg is defined - https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-plugin-sharp/src/index.js#L124-L127

Problem is - when we do empty rotation sharp will lock into exif information and any rotation with actual value will have no effect ( https://github.com/lovell/sharp/blob/99810c03116f9951faf8b40fe0f8a02c55ce8b02/src/pipeline.cc#L82-L90 ).

So what we could do is don't start with empty rotation, check if user want to rotate and if not fallback to empty rotation or take this upstream (sharp repo) first and check there if this is expected behaviour (or do both :) ).

@KyleAMathews
Copy link
Contributor

Due to the high volume of issues, we're closing out older ones without recent activity. Please open a new issue if you need help!

@cwgw
Copy link
Contributor

cwgw commented May 24, 2019

This is still broken.

I've created a PR following the suggestion from @pieh.

@cwgw cwgw reopened this May 24, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
help wanted Issue with a clear description that the community can help with. type: bug An issue or pull request relating to a bug in Gatsby
5 participants