Google Takeout Map

Use this script to transform places to visit from semantic location history.

  1. https://takeout.google.com
  2. Select Maps data
  3. Once the exported data is available download the zip.
  4. Extract the zip and provide the path to the json for the time range of choice.
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

import json

from geojson import Point
from geojson import LineString
from geojson import FeatureCollection
from geojson import Feature

points = []

with open("Location History/Semantic Location History/2021/2021_DECEMBER.json", "r") as read_file:
    data = json.load(read_file)
    
timeline = data['timelineObjects']

for index in range(len(timeline)):
    place = timeline[index]
    if ('placeVisit' in place and index < 192):
        placeVisit = place['placeVisit']
        location = placeVisit['location']
        latitudeE7 = location['latitudeE7']
        longitudeE7 = location['longitudeE7']
        point = (longitudeE7 / 1e7, latitudeE7 / 1e7) 
        points.append(point)
        print(point)

linestring = LineString(points)
feature = Feature(geometry=linestring)
point = Point((-107.852741, 37.931435))
feature_end = Feature(geometry=point)
fc = FeatureCollection([feature, feature_end])
print(json.dumps(fc))

Once you have Geojson that this script above will provide you can provide that to Leaflet.

  1. Set the center of where you traveled in lat,lng
  2. The geojson in the features will be in long,lat per the geojson standard.
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

// center of the map
var center = [ 39.926756, -105.131619];

// Create the map
var map = L.map('map').setView(center, 3);

// Set up the OSM layer
L.tileLayer(
  'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    maxZoom: 18
  }).addTo(map);

var geojsonFeature = {"type": "FeatureCollection", "features": [{"type": "Feature", "geometry": {"type": "LineString", "coordinates": [[-116.436775, 43.660648], [-116.339944, 43.616733], [-116.339944, 43.616733], [-116.321527, 43.619162], [-116.339944, 43.616733], [-116.339944, 43.616733], [-116.350727, 43.617863], [-116.339944, 43.616733], [-116.339944, 43.616733], [-116.285101, 43.608199], [-116.339944, 43.616733], [-116.350727, 43.617863], [-116.339944, 43.616733], [-116.358874, 43.60408], [-116.209903, 43.62264], [-116.18796, 43.643012], [-116.339944, 43.616733], [-116.339944, 43.616733], [-116.354065, 43.607596], [-116.339944, 43.616733], [-116.339944, 43.616733], [-116.285603, 43.620845], [-116.339944, 43.616733], [-116.339944, 43.616733], [-116.351214, 43.635039], [-116.339944, 43.616733], [-116.339944, 43.616733], [-116.333613, 43.54718], [-112.100545, 41.54852], [-112.107581, 41.55044], [-112.057203, 41.485974], [-111.217099, 39.950771], [-110.797176, 39.599766], [-108.583777, 39.078211], [-108.557405, 39.049431], [-108.557068, 39.065662], [-105.199926, 39.721179], [-104.993406, 39.746598], [-105.047843, 39.78131], [-105.501232, 39.741682], [-106.045209, 39.633262], [-106.05545, 39.629784], [-106.045209, 39.633262], [-106.371694, 39.642274], [-106.373773, 39.640221], [-106.354972, 39.606144], [-106.096018, 39.590508], [-106.045209, 39.633262], [-106.061462, 39.627571], [-106.045209, 39.633262], [-106.045209, 39.633262], [-106.045209, 39.633262], [-106.045209, 39.633262], [-106.373638, 39.642414], [-106.373322, 39.640251], [-106.354972, 39.606144], [-106.354972, 39.606144], [-106.373788, 39.640971], [-106.045209, 39.633262], [-106.078163, 39.637793], [-106.045209, 39.633262], [-106.045209, 39.633262], [-106.373638, 39.642414], [-106.354972, 39.606144], [-106.045209, 39.633262], [-106.111692, 40.074861], [-106.045209, 39.633262], [-106.096168, 39.586793], [-106.096779, 39.589904], [-106.045209, 39.633262], [-106.827886, 40.482698], [-106.825676, 40.468396], [-106.045209, 39.633262], [-105.50068, 39.741754], [-104.993406, 39.746598], [-105.001631, 39.758173], [-104.999533, 39.756584], [-105.090145, 39.929321], [-105.084192, 39.909105], [-105.053452, 39.753134], [-105.011026, 39.76194], [-105.084192, 39.909105], [-105.069317, 39.913583], [-105.015654, 39.740809], [-105.079497, 39.802208], [-105.084192, 39.909105], [-105.050188, 39.939403], [-105.131619, 39.926756], [-105.193474, 39.722216], [-105.154282, 39.73697], [-106.079725, 38.519781], [-106.355013, 37.679062], [-106.355013, 37.679062], [-106.356526, 37.678663], [-106.355013, 37.679062], [-108.118392, 37.169068], [-108.287244, 37.347103], [-107.852741, 37.931435]]}, "properties": {}}, {"type": "Feature", "geometry": {"type": "Point", "coordinates": [-107.852741, 37.931435]}, "properties": {}}]}

L.geoJSON(geojsonFeature).addTo(map);

Add the following where you want the map displayed, should be underneath the body. 

1

<div id="map"></div>

Finally include leaflet javascript and css as well as the desired dimensions of the map. 

1
2
3
4
5
6
7
8

<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
<link rel="stylesheet" href="//unpkg.com/leaflet@1.7.1/dist/leaflet.css">
<style>
#map {
	width: 1024px;
	height: 768px;
}
</style>