├── .gitignore
├── 12 - 58 - 35.png
├── 13 - 2 - 19.png
├── 13 - 45 - 56.png
├── Box.pde
├── Functions.pde
├── Processing_GPXMapMosaic.pde
├── README.md
├── Route.pde
└── data
    └── 20161021-091658-Run.gpx


/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | applet
3 | application.linux32
4 | application.linux64
5 | application.windows32
6 | application.windows64
7 | application.macosx
8 | 


--------------------------------------------------------------------------------
/12 - 58 - 35.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/feltron/Processing_GPXMapMosaic/7c8692649b0345bc7da98cc55d7ed903d880b059/12 - 58 - 35.png


--------------------------------------------------------------------------------
/13 - 2 - 19.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/feltron/Processing_GPXMapMosaic/7c8692649b0345bc7da98cc55d7ed903d880b059/13 - 2 - 19.png


--------------------------------------------------------------------------------
/13 - 45 - 56.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/feltron/Processing_GPXMapMosaic/7c8692649b0345bc7da98cc55d7ed903d880b059/13 - 45 - 56.png


--------------------------------------------------------------------------------
/Box.pde:
--------------------------------------------------------------------------------
 1 | 
 2 | // - - - - - - - - - - - - - - - - - - - - - - - 
 3 | // BOX
 4 | // - - - - - - - - - - - - - - - - - - - - - - - 
 5 | 
 6 | class Box {
 7 |   color c = color(random(70, 100), random(80, 100), random(70, 90));
 8 |   int index, count;
 9 |   String latlon;
10 |   float posX, posY;
11 | 
12 |   Box(int index_, String latlon_, int count_) {
13 |     index = index_;
14 |     latlon = latlon_;
15 |     count = count_;
16 |   }
17 | 
18 |   void display() {
19 |     noStroke();
20 |     fill(c);
21 |     posX = index%mosaicCount*boxSize;
22 |     posY = index/mosaicCount*boxSize;
23 |     rect(posX, posY, boxSize, boxSize);
24 |     //println("Box: " + index + " / " + index%mosaicCount + " / " + index/mosaicCount);
25 |     fill(100);
26 |     textAlign(LEFT);
27 |     //float[] latlonTrim = float(latlon.split(","));
28 |     //String boxLocation = int(latlonTrim[0]*100)/100.0 + ", " + int(latlonTrim[1]*100)/100.0;
29 |     text(locationIndexNames[index], posX+boxMargin, posY+boxSize-boxMargin);
30 |     textAlign(RIGHT);
31 |     if (count == 1) {
32 |       text(count + " Run", posX+boxSize-boxMargin, posY+boxSize-boxMargin);
33 |     } else {
34 |       text(count + " Runs", posX+boxSize-boxMargin, posY+boxSize-boxMargin);
35 |     }
36 |   }
37 | }


