@raruto/leaflet-elevation 1.7.2 → 1.7.6

package/dist/leaflet-elevation.js

@@ -172,7 +172,9 @@
       } : L.extend({
         lazy: true
       }, control.options.distanceMarkers);
-      var wptIcons = control.options.wptIcons;
+      var _control$options = control.options,
+          wptIcons = _control$options.wptIcons,
+          wptLabels = _control$options.wptLabels;
       var layer = L.geoJson(data, {
         distanceMarkers: distanceMarkers,
         style: function style(feature) {
@@ -185,39 +187,47 @@
           return style;
         },
         pointToLayer: function pointToLayer(feature, latlng) {
+          var _prop$desc, _prop$name, _prop$sym;
+
           if (!control.options.waypoints) return;
           var prop = feature.properties;
-          var desc = prop.desc ? prop.desc : '';
-          var name = prop.name ? prop.name : '';
-          var sym = (prop.sym ? prop.sym : name).replace(' ', '-').replace('"', '').replace("'", '').toLowerCase(); // generate and cache appropriate icon symbol
-
-          if (!wptIcons.hasOwnProperty(sym)) {
-            wptIcons[sym] = L.divIcon(L.extend({}, wptIcons[""].options, {
-              html: '<i class="elevation-waypoint-icon ' + sym + '"></i>'
-            }));
-          }
-
-          var marker = L.marker(latlng, {
-            icon: wptIcons[sym]
-          });
+          var desc = (_prop$desc = prop.desc) !== null && _prop$desc !== void 0 ? _prop$desc : '';
+          var name = (_prop$name = prop.name) !== null && _prop$name !== void 0 ? _prop$name : '';
+          var sym = ((_prop$sym = prop.sym) !== null && _prop$sym !== void 0 ? _prop$sym : name).replace(' ', '-').replace('"', '').replace("'", '').toLowerCase(); // Handle chart waypoints (dots)
+
+          if ([true, 'dots'].includes(control.options.waypoints)) {
+            control._registerCheckPoint({
+              latlng: latlng,
+              label: [true, 'dots'].includes(wptLabels) ? name : ''
+            }, true);
+          } // Handle map waypoints (markers)
+
+
+          if ([true, 'markers'].includes(control.options.waypoints) && wptIcons != false) {
+            // generate and cache appropriate icon symbol
+            if (!wptIcons.hasOwnProperty(sym)) {
+              wptIcons[sym] = L.divIcon(L.extend({}, wptIcons[""].options, {
+                html: '<i class="elevation-waypoint-icon ' + sym + '"></i>'
+              }));
+            }
 
-          if (name || desc) {
-            marker.bindPopup("<b>" + name + "</b>" + (desc.length > 0 ? '<br>' + desc : '')).openPopup();
-          }
+            var marker = L.marker(latlng, {
+              icon: wptIcons[sym]
+            });
 
-          control._addMarker(marker);
+            if ([true, 'markers'].includes(wptLabels) && (name || desc)) {
+              marker.bindPopup("<b>" + name + "</b>" + (desc.length > 0 ? '<br>' + desc : '')).openPopup();
+            }
 
-          control._registerCheckPoint({
-            latlng: latlng,
-            label: name
-          }, true);
+            control._addMarker(marker);
 
-          control.fire('waypoint_added', {
-            point: marker,
-            element: latlng,
-            properties: prop
-          });
-          return marker;
+            control.fire('waypoint_added', {
+              point: marker,
+              element: latlng,
+              properties: prop
+            });
+            return marker;
+          }
         },
         onEachFeature: function onEachFeature(feature, layer) {
           if (feature.geometry && feature.geometry.type == 'Point') return; // Standard GeoJSON
@@ -680,12 +690,25 @@
           xCoord = _ref5$xCoord === void 0 ? 0 : _ref5$xCoord,
           _ref5$yCoord = _ref5.yCoord,
           yCoord = _ref5$yCoord === void 0 ? 0 : _ref5$yCoord,
-          label = _ref5.label;
+          _ref5$labels = _ref5.labels,
+          labels = _ref5$labels === void 0 ? {} : _ref5$labels,
+          _ref5$item = _ref5.item,
+          item = _ref5$item === void 0 ? {} : _ref5$item;
       return function (text) {
         text.attr("class", theme + " height-focus-label").style("pointer-events", "none").attr("x", xCoord + 5).attr("y", yCoord);
-        var y = text.select(".height-focus-y");
-        if (!y.node()) y = text.append("svg:tspan");
-        y.attr("class", "height-focus-y").text(label);
+        var label;
+
+        for (var i in labels) {
+          label = text.select(".height-focus-" + labels[i].name);
+
+          if (!label.size()) {
+            label = text.append("svg:tspan").attr("class", "height-focus-" + labels[i].name).attr("dy", "1.5em");
+          }
+
+          label.text(typeof labels[i].value !== "function" ? labels[i].value : labels[i].value(item));
+        }
+
+        text.select('tspan').attr("dy", text.selectAll('tspan').size() > 1 ? "-1.5em" : "0em");
         text.selectAll('tspan').attr("x", xCoord + 5);
         return text;
       };
@@ -738,23 +761,17 @@
     var MouseFocusLabel = function MouseFocusLabel(_ref9) {
       var xCoord = _ref9.xCoord,
           yCoord = _ref9.yCoord,
-          _ref9$labelX = _ref9.labelX,
-          labelX = _ref9$labelX === void 0 ? "" : _ref9$labelX,
-          _ref9$labelY = _ref9.labelY,
-          labelY = _ref9$labelY === void 0 ? "" : _ref9$labelY,
-          width = _ref9.width;
+          width = _ref9.width,
+          _ref9$labels = _ref9.labels,
+          labels = _ref9$labels === void 0 ? {} : _ref9$labels,
+          _ref9$item = _ref9.item,
+          item = _ref9$item === void 0 ? {} : _ref9$item;
       return function (g) {
         g.attr('class', 'mouse-focus-label');
         var rect = g.select(".mouse-focus-label-rect");
         var text = g.select(".mouse-focus-label-text");
-        var y = text.select(".mouse-focus-label-y");
-        var x = text.select(".mouse-focus-label-x");
         if (!rect.node()) rect = g.append("svg:rect");
-        if (!text.node()) text = g.append("svg:text");
-        if (!y.node()) y = text.append("svg:tspan");
-        if (!x.node()) x = text.append("svg:tspan");
-        y.text(labelY);
-        x.text(labelX); // Sets focus-label-text position to the left / right of the mouse-focus-line
+        if (!text.node()) text = g.append("svg:text"); // Sets focus-label-text position to the left / right of the mouse-focus-line
 
         var xAlign = 0;
         var yAlign = 0;
@@ -773,8 +790,19 @@
         if (yCoord) yAlign = Math.max(yCoord - bbox.height, L.Browser.webkit ? 0 : -Infinity);
         rect.attr("class", "mouse-focus-label-rect").attr("x", xAlign - 5).attr("y", yAlign - 5).attr("width", bbox.width + 10).attr("height", bbox.height + 10).attr("rx", 3).attr("ry", 3);
         text.attr("class", "mouse-focus-label-text").style("font-weight", "700").attr("y", yAlign);
-        y.attr("class", "mouse-focus-label-y").attr("dy", "1em");
-        x.attr("class", "mouse-focus-label-x").attr("dy", "2em");
+        var label;
+
+        for (var i in labels) {
+          label = text.select(".mouse-focus-label-" + labels[i].name);
+
+          if (!label.size()) {
+            label = text.append("svg:tspan", ".mouse-focus-label-x").attr("class", "mouse-focus-label-" + labels[i].name).attr("dy", "1.5em");
+          }
+
+          label.text(typeof labels[i].value !== "function" ? labels[i].value : labels[i].value(item));
+        }
+
+        text.select('tspan').attr("dy", "1em");
         text.selectAll('tspan').attr("x", xAlign);
         return g;
       };
@@ -928,8 +956,9 @@
         yCoord: 0,
         height: _height,
         width: _width,
-        labelX: "",
-        labelY: ""
+        labels: {} // labelX: "",
+        // labelY: "",
+
       })); // Add the brushing
 
       var brush = d3.brushX().on('start.cursor end.cursor brush.cursor', function () {
@@ -1797,28 +1826,9 @@
           yCoord: yCoordinate,
           height: this._height(),
           width: this._width(),
-          labelX: d3.format("." + opts.decimalsX + "f")(item[opts.xAttr]) + " " + this._xLabel,
-          labelY: d3.format("." + opts.decimalsY + "f")(item[opts.yAttr]) + " " + this._yLabel
-        })); // this._focuslabel.selectAll('tspan').data(Object.values(this._focuslabels));
-
-
-        var labels = this._props.focusLabels;
-
-        var tooltip = this._focuslabel.select('text');
-
-        var label;
-
-        for (var i in labels) {
-          label = tooltip.select(".mouse-focus-label-" + labels[i].name);
-
-          if (!label.size()) {
-            label = tooltip.append("svg:tspan", ".mouse-focus-label-x").attr("class", "mouse-focus-label-" + labels[i].name).attr("dy", "1.5em");
-          }
-
-          label.text(typeof labels[i].value !== "function" ? labels[i].value : labels[i].value(item));
-
-          this._focuslabel.select('.mouse-focus-label-x').attr("dy", "1.5em");
-        }
+          labels: this._props.focusLabels,
+          item: item
+        }));
       },
       _hideDiagramIndicator: function _hideDiagramIndicator() {
         this._focusG.attr("display", 'none');
@@ -1921,24 +1931,9 @@
             theme: opts.theme,
             xCoord: point.x,
             yCoord: normalizedY,
-            label: d3.format("." + opts.decimalsY + "f")(point[opts.yAttr]) + " " + this._yLabel
+            labels: this._focuslabels,
+            item: point
           }));
