Support marker styling

[rsignell-usgs]

It would be great if ipyleaflet supported marker styling.

Perhaps the same GeoJSON conventions as GitHub: https://help.github.com/articles/mapping-geojson-files-on-github/ ?

This would allow Ipyleaflet users to easily change marker colors and styles, fixing problems like reproducible-notebooks/ERDDAP_timeseries_explorer#3.

Simple example:
https://github.com/rsignell-usgs/dc-wifi-social/blob/master/bars.geojson

On GitHUB this GeoJSON produces a map that looks like this:

While the same GeoJSON in Ipyleaflet:

import urllib.request
import json
url = 'https://raw.githubusercontent.com/rsignell-usgs/dc-wifi-social/master/bars.geojson'
req = urllib.request.Request(url)
r = urllib.request.urlopen(req).read()
data = json.loads(r.decode('utf-8'))
center = [38.9, -77.05]
zoom = 12
map = ipyl.Map(center=center, zoom=zoom, layout=ipyl.Layout(width='650px', height='350px'))
feature_layer = ipyl.GeoJSON(data=data)
map.layers = [map.layers[0], feature_layer]
map

produces a map that looks like this:

[ocefpaf]

I believe that that is specific to mapbox, not sure if it is possible to do it with leaflet.

One way to do it with leaflet is with https://github.com/albburtsev/Leaflet.geojsonCSS

[jasongrout]

You can create custom marker icons in leaflet: http://leafletjs.com/examples/custom-icons/

That's not hooked directly up to the geojson data, but there may be something possible there.

[ocefpaf]

That's not hooked directly up to the geojson data, but there may be something possible there.

Leaflet.geojsonCSS is a plugin to read the custom-icons info from the GeoJson data, but one would need to convert from the mapbox style to leaflet's style.

[jasongrout]

For completeness, I think here are the docs about those icons in mapbox: https://www.mapbox.com/help/markers-js/#style-markers-with-simplestyle

[tanay27]

How do I implement marker styling in jupyter notebook

[Oao2021]

How to change markers from the default ipyleaflet markers. Say we want to use a custom marker. Is this possible?

[giswqs]

How to change markers from the default ipyleaflet markers. Say we want to use a custom marker. Is this possible?

Yes, you can use AwesomeIcon. See https://ipyleaflet.readthedocs.io/en/latest/api_reference/awesome_icon.html

[Oao2021]

@giswqs thanks for the quick response. I am referring to the markers themselves, to have a different shape for example a bus.

[martinRenou]

This is also supported and documented https://ipyleaflet.readthedocs.io/en/latest/api_reference/icon.html. You can provide your own icon.

[Oao2021]

@martinRenou thanks so much. Done. Problem solved.

[astrojuanlu]

Using your own icons for individual markers is indeed explained in the docs https://ipyleaflet.readthedocs.io/en/latest/layers/awesome_icon.html but how about providing custom markers for GeoJSON layers?