Variable width arrows in dash-leaflet [help]

lucasjamar commented 2 years ago

Hi!

Thanks a lot for dash-leaflet. I was wondering, is it possible to set the width of the arrows like the one below from the docs? I am trying to plot flows between borders on a map. Thanks! https://dash-leaflet.herokuapp.com/#examples

emilhe commented 2 years ago

I am not sure I understand the question. The code for the example is included in the docs?

lucasjamar commented 2 years ago

My apologies. I just realised I can use the weight argument in Polyline to make the arrow ticker. This was what I was trying to achieve. I will close the issue and thanks.

import dash_leaflet as dl
from dash import Dash, html

# Simple arrow.
polyline = dl.Polyline(positions=[[57, -19], [60, -12]])
patterns = [dict(offset='100%', repeat='0', arrowHead=dict(pixelSize=15, polygon=False, pathOptions=dict(stroke=True)))]
arrow = dl.PolylineDecorator(children=polyline, patterns=patterns)

polyline = dl.Polyline(positions=[[57, -19], [40, -12]], weight=10)
patterns = [dict(offset='100%', repeat='0', arrowHead=dict(pixelSize=50, polygon=False, pathOptions=dict(stroke=True)))]
arrow2 = dl.PolylineDecorator(children=polyline, patterns=patterns)

# Create app.
app = Dash()
app.layout = html.Div(
    dl.Map([
        dl.TileLayer(), arrow, arrow2],
        zoom=4, center=(52.0, -11.0)
    ),
    style={'width': '100%', 'height': '50vh', 'margin': "auto", "display": "block"}
)

if __name__ == '__main__':
    app.run_server()

emilhe / dash-leaflet

Variable width arrows in dash-leaflet [help] #126