Componente

Map

Mapa interactivo con Leaflet.js y OpenStreetMap/CartoDB, marcadores y popups.

{% comp_map ... %}

Código a utilizar

template.html 
{% comp_map id="demo" lat=40.416775 lng=-3.70379 zoom=13 markers=[{"lat": 40.416775, "lng": -3.70379, "title": "Sede Central", "description": "C/ Gran Vía, Madrid"}, {"lat": 40.453054, "lng": -3.688344, "title": "Oficina Norte", "description": "Paseo de la Castellana"}] height="380px" label="Oficinas Madrid" %}

Vista previa en vivo

Oficinas Madrid

API Props & Playground

Los cambios actualizan la vista previa en tiempo real
Prop Valor
id
'main'
lat
40.416775
lng
...
zoom
13
markers
None
 2 elementos
tile_layer
'openstreetmap'
height
'400px'
label
''
classes
''

Carga la librería con {% load components_ui %} antes de usar el componente.