--------------------------------------------------------------------------------
/Functions.pde:
--------------------------------------------------------------------------------
  1 | 
  2 | // - - - - - - - - - - - - - - - - - - - - - - - 
  3 | // FUNCTIONS
  4 | // - - - - - - - - - - - - - - - - - - - - - - - 
  5 | 
  6 | void importData() { // import all files from directory
  7 |   java.io.File folder = new java.io.File(dataPath(""));
  8 |   String[] allFilenames = folder.list();
  9 |   println(allFilenames);
 10 |   // Remove .DS_Store
 11 |   if (allFilenames[0].equals(".DS_Store")) {
 12 |     println("removing");
 13 |     filenames = new String[allFilenames.length-1];
 14 |     for (int i=1; i<allFilenames.length; i++) { 
 15 |       filenames[i-1] = allFilenames[i];
 16 |     }
 17 |   } else {
 18 |     filenames = new String[allFilenames.length];
 19 |     for (int i=0; i<allFilenames.length; i++) { 
 20 |       filenames[i] = allFilenames[i];
 21 |     }
 22 |   }
 23 |   println(filenames);
 24 |   println("Imported " + filenames.length + " files…");
 25 | }
 26 | 
 27 | // - - - - - - - - - - - - - - - - - - - - - - - 
 28 | 
 29 | void buildLocationIndex() {
 30 |   locationList = new String[filenames.length];
 31 |   for (int i=0; i<filenames.length; i++) { // filenames.length
 32 |     float gridLat = 0;
 33 |     float gridLon = 0;
 34 |     XML xml = loadXML(filenames[i]);
 35 |     XML[] track = xml.getChildren("trk/trkseg/trkpt");
 36 |     float[] lat = new float[track.length];
 37 |     float[] lon = new float[track.length];
 38 |     for (int j = 0; j<track.length; j++) {
 39 |       String s = track[j].toString();
 40 |       String[] s2 = s.split("\"");
 41 |       lat[j] = float(s2[1]);
 42 |       lon[j] = float(s2[3]);
 43 |     }
 44 |     for (float j=-90; j<90; j+=locationGranularity) {
 45 |       if (lat[0]>j && lat[0]<j+locationGranularity) {
 46 |         gridLat = j+locationGranularity/2;
 47 |       }
 48 |     }
 49 |     for (float j=-180; j<180; j+=locationGranularity) {
 50 |       if (lon[0]>j && lon[0]<j+locationGranularity) {
 51 |         gridLon = j+locationGranularity/2;
 52 |       }
 53 |     }
 54 |     locations.add(gridLat + "," + gridLon, 1);  
 55 |     // Create index of Avg Lats
 56 |     if (locationMidLat.hasKey(gridLat+","+gridLon) == true) {
 57 |       float tempMidLat = locationMidLat.get(gridLat+","+gridLon);
 58 |       float avgLat = (min(lat)+max(lat))/2;
 59 |       locationMidLat.set(gridLat + "," + gridLon, (tempMidLat + avgLat)/2);
 60 |     } else {
 61 |       locationMidLat.set(gridLat + "," + gridLon, (min(lat)+max(lat))/2);
 62 |     }
 63 |     // Create index of Avg Lons
 64 |     if (locationMidLon.hasKey(gridLat+","+gridLon) == true) {
 65 |       float tempMidLon = locationMidLon.get(gridLat+","+gridLon);
 66 |       float avgLon = (min(lon)+max(lon))/2;
 67 |       locationMidLon.set(gridLat + "," + gridLon, (tempMidLon + avgLon)/2);
 68 |     } else {
 69 |       locationMidLon.set(gridLat + "," + gridLon, (min(lon)+max(lon))/2);
 70 |     }
 71 |     locationList[i] = gridLat + "," + gridLon; // name
 72 |   }
 73 | }
 74 | 
 75 | // - - - - - - - - - - - - - - - - - - - - - - - 
 76 | 
 77 | void geocodeLocationIndex() {
 78 |   locationIndexNames = new String[locationMidLat.size()];
 79 |   float[] midlats = locationMidLat.valueArray();
 80 |   float[] midlons = locationMidLon.valueArray();
 81 | 
 82 |   for (int i=0; i<locationMidLat.size(); i++) {
 83 |     try {
 84 |       String request = "http://maps.googleapis.com/maps/api/geocode/xml?latlng=" + midlats[i] + "," + midlons[i] + "&sensor=false";
 85 |       geoXML = loadXML(request);
 86 |       parseGeoResponse(geoXML, i, midlats[i], midlons[i]);
 87 |     } 
 88 |     catch (Exception e) {
 89 |     }
 90 |     delay (millisecondDelay);
 91 |   }
 92 | }
 93 | 
 94 | // - - - - - - - - - - - - - - - - - - - - - - - 
 95 | 
 96 | void parseGeoResponse(XML xml, int n, float l1, float l2) {
 97 |   String country = "";
 98 |   String adminLevel1 = "";
 99 |   String locality = "";
100 |   //  println("- - - - - - - - - - - - - - - - - - - - - - - - - - - -");
101 |   XML result = xml.getChild("result");
102 |   //  println(result);
103 |   //  println("- - - - - - - - - - - - - - - - - - - - - - - - - - - -");
104 |   XML[] address_component = result.getChildren("address_component");
105 |   //  println(address_component);
106 |   //  println(address_component.length);
107 |   for (int i=0; i<address_component.length; i++) {
108 |     XML address_type = address_component[i].getChild("type");
109 |     if (address_type!=null) {
110 |       //      println(address_type);
111 |       if (address_type.getContent().equals("country")) {
112 |         XML country_1 = address_component[i].getChild("long_name");
113 |         country = country_1.getContent();
114 |         //        println(country);
115 |       }
116 |       if (address_type.getContent().equals("administrative_area_level_1")) {
117 |         XML admin_level1 = address_component[i].getChild("long_name");
118 |         adminLevel1 = admin_level1.getContent();
119 |         //        println(adminLevel1);
120 |       }
121 |       if (address_type.getContent().equals("locality")) {
122 |         XML locality_1 = address_component[i].getChild("long_name");
123 |         locality = locality_1.getContent();
124 |         //        println(locality);
125 |       }
126 |     }
127 |   }
128 |   println(l1 + ", " + l2 + ": " + country + " / " + adminLevel1 + " / " + locality);
129 |   if (!locality.equals("")) {
130 |     locationIndexNames[n] = locality;
131 |   } else {
132 |     locationIndexNames[n] = adminLevel1;
133 |   }
134 | }
135 | 
136 | // - - - - - - - - - - - - - - - - - - - - - - - 
137 | 
138 | void buildBoxes() {
139 |   mosaicCount = ceil(sqrt(locations.size()));
140 |   boxSize = width/float(mosaicCount);
141 |   println("Mosaic Size: " + mosaicCount);
142 |   BoxList = new ArrayList<Box>();
143 |   locationKeys = locations.keyArray();
144 |   locationAmounts = locations.valueArray();
145 |   for (int i=0; i<locations.size(); i++) {
146 |     BoxList.add(new Box(i, locationKeys[i], locationAmounts[i]));
147 |   }
148 | }
149 | 
150 | // - - - - - - - - - - - - - - - - - - - - - - - 
151 | 
152 | void buildRoutes() {
153 |   RouteList = new ArrayList<Route>();
154 |   for (int i=0; i<filenames.length; i++) { //filenames.length
155 |     XML gpx_file = loadXML(filenames[i]);
156 |     RouteList.add(new Route(gpx_file, i));
157 |     println("Route " + i + ": " + filenames[i]);
158 |   }
159 | }
160 | 
161 | // - - - - - - - - - - - - - - - - - - - - - - - 
162 | 
163 | void savePNG() {
164 |   if (frameCount==1) {
165 |     saveFrame(hour() + " - " + minute() + " - " + second() + ".png");
166 |   }
167 | }