-
-          var labels = this._focuslabels;
-          var tooltip = this._focuslabel;
-          var label;
-
-          for (var i in labels) {
-            label = tooltip.select(".height-focus-" + labels[i].name);
-
-            if (!label.size()) {
-              label = tooltip.append("svg:tspan").attr("class", "height-focus-" + labels[i].name).attr("dy", "1.5em");
-            }
-
-            label.text(typeof labels[i].value !== "function" ? labels[i].value : labels[i].value(props.item));
-
-            this._focuslabel.select('.height-focus-y').attr("dy", "-1.5em");
-          }
         } else if (this.options.marker == 'position-marker') {
           removeClass(this._marker.getElement(), 'leaflet-hidden');
 
@@ -2074,6 +2069,7 @@
       time: false,
       timeFactor: 3600,
       timeFormat: false,
+      timestamps: false,
       sDeltaMax: undefined,
       sInterpolation: "curveStepAfter",
       sRange: undefined,
@@ -2087,6 +2083,7 @@
           iconAnchor: [8, 30]
         })
       },
+      wptLabels: true,
       xAttr: "dist",
       xLabel: "km",
       xTicks: undefined,
@@ -2108,7 +2105,7 @@
       __TOGEOJSON: 'https://unpkg.com/@tmcw/togeojson@4.3.0/dist/togeojson.umd.js',
       __LGEOMUTIL: 'https://unpkg.com/leaflet-geometryutil@0.9.3/src/leaflet.geometryutil.js',
       __LALMOSTOVER: 'https://unpkg.com/leaflet-almostover@1.0.1/src/leaflet.almostover.js',
