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; } } }

Expanded images in sidecar fuzzy

Anonymous User

Images in my sidecar are incredibly fuzzy/blurry. Is there a optimal workflow or image requirement when placing images in story maps? I have attached a video to show what I am seeing. The particular story map is my testing one so I cannot share it publicly, however, I can share it with a private group for troubleshooting purposes.

Thanks!

Media1_Trim.mp4

Curtis_1-1712271779369.png

タグ付きの投稿をもっと見る

Accepted answers

oevans_storymaps

@Anonymous User @KateMcMahon -- This issue will be addressed in an update coming later today. Please check your stories tomorrow and let us know if you are still seeing this issue.

oevans_storymaps

@cole_KTB -- Thanks for sharing your story link. The blurriness around the text in your story's images is caused by the fact that your original images are very low resolution. Looking at them they are only about 700px wide. I can see that the originals do not even have crisp text. When low-res images are resized to be even smaller, additional noise can be introduced. This may not make much of a difference in a photograph, but for a screenshot of a chart with small text there can be noticeable blurriness, especially around the small curved edges of text characters.

I'd recommend re-creating and re-uploading your chart images so they are at least 1200px wide (2000px or more would be best). For images with small text, like the images of charts in your story, be sure the images are at least 120 dpi.

For more information, see these best practices for image sizing in our FAQ: Frequently asked questions—ArcGIS StoryMaps | Documentation

All comments

oevans_storymaps

Hi @Anonymous User -- Thanks for providing feedback about this image quality issue. Are those PNGs? There is currently an issue with the ArcGIS Online back-end with serving out PNG images. We've heard that this issue should be addressed in the update coming in mid-Dec.

If you convert your original images to JPGs, do you still see the same issue?

Anonymous User

The images are both JPG's and PNG's, I used both to show it didn't matter. The caption below says what they are.

The original images are from Excel and I've tried to convert them using Word, Affinity Photo, and MS paint. But when placed in sidecar and expanded they all look the same, very blurry.

oevans_storymaps

We can reproduce this issue. We'll look into this more and update this thread when we have additional info.

Anonymous User

Thank you for your assistance and quick reply Owen.

KateMcMahon

Hi Owen, I'd like to piggyback off of this same issue: we are having massive compression issues with images embedded in Sidecar in particular. When clicked to enlarge, nearly all of the images are compressed to the point of being illegible. This is a particular problem for us as we are showing archival manuscript documents with writing on them that are not legible at all. We have tried different file types and different sizes to see if that will help but nothing has. We are supposed to be launching our map in December and right now we cannot do that with it looking the way it does. Any update on this fix would be greatly appreciated.

Screen Shot 2020-12-01 at 10.51.08 AM (2).png

Screen Shot 2020-12-01 at 10.50.38 AM (2).png

oevans_storymaps

@Anonymous User @KateMcMahon -- This issue will be addressed in an update coming later today. Please check your stories tomorrow and let us know if you are still seeing this issue.

KateMcMahon

Thanks so much for the quick turnaround!

Anonymous User

Very cool, thank you Owen!

Anonymous User

Morning Owen,

Got a chance to try it out and it seems to have worked. Images are coming in crisp except for one PNG so far that doesn't show up until you expand it. But I think you said in a different post that the PNG issue will be resolved in the December update.

Problem is the issue of when you open builder it says there are unpublished changes right away without making any actual changes. I know this is similar to an old issue that was resolved a couple of months ago (see Image bug when opening builder ) but wondering if it is related to this patch. See attached video for better explanation.

Media1_Trim.mp4

oevans_storymaps

@Anonymous UserI'm glad to hear the fix we deployed for the expanded image quality issue has addressed that problem for you.

Yes, the PNG issue is a back-end issue and should be fixed next week in the ArcGIS Online update. From what I've heard from them, it's possible that you may need to re-add the PNG to your story to fix the issue.

katherine_evans

Hi,