--------------------------------------------------------------------------------
/Processing_GPXMapMosaic.pde:
--------------------------------------------------------------------------------
 1 | 
 2 | // - - - - - - - - - - - - - - - - - - - - - - - 
 3 | // GPX MAP MOSAIC V:1
 4 | // © NICHOLAS FELTON / FELTRON.COM
 5 | // - - - - - - - - - - - - - - - - - - - - - - - 
 6 | 
 7 | // TO DO:
 8 | // - Compute Route Distances
 9 | // - Total Route Distances per Box
10 | // - Click to change colors
11 | 
12 | // DONE:
13 | // - Create route objects
14 | // - Create index of locations from pos[0] in route
15 | // - Show progress in console
16 | // - Build mosaic to fit locations
17 | // - Add XML parsing to locationIndex();
18 | // - Draw routes in correct mosaic location
19 | // - Center Runs
20 | // - Add framerate
21 | // - Trim Lat/Lon to 2 decimals
22 | // - If 1 run, depluralize
23 | // - Lookup Cities
24 | 
25 | // - - - - - - - - - - - - - - - - - - - - - - - 
26 | // VARIABLES
27 | // - - - - - - - - - - - - - - - - - - - - - - - 
28 | 
29 | // Data
30 | String[] filenames;
31 | String[] locationList;
32 | IntDict locations = new IntDict();
33 | FloatDict locationMidLat = new FloatDict();
34 | FloatDict locationMidLon = new FloatDict();
35 | String[] locationIndexNames;
36 | ArrayList<Box> BoxList;
37 | ArrayList<Route> RouteList;
38 | String[] locationKeys;
39 | int[] locationAmounts;
40 | 
41 | // Draw
42 | float locationGranularity = 0.15;
43 | int boxMargin = 10;
44 | int mosaicCount;
45 | float boxSize;
46 | 
47 | // GeoCoding
48 | XML geoXML;
49 | int millisecondDelay = 500; // BE POLITE.
50 | 
51 | 
52 | // - - - - - - - - - - - - - - - - - - - - - - - 
53 | // SETUP
54 | // - - - - - - - - - - - - - - - - - - - - - - - 
55 | void setup() {
56 |   size(1000, 1000);
57 |   colorMode(HSB, 100);
58 |   background(30);
59 |   importData();
60 |   buildLocationIndex();
61 |   geocodeLocationIndex();
62 |   buildBoxes();
63 |   buildRoutes();
64 | }
65 | 
66 | 
67 | // - - - - - - - - - - - - - - - - - - - - - - - 
68 | // DRAW
69 | // - - - - - - - - - - - - - - - - - - - - - - - 
70 | void draw() {
71 |   surface.setTitle(int(frameRate) + " fps / " + frameCount + " frames");
72 |   // Draw Mosaic
73 |   for (int i=0; i<BoxList.size (); i++) {
74 |     BoxList.get(i).display();
75 |   }
76 |   // Draw Routes
77 |   for (int i=0; i<RouteList.size (); i++) {
78 |     RouteList.get(i).display();
79 |   }
80 |   savePNG();
81 | }


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # GPX_MapMosaic
 2 | Processing sketch to visualize GPX routes from Strava
 3 | 
 4 | ![alt tag](https://raw.githubusercontent.com/feltron/Processing_GPXMapMosaic/master/13 - 2 - 19.png)
 5 | 
 6 | ## To Use
 7 | - Login to your account on Strava.com
 8 | - From the main drop-down menu at the top of all Strava pages (under your name) select "Settings". From the lower right of the screen, select "Download all your activities"
 9 | - Once you have received the archive of GPX files from Strava, unzip the archive and move all of them in to the "data" folder of this sketch.
10 | - Once you run the Processing sketch, it will take a little while to index all the routes and geocode the regions. Progress will be output to the console.
11 | - After the sketch has successfully run, it will save a PNG file with a timestamp into the app directory.
12 | 
13 | ## Notes
14 | - All runs are displayed at the same scale.
15 | - This sketch has not been tested with more than 500 GPX files or with cycle data.
16 | - The data folder comes pre-populated with 1 GPX file so that it will run if you do not have data of your own.
17 | - The sketch will automatically adapt the size of the mosaic to fit the number of locations.
18 | - To adjust the size of the regions being calculated, edit the "locationGranularity" constant.
19 | - To adjust the size of the box margins, edit the "boxMargin" constant.
20 | 


--------------------------------------------------------------------------------
/Route.pde:
--------------------------------------------------------------------------------
 1 | 
 2 | 
 3 | // - - - - - - - - - - - - - - - - - - - - - - - 
 4 | // ROUTE
 5 | // - - - - - - - - - - - - - - - - - - - - - - - 
 6 | 
 7 | class Route {
 8 |   float[] lat, lon, elevation, posX, posY;
 9 |   String[] time;
10 |   int routeNumber;
11 |   int mosaicIndex;
12 |   float xOrigin, yOrigin, latCenter, lonCenter;
13 | 
14 |   Route(XML source, int routeNumber_) {
15 |     routeNumber = routeNumber_;
16 |     parseXML(source);
17 |     mapPoints();
18 |   }
19 | 
20 |   void display() {
21 |     noStroke();
22 |     fill(100, 10);
23 |     for (int i=0; i<posX.length; i++) {
24 |       ellipse(posX[i], posY[i], 1, 1);
25 |     }
26 |   }
27 | 
28 |   // - - - - - - - - - - - - - - - - - - - - - - - 
29 | 
30 |   void parseXML(XML xml) {
31 |     XML[] track = xml.getChildren("trk/trkseg/trkpt");
32 |     lat = new float[track.length];
33 |     lon = new float[track.length];
34 |     elevation = new float[track.length];
35 |     time = new String[track.length];
36 |     for (int i = 0; i<track.length; i++) {
37 |       String s = track[i].toString();
38 |       String[] s2 = s.split("\"");
39 |       lat[i] = float(s2[1]);
40 |       lon[i] = float(s2[3]);
41 |       String[] s3 = s2[4].split("<");
42 |       String[] s4 = s3[1].split(">");
43 |       elevation[i] = float(s4[1]);
44 |       //println(i + " / " + track.length);
45 |       //println("lat: " + lat[i] + " / lon: " + lon[i] + " / elevation: " + elevation[i]);
46 |     }
47 |   }
48 | 
49 |   // - - - - - - - - - - - - - - - - - - - - - - -
50 | 
51 |   void mapPoints() {
52 |     // Find Mosaic Index
53 |     for (int i=0; i<locationKeys.length; i++) {
54 |       if (locationList[routeNumber].equals(locationKeys[i])) {
55 |         mosaicIndex = i;
56 |       }
57 |     }
58 |     xOrigin = mosaicIndex%mosaicCount*boxSize;
59 |     yOrigin = mosaicIndex/mosaicCount*boxSize;
60 |     // Calculate Route Positions
61 |     posX = new float[lat.length];
62 |     posY = new float[lat.length];
63 |     // Calculate offset from box center to runs center
64 |     latCenter = locationMidLat.get(locationList[routeNumber]) ; // float(latlon[0])
65 |     lonCenter = locationMidLon.get(locationList[routeNumber]) ; // float(latlon[1])
66 |     for (int i=0; i<lat.length; i++) {
67 |       posX[i] = map(lon[i], lonCenter-locationGranularity/2, lonCenter+locationGranularity/2, xOrigin, xOrigin+boxSize);
68 |       posY[i] = map(lat[i], latCenter+locationGranularity/2, latCenter-locationGranularity/2, yOrigin, yOrigin+boxSize);
69 |     }
70 |   }
71 | }


--------------------------------------------------------------------------------