I went to Italy for my honeymoon a while ago. I took a weekly tour of Milan, Venice, Florence, Pisa, Rome and Pompeii, and when I noticed, I took about 1000 photos. I had some free time and took a walk for about 10,000 steps every day, so I wanted to keep a record including the route, so I made a map album ...!

Visualization

The whole picture looks like this. I'm using a map from OpenStreetMap.

From here, for example, if you zoom in on Venice, you can see the walking route like this. It is color-coded according to the date, and since I stayed overnight in Venice, there is a two-color route. And the marker is the point where you took the picture, click it and the picture will pop up.

This is the original photo. Since I took it during the gondola tour, the marker is also on the waterway. I was looking forward to Venice as a sanctuary of "ARIA", but it was a far more fantastic city of water than I expected. I will do my best to recommend it.

This is the Spanish Steps, the sanctuary of the timeless masterpiece "Roman Holiday". I saw it on the plane to go (Oi)

This is a cat watching over Pompeii, which was destroyed by the eruption. Cats appear here. It was a cat. Nice to meet you

reaction

I shared it with my family and friends, and it was great because I was able to share my memories while following the journey and showing photos. I went through this stall street, had a supper at this shop, and ran this road, and it was just before the meeting time. However, since I shared the HTML file that exported the Jupyter Lab notebook as it is, the engineers started reading the Python code, and there was a problem that it was hard to hear this story w

procedure

I wrote about 50 lines of Python code on JupyterLab and did the following: I'm starting to use Folium for business, but it's very easy.

--Read the image file with Pillow. --Extract the latitude / longitude information from the Exif of the image. --Extract the rotation / inversion information from the Exif of the image and apply it. --Draw a route by feeding Folium with a column of latitude and longitude. --Folium is fed with latitude / longitude and Base64-encoded image to hit a marker. --HTML output with JupterLab.

I can pass an image tag to the Folium marker, but it seems that I can't refer to the local file, so I'm using the trick of encoding to Base64. Thanks to that, it is easy to share because it can output a single independent HTML file, but even though it is reduced, it has about 1000 images, so it became an HTML file of about 100 MB ... … W

code

import base64
import folium
import glob
import pandas as pd
from io import BytesIO
from matplotlib import pyplot as plt
from PIL import ExifTags, Image, ImageOps

def to_deg(v, ref, pos):
    d = float(v[0][0]) / float(v[0][1])
    m = float(v[1][0]) / float(v[1][1])
    s = float(v[2][0]) / float(v[2][1])
    return (d + (m / 60.0) + (s / 3600.0)) * (1 if ref == pos else -1)

to_trans_methods = {
    1: [],
    2: [Image.FLIP_LEFT_RIGHT],
    3: [Image.ROTATE_180],
    4: [Image.FLIP_TOP_BOTTOM],
    5: [Image.FLIP_LEFT_RIGHT, Image.ROTATE_90],
    6: [Image.ROTATE_270],
    7: [Image.FLIP_LEFT_RIGHT, Image.ROTATE_270],
    8: [Image.ROTATE_90]
}

files = glob.glob('/path/to/*.jpg')

rows = []
for file in files:
    with Image.open(file) as im:
        exif = {ExifTags.TAGS[k]: v for k, v in im.getexif().items() if k in ExifTags.TAGS}
        if 'GPSInfo' in exif:
            gps = {ExifTags.GPSTAGS[k]: v for k, v in exif['GPSInfo'].items() if k in ExifTags.GPSTAGS}
            lat = to_deg(gps['GPSLatitude'], gps['GPSLatitudeRef'], 'N')
            lon = to_deg(gps['GPSLongitude'], gps['GPSLongitudeRef'], 'E')
            im.thumbnail((192, 192))
            for method in to_trans_methods[exif.get('Orientation', 1)]:
                im = im.transpose(method)
            buf = BytesIO()
            im.save(buf, format="png")
            rows.append([lat, lon, exif['DateTimeOriginal'], base64.b64encode(buf.getvalue()).decode()])

df = pd.DataFrame(rows, columns=['lat', 'lon', 'dt', 'base64'])
df['dt'] = pd.to_datetime(df['dt'], format='%Y:%m:%d %H:%M:%S')
df = df.sort_values('dt')

fmap = folium.Map(location=[df['lat'].mean(), df['lon'].mean()], zoom_start=6)
hsv=[plt.get_cmap('hsv', 12)(i) for i in range(12)]
fmap.add_child(folium.ColorLine(zip(df['lat'], df['lon']), colors=df['dt'].dt.day, colormap=hsv, weight=4))
for _, row in df.iterrows():
    fmap.add_child(folium.Marker([row['lat'], row['lon']], popup=f'<img src="data:image/png;base64,{row["base64"]}">'))
fmap

Execution environment

$ python --version
Python 3.7.4

$ pip list | grep -e folium -e jupyter -e matplotlib -e pandas -e Pillow
folium               0.10.1    
jupyter-client       5.3.3     
jupyter-core         4.5.0     
jupyterlab           1.1.4     
jupyterlab-server    1.0.6     
matplotlib           3.1.2     
pandas               1.0.1     
Pillow               7.0.0

Reference link

Let's find out the shooting location from the GPS information embedded in the photo with Python | Mynavi News Processed with PIL considering EXIF Orientation tag | Qiita View image on popup | python-visualization/folium