-      __LDISTANCEM: 'https://unpkg.com/@raruto/leaflet-elevation@1.7.2/libs/leaflet-distance-marker.min.js',
+      __LDISTANCEM: 'https://unpkg.com/@raruto/leaflet-elevation@1.7.5/libs/leaflet-distance-marker.min.js',
 
       /*
        * Add data to the diagram either from GPX or GeoJSON and update the axis domain and data
@@ -2116,7 +2113,7 @@
       addData: function addData(d, layer) {
         var _this = this;
 
-        if ((typeof layer === "undefined" || layer === null) && d.on) {
+        if (typeof layer === "undefined" && d.on) {
           layer = d;
         }
 
@@ -2166,9 +2163,11 @@
         this._updateChart();
       },
       _clearChart: function _clearChart() {
+        var _this2 = this;
+
         if (this._events && this._events.elechart_updated) {
           this._events.elechart_updated.forEach(function (e) {
-            return controlElevation.off('elechart_updated', e.fn, e.ctx);
+            return _this2.off('elechart_updated', e.fn, e.ctx);
           });
         }
 
@@ -2293,9 +2292,10 @@
         // 	this._updateChart   = _.debounce(this._updateChart,   300, this);
         // 	this._updateSummary = _.debounce(this._updateSummary, 300, this);
         // }
-        // Leaflet canvas renderer colors
 
 
+        if (this.options.wptIcons === true) this.options.wptIcons = Options.wptIcons; // Leaflet canvas renderer colors
+
         L.extend(Colors, this.options.colors || {});
       },
 
@@ -2346,14 +2346,14 @@
        * Load data from a remote url.
        */
       loadFile: function loadFile(url) {
-        var _this2 = this;
+        var _this3 = this;
 
         fetch(url).then(function (response) {
           return response.text();
         }).then(function (data) {
-          _this2._downloadURL = url; // TODO: handle multiple urls?
+          _this3._downloadURL = url; // TODO: handle multiple urls?
 
-          _this2.loadData(data, {
+          _this3.loadData(data, {
             lazy: false,
             defer: false
           });
@@ -2380,7 +2380,7 @@
        * Load raw XML data.
        */
       loadXML: function loadXML(data) {
-        var _this3 = this;
+        var _this4 = this;
 
         Elevation._togeojsonLazyLoader = lazyLoader(this.__TOGEOJSON, typeof toGeoJSON !== 'function' || !this.options.lazyLoadJS, Elevation._togeojsonLazyLoader).then(function () {
           var xml = new DOMParser().parseFromString(data, "text/xml");
@@ -2395,11 +2395,11 @@
 
           if (name[0]) {
             geojson.name = name[0].innerHTML;
-          } else if (_this3._downloadURL) {
-            geojson.name = _this3._downloadURL.split('/').pop().split('#')[0].split('?')[0];
+          } else if (_this4._downloadURL) {
+            geojson.name = _this4._downloadURL.split('/').pop().split('#')[0].split('?')[0];
           }
 
-          return _this3.loadGeoJSON(geojson, _this3);
+          return _this4.loadGeoJSON(geojson, _this4);
         });
       },
 
@@ -2407,7 +2407,7 @@
        * Wait for chart container visible before download data.
        */
       loadLazy: function loadLazy(data, opts) {
-        var _this4 = this;
+        var _this5 = this;
 
         opts = L.extend({}, this.options.loadData, opts);
         var elem = opts.lazy.parentNode ? opts.lazy : this.placeholder;
@@ -2415,10 +2415,10 @@
         waitHolder(elem).then(function () {
           opts.lazy = false;
 
-          _this4.loadData(data, opts);
+          _this5.loadData(data, opts);
 
-          _this4.once('eledata_loaded', function () {
-            return _this4.placeholder.parentNode.removeChild(elem);
+          _this5.once('eledata_loaded', function () {
+            return _this5.placeholder.parentNode.removeChild(elem);
           });
         });
       },
@@ -2428,7 +2428,7 @@
        * Called on control.addTo(map).
        */
       onAdd: function onAdd(map) {
-        var _this5 = this;
+        var _this6 = this;
 
         this._map = map;
 
@@ -2448,27 +2448,27 @@
         }
 
         Elevation._d3LazyLoader = lazyLoader(this.__D3, (typeof d3 === "undefined" ? "undefined" : _typeof(d3)) !== 'object' || !this.options.lazyLoadJS, Elevation._d3LazyLoader).then(function () {
-          _this5._initButton(container);
+          _this6._initButton(container);
 
-          _this5._initChart(container);
+          _this6._initChart(container);
 
-          _this5._initSummary(container);
+          _this6._initSummary(container);
 
-          _this5._initMarker(map);
+          _this6._initMarker(map);
 
-          _this5._initLayer(map);
+          _this6._initLayer(map);
 
-          map.on('zoom viewreset zoomanim', _this5._hideMarker, _this5).on('resize', _this5._resetView, _this5).on('resize', _this5._resizeChart, _this5).on('rotate', _this5._rotateMarker, _this5).on('mousedown', _this5._resetDrag, _this5);
+          map.on('zoom viewreset zoomanim', _this6._hideMarker, _this6).on('resize', _this6._resetView, _this6).on('resize', _this6._resizeChart, _this6).on('rotate', _this6._rotateMarker, _this6).on('mousedown', _this6._resetDrag, _this6);
 
-          on(map.getContainer(), 'mousewheel', _this5._resetDrag, _this5);
+          on(map.getContainer(), 'mousewheel', _this6._resetDrag, _this6);
 
-          on(map.getContainer(), 'touchstart', _this5._resetDrag, _this5);
+          on(map.getContainer(), 'touchstart', _this6._resetDrag, _this6);
 
-          _this5.on('eledata_added eledata_loaded', _this5._updateChart, _this5).on('eledata_added eledata_loaded', _this5._updateSummary, _this5);
+          _this6.on('eledata_added eledata_loaded', _this6._updateChart, _this6).on('eledata_added eledata_loaded', _this6._updateSummary, _this6);
 
-          _this5._updateChart();
+          _this6._updateChart();
 
-          _this5._updateSummary();
+          _this6._updateSummary();
         });
         return container;
       },
@@ -2513,7 +2513,7 @@
        * Parsing data either from GPX or GeoJSON and update the diagram data
        */
       _addData: function _addData(d) {
-        var _this6 = this;
+        var _this7 = this;
 
         if (!d) {
           return;
@@ -2530,7 +2530,7 @@
 
             case 'MultiLineString':
               each(geom.coordinates, function (coords) {
-                return _this6._addGeoJSONData(coords);
+                return _this7._addGeoJSONData(coords);
               });
 
               break;
@@ -2542,7 +2542,7 @@
 
         if (d.type === "FeatureCollection") {
           each(d.features, function (feature) {
-            return _this6._addData(feature);
+            return _this7._addData(feature);
           });
         }
 
@@ -2555,14 +2555,14 @@
        * Parsing of GeoJSON data lines and their elevation in z-coordinate
        */
       _addGeoJSONData: function _addGeoJSONData(coords) {
-        var _this7 = this;
+        var _this8 = this;
 
         each(coords, function (point) {
-          _this7._addPoint(point[1], point[0], point[2]);
+          _this8._addPoint(point[1], point[0], point[2]);
 
-          _this7._fireEvt("elepoint_added", {
+          _this8._fireEvt("elepoint_added", {
             point: point,
-            index: _this7._data.length - 1
+            index: _this8._data.length - 1
           });
         });
 
@@ -2576,14 +2576,14 @@
        * Parsing function for GPX data and their elevation in z-coordinate
        */
       _addGPXData: function _addGPXData(coords) {
-        var _this8 = this;
+        var _this9 = this;
 
         each(coords, function (point) {
-          _this8._addPoint(point.lat, point.lng, point.meta.ele);
+          _this9._addPoint(point.lat, point.lng, typeof point.alt !== "undefined" ? point.alt : point.meta.ele);
 
-          _this8._fireEvt("elepoint_added", {
+          _this9._fireEvt("elepoint_added", {
             point: point,
-            index: _this8._data.length - 1
+            index: _this9._data.length - 1
           });
         });
 
@@ -2734,17 +2734,17 @@
         this._fireEvt("elechart_init");
       },
       _initLayer: function _initLayer() {
-        var _this9 = this;
+        var _this10 = this;
 
         this._layers.on('layeradd layerremove', function (e) {
           var layer = e.layer;
           var node = layer.getElement && layer.getElement();
 
-          toggleClass(node, _this9.options.polyline.className + ' ' + _this9.options.theme, e.type == 'layeradd');
+          toggleClass(node, _this10.options.polyline.className + ' ' + _this10.options.theme, e.type == 'layeradd');
 
-          toggleEvent(layer, "mousemove", _this9._mousemoveLayerHandler.bind(_this9), e.type == 'layeradd');
+          toggleEvent(layer, "mousemove", _this10._mousemoveLayerHandler.bind(_this10), e.type == 'layeradd');
 
-          toggleEvent(layer, "mouseout", _this9._mouseoutHandler.bind(_this9), e.type == 'layeradd');
+          toggleEvent(layer, "mouseout", _this10._mouseoutHandler.bind(_this10), e.type == 'layeradd');
         });
       },
       _initMarker: function _initMarker(map) {
@@ -2918,10 +2918,10 @@
        * Add a waypoint marker to the diagram
        */
       _registerCheckPoint: function _registerCheckPoint(props) {
-        var _this10 = this;
+        var _this11 = this;
 
         this.on("elechart_updated", function () {
-          return _this10._chart._registerCheckPoint(props);
+          return _this11._chart._registerCheckPoint(props);
         });
       },
 
@@ -2929,10 +2929,10 @@
        * Add chart profile to diagram
        */
       _registerAreaPath: function _registerAreaPath(props) {
-        var _this11 = this;
+        var _this12 = this;
 
         this.on("elechart_init", function () {
-          return _this11._chart._registerAreaPath(props);
+          return _this12._chart._registerAreaPath(props);
         });
       },
 
@@ -2940,10 +2940,10 @@
        * Add chart grid to diagram
        */
       _registerAxisGrid: function _registerAxisGrid(props) {
-        var _this12 = this;
+        var _this13 = this;
 
         this.on("elechart_axis", function () {
-          return _this12._chart._registerAxisGrid(props);
+          return _this13._chart._registerAxisGrid(props);
         });
       },
 
@@ -2951,10 +2951,10 @@
        * Add chart axis to diagram
        */
       _registerAxisScale: function _registerAxisScale(props) {
-        var _this13 = this;
+        var _this14 = this;
 
         this.on("elechart_axis", function () {
-          return _this13._chart._registerAxisScale(props);
+          return _this14._chart._registerAxisScale(props);
         });
       },
 
@@ -2962,14 +2962,14 @@
        * Add chart or marker tooltip info
        */
       _registerFocusLabel: function _registerFocusLabel(props) {
-        var _this14 = this;
+        var _this15 = this;
 
         if (props.chart) {
           var label = L.extend({}, props, {
             value: props.chart
           });
           this.on("elechart_init", function () {
-            return _this14._chart._registerFocusLabel(label);
+            return _this15._chart._registerFocusLabel(label);
           });
         }
 
@@ -2979,7 +2979,7 @@
           });
 
           this.on("elechart_marker", function () {
-            return _this14._marker._registerFocusLabel(_label);
+            return _this15._marker._registerFocusLabel(_label);
           });
         }
       },
@@ -2988,10 +2988,10 @@
        * Add summary info to diagram
        */
       _registerSummary: function _registerSummary(props) {
-        var _this15 = this;
+        var _this16 = this;
 
         this.on('elechart_summary', function () {
-          return _this15._summary._registerSummary(props);
+          return _this16._summary._registerSummary(props);
         });
       },
 
@@ -3023,7 +3023,8 @@
        * Hacky way for handling chart resize. Deletes it and redraw chart.
        */
       _resizeChart: function _resizeChart() {
-        // prevent displaying chart on resize if hidden
+        if (!this._container) return; // prevent displaying chart on resize if hidden
+
         if (style(this._container, "display") == "none") return;
         var opts = this.options;
 
@@ -3098,7 +3099,7 @@
        * Toggle chart data on legend click
        */
       _toggleChartHandler: function _toggleChartHandler(e) {
-        var _this16 = this;
+        var _this17 = this;
 
         var path = e.path,
             name = e.name,
@@ -3108,7 +3109,7 @@
         this._layers.eachLayer(function (layer) {
           var node = layer.getElement && layer.getElement();
 
-          toggleClass(node, _this16.options.polyline.className + ' ' + _this16.options.theme, _this16._chartEnabled);
+          toggleClass(node, _this17.options.polyline.className + ' ' + _this17.options.theme, _this17._chartEnabled);
         }); // toggle option value (eg. altitude = { 'disabled' || 'disabled' })
 
 
@@ -3127,7 +3128,7 @@
       _updateChart: function _updateChart() {
         if (
         /*!this._data.length ||*/
-        !this._container) return;
+        !this._chart || !this._container) return;
 
         this._fireEvt("elechart_axis");
 
@@ -3182,7 +3183,7 @@
        * Update chart summary.
        */
       _updateSummary: function _updateSummary() {
-        var _this17 = this;
+        var _this18 = this;
 
         this._summary.reset();
 
@@ -3197,9 +3198,9 @@
           select('.download a', this.summaryDiv).onclick = function (e) {
             e.preventDefault();
 
-            _this17._fireEvt('eletrack_download', {
-              downloadLink: _this17.options.downloadLink,
-              confirm: saveFile.bind(_this17, _this17._downloadURL)
+            _this18._fireEvt('eletrack_download', {
+              downloadLink: _this18.options.downloadLink,
+              confirm: saveFile.bind(_this18, _this18._downloadURL)
             });
           };
         }
@@ -3263,7 +3264,7 @@
         }
       });
       this.on('eledata_loaded', function (e) {
-        var _this18 = this;
+        var _this19 = this;
 
         var map = this._map;
         var layer = e.layer;
@@ -3274,7 +3275,7 @@
         }
 
         map.once('layeradd', function (e) {
-          return _this18.options.autofitBounds && _this18.fitBounds(layer.getBounds());
+          return _this19.options.autofitBounds && _this19.fitBounds(layer.getBounds());
         });
 
         if (L.Browser.mobile) {
@@ -3283,28 +3284,28 @@
           // leaflet-geometryutil
           Elevation._geomutilLazyLoader = lazyLoader(this.__LGEOMUTIL, typeof L.GeometryUtil !== 'function' || !this.options.lazyLoadJS, Elevation._geomutilLazyLoader).then(function () {
             // leaflet-almostover
-            if (_this18.options.almostOver) {
-              Elevation._almostoverLazyLoader = lazyLoader(_this18.__LALMOSTOVER, typeof L.Handler.AlmostOver !== 'function' || !_this18.options.lazyLoadJS, Elevation._almostoverLazyLoader).then(function () {
+            if (_this19.options.almostOver) {
+              Elevation._almostoverLazyLoader = lazyLoader(_this19.__LALMOSTOVER, typeof L.Handler.AlmostOver !== 'function' || !_this19.options.lazyLoadJS, Elevation._almostoverLazyLoader).then(function () {
                 map.addHandler('almostOver', L.Handler.AlmostOver);
 
                 if (L.GeometryUtil && map.almostOver && map.almostOver.enabled()) {
                   map.almostOver.addLayer(layer);
                   map.on('almost:move', function (e) {
-                    return _this18._mousemoveLayerHandler(e);
+                    return _this19._mousemoveLayerHandler(e);
                   }).on('almost:out', function (e) {
-                    return _this18._mouseoutHandler(e);
+                    return _this19._mouseoutHandler(e);
                   });
                 }
               });
             } // leaflet-distance-markers
 
 
-            if (_this18.options.distanceMarkers) {
-              Elevation._distanceMarkersLazyLoader = lazyLoader(_this18.__LDISTANCEM, typeof L.DistanceMarkers !== 'function' || !_this18.options.lazyLoadJS, Elevation._distanceMarkersLazyLoader).then(function () {
-                return _this18.options.polyline && layer.addTo(map);
+            if (_this19.options.distanceMarkers) {
+              Elevation._distanceMarkersLazyLoader = lazyLoader(_this19.__LDISTANCEM, typeof L.DistanceMarkers !== 'function' || !_this19.options.lazyLoadJS, Elevation._distanceMarkersLazyLoader).then(function () {
+                return _this19.options.polyline && layer.addTo(map);
               });
             } else {
-              if (_this18.options.polyline) layer.addTo(map);
+              if (_this19.options.polyline) layer.addTo(map);
             }
           });
         }
@@ -3325,7 +3326,7 @@
             if (options.stroke && options.weight !== 0) {
               var oldVal = ctx.globalCompositeOperation || 'source-over';
               ctx.globalCompositeOperation = 'destination-over';
-              ctx.strokeStyle = '#FFF';
+              ctx.strokeStyle = color.outline || '#FFF';
               ctx.lineWidth = options.weight * 1.75;
               ctx.stroke();
               ctx.globalCompositeOperation = oldVal;
@@ -3349,74 +3350,6 @@
       });
     });
 
-    Elevation.addInitHook(function () {
-      var _this2 = this;
-
-      var opts = this.options;
-      var distance = {};
-
-      if (this.options.imperial) {
-        this._distanceFactor = this.__mileFactor;
-        this._xLabel = "mi";
-      } else {
-        this._distanceFactor = opts.distanceFactor;
-        this._xLabel = opts.xLabel;
-      }
-
-      this.on("eledata_updated", function (e) {
-        var data = this._data;
-        var i = e.index;
-        var track = this.track_info;
-        var dist = track.distance || 0;
-        var curr = data[i].latlng;
-        var prev = i > 0 ? data[i - 1].latlng : curr;
-
-        var delta = curr.distanceTo(prev) * this._distanceFactor;
-
-        dist += Math.round(delta / 1000 * 100000) / 100000; // handles floating points calc
-
-        data[i].dist = dist;
-        track.distance = dist;
-      });
-      this.on("elechart_axis", function () {
-        this._chart._registerAxisGrid({
-          axis: "x",
-          position: "bottom",
-          scale: this._chart._x
-        });
-      });
-
-      if (this.options.distance != "summary") {
-        this.on("elechart_axis", function () {
-          var _this = this;
-
-          distance.x = this._chart._x;
-          distance.label = this._chart._xLabel;
-
-          this._chart._registerAxisScale({
-            axis: "x",
-            position: "bottom",
-            scale: distance.x,
-            label: distance.label,
-            labelY: 25,
-            labelX: function labelX() {
-              return _this._width() + 6;
-            },
-            name: "distance"
-          });
-        });
-      }
-
-      this._registerSummary({
-        "totlen": {
-          label: "Total Length: ",
-          value: function value(track) {
-            return (track.distance || 0).toFixed(2) + '&nbsp;' + _this2._xLabel;
-          }
-        }
-      });
-    });
-
     Elevation.addInitHook(function () {
       var _this = this;
 
@@ -3513,6 +3446,16 @@
         });
       }
 
+      this._registerFocusLabel({
+        name: 'y',
+        chart: function chart(item) {
+          return L._("y: ") + d3.format("." + opts.decimalsY + "f")(item[opts.yAttr]) + " " + _this._yLabel;
+        },
+        marker: function marker(item) {
+          return d3.format("." + opts.decimalsY + "f")(item[opts.yAttr]) + " " + _this._yLabel;
+        }
+      });
+
       this._registerSummary({
         "maxele": {
           label: "Max Elevation: ",
@@ -3529,6 +3472,81 @@
       });
     });
 
+    Elevation.addInitHook(function () {
+      var _this2 = this;
+
+      var opts = this.options;
+      var distance = {};
+
+      if (this.options.imperial) {
+        this._distanceFactor = this.__mileFactor;
+        this._xLabel = "mi";
+      } else {
+        this._distanceFactor = opts.distanceFactor;
+        this._xLabel = opts.xLabel;
+      }
+
+      this.on("eledata_updated", function (e) {
+        var data = this._data;
+        var i = e.index;
+        var track = this.track_info;
+        var dist = track.distance || 0;
+        var curr = data[i].latlng;
+        var prev = i > 0 ? data[i - 1].latlng : curr;
+
+        var delta = curr.distanceTo(prev) * this._distanceFactor;
+
+        dist += Math.round(delta / 1000 * 100000) / 100000; // handles floating points calc
+
+        data[i].dist = dist;
+        track.distance = dist;
+      });
+      this.on("elechart_axis", function () {
+        this._chart._registerAxisGrid({
+          axis: "x",
+          position: "bottom",
+          scale: this._chart._x
+        });
+      });
+
+      if (this.options.distance != "summary") {
+        this.on("elechart_axis", function () {
+          var _this = this;
+
+          distance.x = this._chart._x;
+          distance.label = this._chart._xLabel;
+
+          this._chart._registerAxisScale({
+            axis: "x",
+            position: "bottom",
+            scale: distance.x,
+            label: distance.label,
+            labelY: 25,
+            labelX: function labelX() {
+              return _this._width() + 6;
+            },
+            name: "distance"
+          });
+        });
+      }
+
+      this._registerFocusLabel({
+        name: 'x',
+        chart: function chart(item) {
+          return L._("x: ") + d3.format("." + opts.decimalsX + "f")(item[opts.xAttr]) + " " + _this2._xLabel;
+        }
+      });
+
+      this._registerSummary({
+        "totlen": {
+          label: "Total Length: ",
+          value: function value(track) {
+            return (track.distance || 0).toFixed(2) + '&nbsp;' + _this2._xLabel;
+          }
+        }
+      });
+    });
+
     Elevation.addInitHook(function () {
       var _this = this;
 
@@ -3618,11 +3636,20 @@
         this.track_info.time = duration;
       });
 
+      if (this.options.timestamps) {
+        this._registerFocusLabel({
+          name: 'date',
+          chart: function chart(item) {
+            return L._("t: ") + _this.options.timeFormat(item.time);
+          }
+        });
+      }
+
       if (this.options.time) {
         this._registerFocusLabel({
           name: 'time',
           chart: function chart(item) {
-            return _this.options.timeFormat(item.time);
+            return L._("T: ") + formatTime(item.duration || 0);
           }
         });
 
@@ -3726,7 +3753,7 @@
       this._registerFocusLabel({
         name: 'slope',
         chart: function chart(item) {
-          return item.slope + slope.label;
+          return L._("m: ") + item.slope + slope.label;
         },
         marker: function marker(item) {
           return Math.round(item.slope) + slope.label;
@@ -3846,7 +3873,7 @@
         this._registerFocusLabel({
           name: 'speed',
           chart: function chart(item) {
-            return item.speed + " " + speed.label;
+            return L._('v: ') + item.speed + " " + speed.label;
           },
           marker: function marker(item) {
             return Math.round(item.speed) + " " + speed.label;
@@ -3962,7 +3989,7 @@
       this._registerFocusLabel({
         name: 'acceleration',
         chart: function chart(item) {
-          return item.acceleration + " " + acceleration.label;
+          return L._("a: ") + item.acceleration + " " + acceleration.label;
         },
         marker: function marker(item) {
           return Math.round(item.acceleration) + " " + acceleration.label;
@@ -4029,6 +4056,19 @@
     Elevation.Utils = _;
     Elevation.Components = D3;
     Elevation.Chart = Chart$1;
+    /* Temporary fix for empty values evaluated as false (leaflet-i18n v0.3.1) */
+
+    (function () {
+      var proto = L.i18n.bind({});
+
+      L.i18n = L._ = function (string, data) {
+        if (L.locale && L.locales[L.locale] && L.locales[L.locale][string] == "") {
+          L.locales[L.locale][string] = "\u200B";
+        }
+
+        return proto.call(null, string, data);
+      };
+    })();
 
     L.control.elevation = function (options) {
       return new Elevation(options);