Edit the icon image of a POI

[MaheshVyomSharma]

Hi,

A newbie here trying to customize a vector map. I am looking to customize the icons of a particular type of POI. For example, the country's national flag icon on all government facilities; a company's logo on all their facilities etc. I have so far tried creating a layer that is a replica of poi-level-3, but unfortunately that is updating all poi-3 with the same icon. How can I achieve this? I have also gone through quite a few Youtube videos and blogs, but have not been successful so far. I am using docker image tileserver-gl and Maputnik online for my work; using osm-bright style as the basis. Please help me out with necessary guidance.

[pathmapper]

Hi @MaheshVyomSharma ,

but unfortunately that is updating all poi-3 with the same icon.

If you are using OpenMapTiles as vector source you would need to filter the POIs based on class:

https://openmaptiles.org/schema/#poi https://github.com/openmaptiles/openmaptiles/blob/master/layers/poi/class.sql

For using your own icons, here are some resources as starting points:

1. You could create your own sprite with the icons you want and use them for your style:

Sprite docs: https://docs.mapbox.com/mapbox-gl-js/style-spec/#sprite

Generate own sprite: https://github.com/maputnik/osm-liberty#icon-design

2. Load an icon from an external URL and use it for your style:

Example: https://docs.mapbox.com/mapbox-gl-js/example/add-image/

Docs: https://docs.mapbox.com/mapbox-gl-js/api/#map#loadimage https://docs.mapbox.com/mapbox-gl-js/api/#map#addimage

Closing here, as this is not really a question about Maputnik. If you have further questions about this matter I suggest to ask them on https://gis.stackexchange.com/.

[joostschouppe]

Two notes about this:

• I think this is probably a common enough issue to briefly describe it in the wiki
• I think the answer above might be more information than needed. After reading some of the links above, I think I can conclude:
  • Any Mapbox GL JSON file (vector tile stylesheet) has a reference to a "sprite". For example, that would like this: "sprite": "https://maputnik.github.io/osm-liberty/sprites/osm-liberty"
  • This link is a reference to a hosted set of icons, in this case they can be seen here. A sprite in this context consists of a png with a whole set of icons, and a JSON that defines a name and the x-y coordinates on the png where the icon can be found.
  • To use your own set of icons, host something similar yourself and replace the reference in your GL JSON file.

[HarelM]

There's a whole section about sprites in the maplibre spec here: https://maplibre.org/maplibre-style-spec/sprite/ I'm not sure it's worth repeating...

[joostschouppe]

Yes, you're right. While I see now that https://maplibre.org/maplibre-style-spec is mentioned in the readme, there seems to be no link from https://github.com/maplibre/maputnik/wiki to there. It probably makes sense to repeat the first sentence of the readme there

[HarelM]

I have added a note to the maputnik wiki, I hope it will be useful to people.