Add 3D buildings and GIF animations to the map

This example shows how to add GIF animations to the map.

Uncomment the following line to install leafmap if needed.

In [1]:

# %pip install "leafmap[maplibre]"

# %pip install "leafmap[maplibre]"

In [2]:

import time
import leafmap.maplibregl as leafmap

import time import leafmap.maplibregl as leafmap

To run this notebook, you will need an API key from MapTiler. Once you have the API key, you can uncomment the following code block and replace YOUR_API_KEY with your actual API key. Then, run the code block code to set the API key as an environment variable.

In [3]:

# import os
# os.environ["MAPTILER_KEY"] = "YOUR_API_KEY"

# import os # os.environ["MAPTILER_KEY"] = "YOUR_API_KEY"

In [4]:

m = leafmap.Map(
    center=[114.16204636, 22.3053044], zoom=15.7, pitch=45, bearing=50, style="basic-v2"
)
m.add_basemap("Satellite", visible=False)
m.add_3d_buildings(min_zoom=15)
image = "https://i.imgur.com/KeiAsTv.gif"
m.add_image(image=image, width=250, height=250, position="bottom-right")
text = "Hong Kong!🦥"
m.add_text(text, fontsize=34, padding="20px")
image2 = "https://i.imgur.com/kZC2tpr.gif"
m.add_image(image=image2, bg_color="transparent", position="bottom-left")
m.add_layer_control()
m

m = leafmap.Map( center=[114.16204636, 22.3053044], zoom=15.7, pitch=45, bearing=50, style="basic-v2" ) m.add_basemap("Satellite", visible=False) m.add_3d_buildings(min_zoom=15) image = "https://i.imgur.com/KeiAsTv.gif" m.add_image(image=image, width=250, height=250, position="bottom-right") text = "Hong Kong!🦥" m.add_text(text, fontsize=34, padding="20px") image2 = "https://i.imgur.com/kZC2tpr.gif" m.add_image(image=image2, bg_color="transparent", position="bottom-left") m.add_layer_control() m

Failed to retrieve the MapTiler style. Defaulting to 'dark-matter' style.

In [5]:

m.fly_to(lon=114.1729311, lat=22.296538, zoom=16, speed=0.3)

m.fly_to(lon=114.1729311, lat=22.296538, zoom=16, speed=0.3)

In [6]:

for degree in range(0, 360, 1):
    m.rotate_to(degree, {"duration": 0})
    time.sleep(0.1)

for degree in range(0, 360, 1): m.rotate_to(degree, {"duration": 0}) time.sleep(0.1)