I've been working on a map that places PictureMarkerSymbols with custom drawables, and I've noticed that the PictureMarkerSymbols are blurry when displayed on the map. I've tried the following: * drawables in drawable-mdpi, drawable-hdpi, drawable-xhdpi, etc. and the PictureMarkerSymbol(Context, Drawable) constructor. Images are not sharp at all (though appropriately sized) * drawables in drawable-mdpi, drawable-hdpi, drawable-xhdpi, etc. and the PictureMarkerSymbol(Drawable) constructor. Images are somewhat sharp and way too big * drawables in drawable-nodpi and PictureMarkerSymbol(Drawable) constructor. I just used the smallest Drawable I had, which was the mdpi one. Drawables were appropriately sized but still blurry * drawable in the drawable (no qualifiers) folder and the PictureMarkerSymbol(Drawable) constructor. Huge and blurry The my location (blue dot) icon is very crisp. How do you achieve this. Note: after more testing, I've noticed the blurriness is more pronounced with a LayerDrawable. Could this be the source of my issue?

That did not do the trick for me unfortunately. Both loading from drawables and loading from assets have the same amount of blurriness, at least to the naked eye. I may be wrong, and feel free to correct me if I am, but I think I may know why you saw improvements in your example. If you use drawables and the PictureMarker(Drawable) constructor (not PictureMarkerSymbol(Context, Drawable)), it will not resize the drawable. For some reason, using Drawable.createFromStream() does resize it. It looks like to me that loading from assets, and using the PictureMarkerSymbol(Context, Drawable) constructor accomplishes the same thing For anyone who comes across this later, my biggest issue was using `LayerDrawable`. To solve this problem, I just put multiple graphics on the screen to imitate one drawable with many layers

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

PictureMarkerSymbol blurry/pixelated

JeffJohnson2

I've been working on a map that places PictureMarkerSymbols with custom drawables, and I've noticed that the PictureMarkerSymbols are blurry when displayed on the map.

I've tried the following:

drawables in drawable-mdpi, drawable-hdpi, drawable-xhdpi, etc. and the PictureMarkerSymbol(Context, Drawable) constructor. Images are not sharp at all (though appropriately sized)
drawables in drawable-mdpi, drawable-hdpi, drawable-xhdpi, etc. and the PictureMarkerSymbol(Drawable) constructor. Images are somewhat sharp and way too big
drawables in drawable-nodpi and PictureMarkerSymbol(Drawable) constructor. I just used the smallest Drawable I had, which was the mdpi one. Drawables were appropriately sized but still blurry
drawable in the drawable (no qualifiers) folder and the PictureMarkerSymbol(Drawable) constructor. Huge and blurry

The my location (blue dot) icon is very crisp. How do you achieve this.

Note: after more testing, I've noticed the blurriness is more pronounced with a LayerDrawable. Could this be the source of my issue?

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

Accepted answers

All comments

AlexanderNohe1

Do you have the picture that you are trying to use available for us to test with?

JeffJohnson2

After more testing, I'm 99% certain it's the fact that I was using a LayerDrawable. For some reason, PictureMarkerSymbol doesn't scale these correctly. For testing, it should produce this effect for any LayerDrawable (or xml drawable <layer-list>)

AlexanderNohe1

Hey Jeff,

After testing this offline for a little bit, I believe that this might be a suitable workaround for you. I believe that if you store the image as an asset and then create it as a drawable at Runtime, you will get better results with the display of the image.

new PictureMarkerSymbol(Drawable.createFromStream(getAssets().open("Shell-Red-Icon.png"), null))

I look forward to seeing how this works for you.

AlexanderNohe1

Upon even further testing, I think I have some evidence that helps show the difference between loading the image in as a drawable image asset and just as an asset. Using the code snippet above, the difference is noticable for the red shell icon. What do you think?

Loading as a drawable, the shell looks blurry:

Loading as an asset, the shell looks clear:

JeffJohnson2

That looks promising, I'll try it out and report back. Thanks!

MarceloGalante

I have the same problem, but in a Web Application. Can any one help me with this issue. I am developing a Web Application with ArcGIs API Javascript that was working with Google API. You can notice the diference between the Original Image and the same image that was opened over the map using PictureMarkerSymbol

Original Image

Web Application using Google API

NEW Web Application using ArcGis API Javascript

会話に参加する

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

サインイン
登録する

クイックリンク

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