

In [ ]:

    
from __future__ import print_function

from ipyleaflet import (
    Map,
    Marker, MarkerCluster,
    TileLayer, ImageOverlay,
    Polyline, Polygon, Rectangle, Circle, CircleMarker,
    Popup,
    GeoJSON,
    DrawControl,
    basemaps
)

from ipywidgets import HTML

Map



In [ ]:

    
center = [34.6252978589571, -77.34580993652344]
zoom = 10



In [ ]:

    
m = Map(center=center, zoom=zoom)
m



In [ ]:

    
m.interact(zoom=(5,10,1))



In [ ]:

    
m.clear_layers()



In [ ]:

    
m.add_layer(basemaps.Esri.DeLorme)



In [ ]:

    
print(m.center)
print(m.zoom)

Marker



In [ ]:

    
mark = Marker(location=m.center)



In [ ]:

    
m += mark



In [ ]:

    
mark.interact(opacity=(0.0,1.0,0.01))



In [ ]:

    
html_widget = HTML(
    value="""
        <div>Some html with a list of items
        <ul class='list-group'>
            <li class='list-group-item'>Item A</li>
            <li class='list-group-item'>Item B</li>
            <li class='list-group-item'>Item C</li>
        </ul></div>""",
    placeholder='',
    description='',
)



In [ ]:

    
mark.popup = html_widget

Marker Cluster

When we have many markers on a map, it is helpful to cluster them together at high zoom levels. First, we create a small grid of markers.



In [ ]:

    
xscale = 5
yscale = 10

x = [m.center[0] + i * xscale * .05 for i in (-1,0,1)]
y = [m.center[1] + i * yscale * .05 for i in (-1,0,1)]

from itertools import product
locations = product(x, y)
markers = [Marker(location=loc) for loc in locations]

Then we add them all to a MarkerCluster, which automatically clusters them at appropriate zoom levels.



In [ ]:

    
marker_cluster = MarkerCluster(markers = markers)
m += marker_cluster



In [ ]:

    
m.remove_layer(marker_cluster)

Image Overlay



In [ ]:

    
io = ImageOverlay(url='http://ipython.org/_static/IPy_header.png', bounds=m.bounds)
m.add_layer(io)



In [ ]:

    
m.bounds



In [ ]:

    
m



In [ ]:

    
m.remove_layer(io)

Polyline



In [ ]:

    
pl = Polyline(locations=m.bounds_polygon)
m += pl



In [ ]:

    
pl.fill_color = '#F00'
pl.fill_opacity = 1.0



In [ ]:

    
m -= pl

Polygon



In [ ]:

    
pg = Polygon(locations=m.bounds_polygon, weight=3,
            color='#F00', opacity=0.8, fill_opacity=0.8,
            fill_color='#0F0')
m += pg



In [ ]:

    
m -= pg

Rectangle



In [ ]:

    
r = Rectangle(bounds=m.bounds, weight=10, fill_opacity=0.0)
m += r



In [ ]:

    
m -= r

Circle



In [ ]:

    
c = Circle(location=m.center)
m.add_layer(c)



In [ ]:

    
c.interact(weight=(0,10,1), opacity=(0.0,1.0,0.01))



In [ ]:

    
c.model_id



In [ ]:

    
m.remove_layer(c)



In [ ]:

    
c.close()



In [ ]:

    
m.layers



In [ ]:

    
c2 = Circle(location=m.center, radius=30, weight=1,
            color='#F00', opacity=1.0, fill_opacity=1.0,
            fill_color='#0F0')
m.add_layer(c2)



In [ ]:

    
c2.model_id



In [ ]:

    
m.remove_layer(c2)



In [ ]:

    
c2.close()

CircleMarker



In [ ]:

    
cm = CircleMarker(location=m.center, radius=30, weight=2,
                  color='#F00', opacity=1.0, fill_opacity=1.0,
                  fill_color='#0F0')
m.add_layer(cm)



In [ ]:

    
cm.model_id



In [ ]:

    
m.remove_layer(cm)



In [ ]:

    
cm.close()

Multiple Circles



In [ ]:

    
circles = []
for pos in m.bounds_polygon:
    c = Circle(location=pos, radius=1000)
    circles.append(c)
    m.add_layer(c)



In [ ]:

    
for c in circles:
    m.remove_layer(c)



In [ ]:



In [ ]: