How to rotate an overlayed image in folium?

user_12898052 0
Viewed 270

I have been able to overlay a jpeg image on folium map using folium.raster_layers.ImageOverlay. Now I am trying to rotate this image with a given angle. Does anyone have an idea for doing it?

folium image-rotation leaflet python
1 Answers
  • PIL supports rotating images
  • b64encode and you can include in folium after rotating
  • code example below shows rotating and image with different angles where they can be selected from layers control
import folium
from PIL import Image
import requests
import io, base64

response = requests.get("https://upload.wikimedia.org/wikipedia/commons/f/f4/Mercator_projection_SW.jpg")
img = Image.open(io.BytesIO(response.content))

m = folium.Map([37, 0], zoom_start=1)

for r in [0,45,90,180]:
    b = io.BytesIO()
    img.rotate(r).save(b, format='PNG')
    b64 = base64.b64encode(b.getvalue())
    folium.raster_layers.ImageOverlay(
        image=f'data:image/png;base64,{ b64.decode("utf-8") }',
        name=f'Image rotated {r}',
        bounds=[[-82, -180], [82, 180]],
        opacity=1,
        interactive=False,
        cross_origin=False,
        zindex=1,
        alt='Wikipedia File:Mercator projection SW.jpg'
    ).add_to(m)

folium.LayerControl().add_to(m)

m
user_94414040
Related