Changeset 5f05e83 in OpenWorkouts-current for ow/static/js/ow.js

Timestamp:

Feb 5, 2019, 5:15:13 PM (5 years ago)

Author:

Borja Lopez <borja@…>

Branches:

current, feature/docs, master

Children:

3169fe4

Parents:

d52ba50

git-author:

Borja Lopez <borja@…> (02/05/19 16:50:41)

git-committer:

Borja Lopez <borja@…> (02/05/19 17:15:13)

Message:

Replaced Leaflet.Elevation with a newer, improved version (fork of the original)

Done some clean-up of the map javascript code, removed old tests and WIP code
that is not needed anymore.

IMPORTANT: After pulling this patch, run js_deps to install the new version of
leaflet elevation:

./bin/js_deps

File:

• ow/static/js/ow.js (modified) (4 diffs)

ow/static/js/ow.js

@@ -35 +35 @@
     var gpx;
     var elevation;
-    var ow_charts;
 
     var create_map = function create_map(latitude, longitude, zoom) {
@@ -52 +51 @@
            This has to be called *after* create_map and *before* load_gpx.
         */
+
         elevation = L.control.elevation({
             position: "bottomright",
-            theme: "steelblue-theme", //default: lime-theme
-            width: 600,
-            height: 125,
-            margins: {
-                top: 10,
-                right: 20,
-                bottom: 30,
-                left: 50
-            },
+            theme: "openworkouts-theme",
             useHeightIndicator: true, //if false a marker is drawn at map position
-            interpolation: "linear", //see https://github.com/mbostock/d3/wiki/SVG-Shapes#wiki-area_interpolate
-            hoverNumber: {
-                decimalsX: 3, //decimals on distance (always in km)
-                decimalsY: 0, //deciamls on height (always in m)
-                formatter: undefined //custom formatter function may be injected
-            },
-            xTicks: undefined, //number of ticks in x axis, calculated by default according to width
-            yTicks: undefined, //number of ticks on y axis, calculated by default according to height
-            collapsed: false    //collapsed mode, show chart on click or mouseover
-        });
-
-        var ele_container = elevation.addTo(map);
-        /* document.getElementById('ow-analysis').appendChild(
-            ele_container._container); */
+            interpolation: d3.curveLinear,
+            elevationDiv: "#elevation",
+            detachedView: true,
+            responsiveView: true,
+            gpxOptions: {
+                async: true,
+                marker_options: {
+                    startIconUrl: null,
+                    endIconUrl: null,
+                    shadowUrl: null,
+                },
+                polyline_options: {
+                    color: '#EE4056',
+                    opacity: 0.75,
+                    weight: 5,
+                    lineCap: 'round'
+                },
+            },
+        });
+        elevation.loadGPX(map, gpx_url);
+        // var ele_container = elevation.addTo(map);
     };
 
@@ -101 +100 @@
             gpx.on("addline",function(e){
                 elevation.addData(e.line);
-                // ow_charts.addData(e.line);
             });
         };
@@ -114 +112 @@
             add_elevation_chart();
         }
-        // add_ow_charts();
-        load_gpx(gpx_url);
+        // load_gpx(gpx_url);
     };