I have also been having an issue with blurry images. When I am in editing mode, the images look perfectly clear. However, when I change to view the story map (not in editing), the images appear blurry (see attached). If I click on the images, the image of course will enlarge. When I click again to have it go back to the original size it is no longer blurry (see attached). Anything you can do to help with this issue would be greatly appreciated.

blurry.PNG

Not Blurry.PNG

oevans_storymaps

@katherine_evans -- This can sometimes happens if your screenshots are not large enough or not a high enough resolution. Even if they look clear in the builder the text might look blurry when viewing the story because the images are resized for performance reasons. If there isn't sufficient detail in the image, text may not look great.

Be sure you are using PNG format images (not JPG) and set your monitor to the highest resolution possible before taking screenshots that you intend to use in a story. In a few other cases where people reported this, this solution fixed the issue.

katherine_evans

Even though when you are viewing the story and click on the image, it corrects itself and is no longer blurry? Also these are not screen shots they were exported as jpeg. I could try exporting them all as png, do you think that would work? It seems weird that if this is the issue, the image will still correct itself when the image is clicked on when viewing the story.

katherine_evans

I tried png and it still didn't work

oevans_storymaps

@katherine_evans -- Could you ZIP up your original images and share them here so we can test things on our end?

katherine_evans

I have uploaded some files we were using, there is also a couple of PNG I tried (most are JPEG). Let me know if you need more files. Please note, I work for the state of Ga and these files are considered a draft right now. Please don't share. Thanks again for your help on this.

files.zip

oevans_storymaps

@katherine_evans -- We looked into this and most of these images are compressed JPGs and don't look clear to me even in their original form.

The two PNGs you provided are the only images that are sufficient quality and format to use for images on the web with text. However, they are much larger than needed (3300px wide), so to ensure the images load quickly when readers view your story the builder has to resize them. This sometimes can have a slight effect on their appearance. In our testing, we do notice a slight difference between the original and how the image looks in a story, but the text is still clear. I'd recommend exporting the images at a size closer to 2000px wide, which will give you a result that should be closer to what you'd expect to see in the builder and provide clear text in the images.

Please also see this article which has some good information and tips on working with and preparing images for use in a story. A Guide to Working with Images in ArcGIS StoryMaps (esri.com)

katherine_evans

Thank you so much for taking a look at this, I will try your suggestions. Hope you have a great afternoon

katherine_evans

I tried the you suggestion and uploaded the images (PNG with 2000px), they are still blurry. the one on the left is clear, but only after I clicked on it to bring it to full screen, then clicked again to bring it back to the story map. The right I have not touched, but if I double clicked on it, it would probably clear up.

map images.PNG

cole_KTB

Hi Katherine,

I am having the exact same issue in my side car. Images are blurry until clicked to expand and then they appear fine. Did you find any solutions?

cole_KTB

Was a work around or fix to this problem found yet? I have images in the text side of my side car (plots) and they appear blurry until they are opened/expanded, then they are fine after that point.

oevans_storymaps

@cole_KTB -- We fixed an issue that sounds like the one you're reporting a while back. Do you also see this issue after clearing your browser cache or do you also see this issue when you visit your story in a different browser or on a different computer?

If so, please share a link to your story here so we can take a look. Make sure the story is shared publicly, too. If you can't share your story publicly, please contact Esri Support and they will be able to help you.

cole_KTB

Hi Owen,

Thanks for the response. Here is the link to my story map https://storymaps.arcgis.com/stories/7d51e96258144a9e9b7fba0ca604767c , go to section "Cleanups" on the left hand side of sidecar the plots appear blurry until expanded on my browser and the map takes a very long to load. (I have tried several different image sizes & resolutions too) On my smart phone I just checked and they do not appear blurry, but I need them to work for desktop. I do not have access to another computer until later today to check, but I did clear my history/cache and that did not help.

katherine_evans

My apologies, I just now saw your message. No I was unable to fix it.

会話に参加する

サインインしたメンバーは投稿、更新のフォローなどができます。初めてですか？無料アカウントを登録してください。

クイックリンク

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