@raruto/leaflet-elevation 1.8.5 → 1.8.8

package/README.md

@@ -23,6 +23,7 @@ _For a working example see one of the following demos:_
 
 <br/>
 
+- [custom chart](https://raruto.github.io/leaflet-elevation/examples/leaflet-elevation_extended-ui.html)
 - [custom colors](https://raruto.github.io/leaflet-elevation/examples/leaflet-elevation_custom-theme.html)
 - [custom summary](https://raruto.github.io/leaflet-elevation/examples/leaflet-elevation_custom-summary.html)
 - [close button](https://raruto.github.io/leaflet-elevation/examples/leaflet-elevation_close-button.html)
@@ -48,7 +49,6 @@ _For a working example see one of the following demos:_
 - [almost over](https://raruto.github.io/leaflet-elevation/examples/leaflet-elevation_almost-over.html)
 - [follow marker](https://raruto.github.io/leaflet-elevation/examples/leaflet-elevation_follow-marker.html)
 - [dynamic runner](https://raruto.github.io/leaflet-elevation/examples/leaflet-elevation_dynamic-runner.html)
-- [extended ui](https://raruto.github.io/leaflet-elevation/examples/leaflet-elevation_extended-ui.html)
 
 ---
 
@@ -258,7 +258,7 @@ _Related: [Leaflet-UI presets](https://github.com/raruto/leaflet-ui), [QGIS Inte
 **Compatibile with:**
 [![Leaflet 1.x compatible!](https://img.shields.io/badge/Leaflet-1.6.0-1EB300.svg?style=flat)](http://leafletjs.com/reference.html)
 [![d3.js v6 compatibile!](https://img.shields.io/badge/d3.js-6.5-1EB300.svg?style=flat)](https://www.npmjs.com/package/d3)
-[![@tmcw/togeojson v4.3.0 compatibile!](https://img.shields.io/badge/@tmcw/togeojson-4.3-1EB300.svg?style=flat)](https://www.npmjs.com/package/@tmcw/togeojson)
+[![@tmcw/togeojson v4.5.0 compatibile!](https://img.shields.io/badge/@tmcw/togeojson-4.5-1EB300.svg?style=flat)](https://www.npmjs.com/package/@tmcw/togeojson)
 
 
 ---

package/dist/leaflet-elevation.js

@@ -675,8 +675,8 @@
       var panes = {
         grid: g.append("g").attr("class", "grid"),
         area: g.append('g').attr("class", "area"),
-        point: g.append('g').attr("class", "point"),
         axis: g.append('g').attr("class", "axis"),
+        point: g.append('g').attr("class", "point"),
         brush: g.append("g").attr("class", "brush"),
         tooltip: g.append("g").attr("class", "tooltip").attr('display', 'none'),
         ruler: g.append('g').attr('class', 'ruler'),
@@ -1790,10 +1790,10 @@
       __mileFactor: 0.621371,
       __footFactor: 3.28084,
       __D3: 'https://unpkg.com/d3@6.5.0/dist/d3.min.js',
-      __TOGEOJSON: 'https://unpkg.com/@tmcw/togeojson@4.3.0/dist/togeojson.umd.js',
+      __TOGEOJSON: 'https://unpkg.com/@tmcw/togeojson@4.5.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.8.5/libs/leaflet-distance-marker.min.js',
+      __LDISTANCEM: 'https://unpkg.com/@raruto/leaflet-elevation@1.8.8/libs/leaflet-distance-marker.min.js',
 
       /*
        * Add data to the diagram either from GPX or GeoJSON and update the axis domain and data
@@ -2110,6 +2110,10 @@
         if (!d) {
           return;
         }
+        /**
+         * Standard GeoJSON --> doesn't handle "time", "heart", …
+         */
+
 
         var geom = d.geometry;
 
@@ -2137,47 +2141,47 @@
             return _this5._addData(feature);
           });
         }
+        /**
+         * Extended GeoJSON --> rely on leaflet implementation
+         */
+
 
         if (d._latlngs) {
-          this._addGPXData(d._latlngs);
+          this._addGeoJSONData(d._latlngs, d.feature && d.feature.properties);
         }
       },
 
       /*
        * Parsing of GeoJSON data lines and their elevation in z-coordinate
        */
-      _addGeoJSONData: function _addGeoJSONData(coords) {
+      _addGeoJSONData: function _addGeoJSONData(coords, properties) {
         var _this6 = this;
 
-        each(coords, function (point) {
-          _this6._addPoint(point[1], point[0], point[2]);
+        coords.forEach(function (point, i) {
+          var _point$meta, _point$lat, _point$lng, _ref, _point$alt;
 
-          _this6._fireEvt("elepoint_added", {
-            point: point,
-            index: _this6._data.length - 1
-          });
-        });
+          // Inspired by L.GPX layer properties
+          point.meta = (_point$meta = point.meta) !== null && _point$meta !== void 0 ? _point$meta : {
+            time: null,
+            ele: null,
+            hr: null,
+            cad: null,
+            atemp: null
+          }; // "alt" property is generated inside "leaflet"
 
-        this._fireEvt("eletrack_added", {
-          coords: coords,
-          index: this._data.length - 1
-        });
-      },
-
-      /*
-       * Parsing function for GPX data and their elevation in z-coordinate
-       */
-      _addGPXData: function _addGPXData(coords) {
-        var _this7 = this;
+          if ("alt" in point) point.meta.ele = point.alt; // "coordinateProperties" property is generated inside "@tmcw/toGeoJSON"
 
-        each(coords, function (point) {
-          var _point$alt;
+          if (properties.coordinateProperties) {
+            var props = properties.coordinateProperties;
+            if ("times" in props) point.meta.time = new Date(Date.parse(props.times[i]));
+            if ("heart" in props) point.meta.hr = parseInt(props.heart[i]); // TODO: ask to "@tmcw/toGeoJSON" for "cadence" and "temperature" implementation
+          }
 
-          _this7._addPoint(point.lat, point.lng, (_point$alt = point.alt) !== null && _point$alt !== void 0 ? _point$alt : point.meta.ele);
+          _this6._addPoint((_point$lat = point.lat) !== null && _point$lat !== void 0 ? _point$lat : point[1], (_point$lng = point.lng) !== null && _point$lng !== void 0 ? _point$lng : point[0], (_ref = (_point$alt = point.alt) !== null && _point$alt !== void 0 ? _point$alt : point.meta.ele) !== null && _ref !== void 0 ? _ref : point[2]);
 
-          _this7._fireEvt("elepoint_added", {
+          _this6._fireEvt("elepoint_added", {
             point: point,
-            index: _this7._data.length - 1
+            index: _this6._data.length - 1
           });
         });
 
@@ -2192,9 +2196,9 @@
        */
       _addPoint: function _addPoint(x, y, z) {
         if (this.options.reverseCoords) {
-          var _ref = [y, x];
-          x = _ref[0];
-          y = _ref[1];
+          var _ref2 = [y, x];
+          x = _ref2[0];
+          y = _ref2[1];
         }
 
         this._data.push({
@@ -2237,35 +2241,43 @@
           }
         }
       },
+
+      /**
+       * Initialize "L.AlmostOver" integration
+       */
       _initAlmostOverHandler: function _initAlmostOverHandler(map, layer) {
-        var _this8 = this;
+        var _this7 = this;
 
         if (!map || !this.options.almostOver) return;
         this.lazyLoad(this.__LGEOMUTIL).then(function () {
-          return _this8.lazyLoad(_this8.__LALMOSTOVER);
+          return _this7.lazyLoad(_this7.__LALMOSTOVER);
         }).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 _this8._mousemoveLayerHandler(e);
+              return _this7._mousemoveLayerHandler(e);
             }).on('almost:out', function (e) {
-              return _this8._mouseoutHandler(e);
+              return _this7._mouseoutHandler(e);
             });
           }
         });
       },
+
+      /**
+       * Initialize "L.DistanceMarkers" integration
+       */
       _initDistanceMarkers: function _initDistanceMarkers(map, layer) {
-        var _this9 = this;
+        var _this8 = this;
 
         if (!map) return;
 
         if (this.options.distanceMarkers) {
           this.lazyLoad(this.__LGEOMUTIL).then(function () {
-            return _this9.lazyLoad(_this9.__LDISTANCEM);
+            return _this8.lazyLoad(_this8.__LDISTANCEM);
           }).then(function () {
-            return _this9.options.polyline && layer.addTo(map);
+            return _this8.options.polyline && layer.addTo(map);
           });
         } else if (this.options.polyline) {
           layer.addTo(map);
@@ -2292,6 +2304,29 @@
         return this.eleDiv = eleDiv;
       },
 
+      /**
+       * Initialize "L.AlmostOver" and "L.DistanceMarkers"
+       */
+      _initMapIntegrations: function _initMapIntegrations(control, layer) {
+        var map = control._map;
+
+        if (control._map) {
+          map.once('layeradd', function (e) {
+            return control.options.autofitBounds && control.fitBounds(layer.getBounds());
+          });
+
+          if (!L.Browser.mobile) {
+            control._initAlmostOverHandler(map, layer);
+
+            control._initDistanceMarkers(map, layer);
+          } else if (control.options.polyline) {
+            layer.addTo(map);
+          }
+        } else {
+          console.warn("Undefined elevation map object");
+        }
+      },
+
       /*
        * Collapse current chart control.
        */
@@ -2343,17 +2378,17 @@
        * @link https://github.com/Raruto/leaflet-elevation/issues/81#issuecomment-713477050
        */
       _fixTooltipSize: function _fixTooltipSize() {
-        var _this10 = this;
+        var _this9 = this;
 
         this.on('elechart_init', function () {
-          return _this10.once('elechart_change elechart_hover', function (e) {
-            if (_this10._chartEnabled) {
-              _this10._chart._showDiagramIndicator(e.data, e.xCoord);
+          return _this9.once('elechart_change elechart_hover', function (e) {
+            if (_this9._chartEnabled) {
+              _this9._chart._showDiagramIndicator(e.data, e.xCoord);
 
-              _this10._chart._showDiagramIndicator(e.data, e.xCoord);
+              _this9._chart._showDiagramIndicator(e.data, e.xCoord);
             }
 
-            _this10._updateMarker(e.data);
+            _this9._updateMarker(e.data);
           });
         });
       },
@@ -2434,17 +2469,17 @@
         this._fireEvt("elechart_init");
       },
       _initLayer: function _initLayer() {
-        var _this11 = this;
+        var _this10 = this;
 
         this._layers.on('layeradd layerremove', function (e) {
           var layer = e.layer;
           var node = layer.getElement && layer.getElement();
 
-          toggleClass(node, _this11.options.polyline.className + ' ' + _this11.options.theme, e.type == 'layeradd');
+          toggleClass(node, _this10.options.polyline.className + ' ' + _this10.options.theme, e.type == 'layeradd');
 
-          toggleEvent(layer, "mousemove", _this11._mousemoveLayerHandler.bind(_this11), e.type == 'layeradd');
+          toggleEvent(layer, "mousemove", _this10._mousemoveLayerHandler.bind(_this10), e.type == 'layeradd');
 
-          toggleEvent(layer, "mouseout", _this11._mouseoutHandler.bind(_this11), e.type == 'layeradd');
+          toggleEvent(layer, "mouseout", _this10._mouseoutHandler.bind(_this10), e.type == 'layeradd');
         });
       },
       _initMarker: function _initMarker(map) {
@@ -2516,14 +2551,16 @@
        * Retrieve data from a remote url (HTTP).
        */
       _loadFile: function _loadFile(url) {
-        var _this12 = this;
+        var _this11 = this;
 
         fetch(url).then(function (response) {
           return response.text();
         }).then(function (data) {
-          _this12._downloadURL = url; // TODO: handle multiple urls?
+          _this11._downloadURL = url; // TODO: handle multiple urls?
 
-          _this12.load(data);
+          _this11._parseFromString(data).then(function (geojson) {
+            return geojson && _this11._loadLayer(geojson);
+          });
         }).catch(function (err) {
           return console.warn(err);
         });
@@ -2594,53 +2631,16 @@
             }
           },
           onEachFeature: function onEachFeature(feature, layer) {
-            if (feature.geometry && feature.geometry.type == 'Point') return; // Standard GeoJSON --> doesn't handle "time"
-            // control.addData(feature, layer);  // NB make use of "_addGeoJSONData"
-            // Extended GeoJSON --> rely on leaflet implementation
-
-            layer._latlngs.forEach(function (point, i) {
-              // same properties as L.GPX layer
-              point.meta = {
-                time: null,
-                ele: null,
-                hr: null,
-                cad: null,
-                atemp: null
-              };
-              if ("alt" in point) point.meta.ele = point.alt;
-
-              if (feature.properties) {
-                var prop = feature.properties;
-                if ("coordTimes" in prop) point.meta.time = new Date(Date.parse(prop.coordTimes[i]));else if ("times" in prop) point.meta.time = new Date(Date.parse(prop.times[i]));else if ("time" in prop) point.meta.time = new Date(Date.parse(_typeof(prop.time) === 'object' ? prop.time[i] : prop.time));
-                if ("heartRates" in prop) point.meta.hr = parseInt(prop.heartRates[i]);else if ("heartRate" in prop) point.meta.hr = parseInt(_typeof(prop.heartRate) === 'object' ? prop.heartRate[i] : prop.heartRate); // TODO: cadence, temperature
-              }
-            });
-
-            control.addData(layer); // NB make use of "_addGPXData"
-
-            control.track_info = L.extend({}, control.track_info, {
-              name: geojson.name
-            });
+            if (feature.geometry && feature.geometry.type != 'Point') {
+              control.addData(layer);
+              control.track_info = L.extend({}, control.track_info, {
+                name: geojson.name
+              });
+            }
           }
         });
         control.lazyLoad(control.__D3).then(function () {
-          var map = control._map;
-
-          if (map) {
-            map.once('layeradd', function (e) {
-              return control.options.autofitBounds && control.fitBounds(layer.getBounds());
-            });
-
-            if (!L.Browser.mobile) {
-              control._initAlmostOverHandler(map, layer);
-
-              control._initDistanceMarkers(map, layer);
-            } else if (control.options.polyline) {
-              layer.addTo(map);
-            }
-          } else {
-            console.warn("Undefined elevation map object");
-          }
+          control._initMapIntegrations(control, layer);
 
           control._fireEvt("eledata_loaded", {
             data: geojson,
@@ -2746,21 +2746,21 @@
        * Attempt to parse raw response data (GeoJSON or XML > GeoJSON)
        */
       _parseFromString: function _parseFromString(data) {
-        var _this13 = this;
+        var _this12 = this;
 
         return new Promise(function (resolve) {
-          return _this13.lazyLoad(_this13.__TOGEOJSON).then(function () {
+          return _this12.lazyLoad(_this12.__TOGEOJSON).then(function () {
             var geojson;
 
             try {
-              geojson = _this13._parseFromXMLString(data.trim());
+              geojson = _this12._parseFromXMLString(data.trim());
             } catch (e) {
-              geojson = _this13._parseFromGeoJSONString(data.toString());
+              geojson = _this12._parseFromGeoJSONString(data.toString());
             }
 
             if (geojson) {
-              geojson = _this13._prepareMultiLineStrings(geojson);
-              geojson = _this13._prepareAdditionalProperties(geojson);
+              geojson = _this12._prepareMultiLineStrings(geojson);
+              geojson = _this12._prepareAdditionalProperties(geojson);
             }
 
             resolve(geojson);
@@ -2772,6 +2772,8 @@
        * Simple XML Parser (GPX, KML, TCX)
        */
       _parseFromXMLString: function _parseFromXMLString(data) {
+        var _Array$from$find;
+
         if (data.indexOf("<") != 0) {
           throw 'Invalid XML';
         }
@@ -2790,9 +2792,9 @@
         }
 
         var geojson = toGeoJSON[type](xml);
-        geojson.name = name.length > 0 ? Array.from(name).find(function (tag) {
+        geojson.name = name.length > 0 ? ((_Array$from$find = Array.from(name).find(function (tag) {
           return tag.parentElement.tagName == "trk";
-        }).textContent : '';
+        })) !== null && _Array$from$find !== void 0 ? _Array$from$find : name[0]).textContent : '';
         return geojson;
       },
 
@@ -2837,10 +2839,10 @@
        * Add a point of interest over the diagram
        */
       _registerCheckPoint: function _registerCheckPoint(props) {
-        var _this14 = this;
+        var _this13 = this;
 
         this.on("elechart_updated", function () {
-          return _this14._chart._registerCheckPoint(props);
+          return _this13._chart._registerCheckPoint(props);
         });
       },
 
@@ -2848,10 +2850,10 @@
        * Add chart profile to diagram
        */
       _registerAreaPath: function _registerAreaPath(props) {
-        var _this15 = this;
+        var _this14 = this;
 
         this.on("elechart_init", function () {
-          return _this15._chart._registerAreaPath(props);
+          return _this14._chart._registerAreaPath(props);
         });
       },
 
@@ -2859,10 +2861,10 @@
        * Add chart grid to diagram
        */
       _registerAxisGrid: function _registerAxisGrid(props) {
-        var _this16 = this;
+        var _this15 = this;
 
         this.on("elechart_axis", function () {
-          return _this16._chart._registerAxisGrid(props);
+          return _this15._chart._registerAxisGrid(props);
         });
       },
 
@@ -2870,10 +2872,10 @@
        * Add chart axis to diagram
        */
       _registerAxisScale: function _registerAxisScale(props) {
-        var _this17 = this;
+        var _this16 = this;
 
         this.on("elechart_axis", function () {
-          return _this17._chart._registerAxisScale(props);
+          return _this16._chart._registerAxisScale(props);
         });
       },
 
@@ -2881,14 +2883,14 @@
        * Add chart or marker tooltip info
        */
       _registerTooltip: function _registerTooltip(props) {
-        var _this18 = this;
+        var _this17 = this;
 
         if (props.chart) {
           var label = L.extend({}, props, {
             value: props.chart
           });
           this.on("elechart_init", function () {
-            return _this18._chart._registerTooltip(label);
+            return _this17._chart._registerTooltip(label);
           });
         }
 
@@ -2898,7 +2900,7 @@
           });
 
           this.on("elechart_marker", function () {
-            return _this18._marker._registerTooltip(_label);
+            return _this17._marker._registerTooltip(_label);
           });
         }
       },
@@ -2907,10 +2909,10 @@
        * Add summary info to diagram
        */
       _registerSummary: function _registerSummary(props) {
-        var _this19 = this;
+        var _this18 = this;
 
         this.on('elechart_summary', function () {
-          return _this19._summary._registerSummary(props);
+          return _this18._summary._registerSummary(props);
         });
       },
 
@@ -3015,17 +3017,14 @@
        * Toggle chart data on legend click
        */
       _toggleChartHandler: function _toggleChartHandler(e) {
-        var _this20 = this;
+        var _this19 = this;
 
-        var path = e.path,
-            name = e.name,
+        var name = e.name,
             enabled = e.enabled;
         this._chartEnabled = this._chart._hasActiveLayers(); // toggle layer visibility on empty chart
 
         this._layers.eachLayer(function (layer) {
-          var node = layer.getElement && layer.getElement();
-
-          toggleClass(node, _this20.options.polyline.className + ' ' + _this20.options.theme, _this20._chartEnabled);
+          return toggleClass(layer.getElement && layer.getElement(), _this19.options.polyline.className + ' ' + _this19.options.theme, _this19._chartEnabled);
         }); // toggle option value (eg. altitude = { 'disabled' || 'disabled' })
 
 
@@ -3099,7 +3098,7 @@
        * Update chart summary.
        */
       _updateSummary: function _updateSummary() {
-        var _this21 = this;
+        var _this20 = this;
 
         this._summary.reset();
 
@@ -3122,9 +3121,9 @@
               e.confirm();
             }
 
-            _this21._fireEvt('eletrack_download', {
-              downloadLink: _this21.options.downloadLink,
-              confirm: saveFile.bind(_this21, _this21._downloadURL)
+            _this20._fireEvt('eletrack_download', {
+              downloadLink: _this20.options.downloadLink,
+              confirm: saveFile.bind(_this20, _this20._downloadURL)
             });
           };
         }
@@ -3847,6 +3846,8 @@
       this.loadGeoJSON = this.load;
       this.loadXML = this.load;
       this.loadFile = this.load;
+      this._addGPXData = this._addGeoJSONData;
+      this._registerFocusLabel = this._registerTooltip;
     });
 
     L.control.elevation = function (options) {