mneedham/app.py

## app.py
from flask import Flask
from flask import render_template
import csv
import json

app = Flask(__name__)

@app.route('/')
def my_runs():
    runs = []
    with open("runs.csv", "r") as runs_file:
        reader = csv.DictReader(runs_file)

        for row in reader:
            runs.append(row["polyline"])

    return render_template("leaflet.html", runs = json.dumps(runs))

if __name__ == "__main__":
    app.run(port = 5001)

## extract_runs.py
import requests
import os
import sys
import csv

token = os.environ["TOKEN"]
headers = {'Authorization': "Bearer {0}".format(token)}

with open("runs.csv", "w") as runs_file:
    writer = csv.writer(runs_file, delimiter=",")
    writer.writerow(["id", "polyline"])

    page = 1
    while True:
        r = requests.get("https://www.strava.com/api/v3/athlete/activities?page={0}".format(page), headers = headers)
        response = r.json()

        if len(response) == 0:
            break
        else:
            for activity in response:
                r = requests.get("https://www.strava.com/api/v3/activities/{0}?include_all_efforts=true".format(activity["id"]), headers = headers)
                polyline = r.json()["map"]["polyline"]
                writer.writerow([activity["id"], polyline])
            page += 1

## leaflet.html
<html>
  <head>
    <title>Mapping my runs</title>
  </head>

  <body>
    <script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
    <script type="text/javascript" src="https://rawgit.com/jieter/Leaflet.encoded/master/Polyline.encoded.js"></script>
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
    <div id="map" style="width: 100%; height: 100%"></div>

    <script>
    var map = L.map('map').setView([51.498265, -0.135642], 13);
    L.tileLayer(
        'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            maxZoom: 18,
        }).addTo(map);

    var encodedRoutes = {{ runs|safe }}

    for (let encoded of encodedRoutes) {
      var coordinates = L.Polyline.fromEncoded(encoded).getLatLngs();

      L.polyline(
          coordinates,
          {
              color: 'blue',
              weight: 2,
              opacity: .7,
              lineJoin: 'round'
          }
      ).addTo(map);
    }
    </script>
  </body>
</html>
	from flask import Flask
	from flask import render_template
	import csv
	import json

	app = Flask(__name__)

	@app.route('/')
	def my_runs():
	runs = []
	with open("runs.csv", "r") as runs_file:
	reader = csv.DictReader(runs_file)

	for row in reader:
	runs.append(row["polyline"])

	return render_template("leaflet.html", runs = json.dumps(runs))

	if __name__ == "__main__":
	app.run(port = 5001)
	import requests
	import os
	import sys
	import csv

	token = os.environ["TOKEN"]
	headers = {'Authorization': "Bearer {0}".format(token)}

	with open("runs.csv", "w") as runs_file:
	writer = csv.writer(runs_file, delimiter=",")
	writer.writerow(["id", "polyline"])

	page = 1
	while True:
	r = requests.get("https://www.strava.com/api/v3/athlete/activities?page={0}".format(page), headers = headers)
	response = r.json()

	if len(response) == 0:
	break
	else:
	for activity in response:
	r = requests.get("https://www.strava.com/api/v3/activities/{0}?include_all_efforts=true".format(activity["id"]), headers = headers)
	polyline = r.json()["map"]["polyline"]
	writer.writerow([activity["id"], polyline])
	page += 1
	<html>
	<head>
	<title>Mapping my runs</title>
	</head>

	<body>
	<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
	<script type="text/javascript" src="https://rawgit.com/jieter/Leaflet.encoded/master/Polyline.encoded.js"></script>
	<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
	<div id="map" style="width: 100%; height: 100%"></div>

	<script>
	var map = L.map('map').setView([51.498265, -0.135642], 13);
	L.tileLayer(
	'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
	maxZoom: 18,
	}).addTo(map);

	var encodedRoutes = {{ runs\|safe }}

	for (let encoded of encodedRoutes) {
	var coordinates = L.Polyline.fromEncoded(encoded).getLatLngs();

	L.polyline(
	coordinates,
	{
	color: 'blue',
	weight: 2,
	opacity: .7,
	lineJoin: 'round'
	}
	).addTo(map);
	}
	</script>
	</body>
	</html>