nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Story Map Tour - Imported photos rotating from portrait to landscape

AllenRisley

I am working with a class of students who are creating story map tours using photos that they have taken on their smartphones. Some of the students have run into a problem where photos that they have taken in portrait mode rotate into landscape mode when they add them to their story map. Any ideas on why this might happen and if there is a fix?

Thanks in advance,

Allen Risley

GIS Specialist

Cal State University San Marcos

Find more posts tagged with

Accepted answers

StephenSylvia

Nevin, I took a closer look and our Map Journal app uses a different version of our photo uploader code which does not rotate the photo based off exif data. We've added it to the issue tracker so we can get it in the next release.

For the time being, I recommend rotating the photos as before then strip try stripping the exif data before uploading: What Is EXIF Data, and How Can I Remove It From My Photos?

All comments

KevinHigh

I doubt that it is the Story Map that is doing the rotating. I often have problems with when taking a photo with an iPhone/iPad where the orientation doesn't come out correctly when I send the file.

I would recommend checking each photo on a PC before uploading them to your app.

AllenRisley

I'm thinking that you are right - it's probably not the story map. I have never had this problem, but I have an Android phone and usually inspect photos before uploading them. These students may very well have been using an iPhone for the pictures. I will add a step to the procedure where they inspect the photos before uploading them.

Thanks for the idea.

RupertEssinger

I concur with the other replies here. We've not heard of an issue with the Story Map Tour rotating images differently from their stored format. I have definitely experienced sending a picture from an iPhone to my PC via email and finding it unexpectedly being rotated when I open it on my PC. In those cases I found I had to open and save the image in Windows Paint to get the correct orientation to stick.

Rupert

NevinDawson

I am having the same issue in my Story Map Journal (inserting image into story sidebar) and see no evidence that it's caused by my phone or computer. The image is portrait on my phone, online on Google Photos, and in the Windows photo viewer after downloading the file. The dimensions in the metadata list the small number (width) first and large number (height) second. In landscape format images, the numbers are reversed. As soon as I upload it to the Story Map, it is always landscape with no option to change it. If I rotate it 90 degrees with computer software to try to compensate and save/upload again it, it stays rotated to the right after upload. I can't see how this could be caused by anything other than the Story Map interface. Any ideas?

StephenSylvia

Nevin, I'm sorry you are having issues uploading your photo. Can you provide some more information?

Are you able to upload the photo as an attachment so we can check the photo orientation saved in the exif data?
What did you use take your photo? Camera Model? Smartphone (type?).
What version of Windows are you running?
Did you try rotating your photo with the Window's photo viewer? Our app relies on exif data to automatically rotate the photo on upload. The exif data is the standard way of setting the photo's orientation and is the method used by camera and smartphone manufacturers. Unfortunately, Microsoft does not set the exif orientation when rotating a photo through the windows photo viewer so you will need to use a different photo editor to rotate the photo.

NevinDawson

Thanks for the response. The photo is below, and, as you can see, is in portrait orientation. The EXIF data lists the width as the smaller dimension and the height as the larger dimension. I have tried opening it with Adobe Photoshop Express, Photoshop CC 2015.5, the Windows Photo viewer, and Paint, and all of them open the image in portrait orientation. I took the photo with the native camera app on my LG G4 Android smartphone. The image was automatically synced to Google Photos and then I downloaded it from there to my Windows 10 Pro laptop. I've tried it with one other portrait photo with the same results. Any thoughts?

StephenSylvia

Nevin, Can you upload the photo as an attachment (preferably in a zip file). You may need to us the Advanced editor (top right corner when you're adding a post). When you just insert the image, it strips all the exif data from the image.

StephenSylvia

For the time being, I recommend rotating the photos as before then strip try stripping the exif data before uploading: What Is EXIF Data, and How Can I Remove It From My Photos?

NevinDawson

Thanks for your work on this, Stephen. I stripped the exif data and still had the same problem (although I'm not sure what you meant by "rotating the photos as before"). I did finally find a workaround: open in Photoshop and save as PNG. I hope that the issue can be resolved in the next release of the app.

LoriDelacruz_Lewis

The photos I'm importing into my first Story Map are turning 90º counter clockwise.
Workaround: On my Mac, I opened each image in Preview, rotated the photo 90º & saved it. Then rotated it back and saved again. Now it appears correctly in my Story Map. 😉

Anonymous User

I am experiencing this exact same problem right now. I am taking photos uploaded via Survey 123 and using the shareholder layer to create a story map. All the photos display landscape regardless if they are in portrait or not. When I view the same layer in Dashboard, Map Viewer Pop-Up or in Chrome the photos display correctly. Is there a setting option I am missing or a fix to this?

BrookeAumann

I'm currently having a similar issue except I'm using the feature attachment links to create thumbnails (preview the image in the pop-up) and the thumbnails are rotating, but when you click on the picture (which uses the link), the photo appears fine and in normal orientation. When I use shortlist builder and reference the URL for the photo, same thing, it rotates the photo. Examples attached. Stephen Sylvia

Edit: So browser matters too. Chrome will show the linked picture correctly, but Internet Explorer will rotate the picture (same as thumbnail).

LoriDelacruz_Lewis

I have run into this issue with every Storymap I've created, but I discovered a work-around. Open the photo in a simple photo editor – I use Preview on my Mac. Rotate the photo 90 degrees and save. Rotate it back and save again. Works like a charm.

Andrew_Wolff

I can't believe this simple solution worked. But I question why in 2021 we still need to do this. I was on a windows computer with photos taken on a google pixle 5.

nancylbb

I am still having this issue as well. Stripping the exif data and rotating and saving both did not work for me.

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.