diff --git a/index.html b/index.html index db3e6fa..db3b2a2 100644 --- a/index.html +++ b/index.html @@ -73,8 +73,8 @@
Click anywhere on the map to calculate where it is possible to freewheel from that point. A set of possible - end points will then appear on the map. The farthest possible end point is shown in red, while other possible - end points are shown in violet. Click an endpoint to see the calculated route that leads from the start point + end points will then appear on the map. The farthest possible end point is shown with a red marker, while other possible + end points are shown as purple circles. Click an endpoint to see the calculated route that leads from the start point to the end point.
diff --git a/src/modules/maphandler/maphandler.ts b/src/modules/maphandler/maphandler.ts index d28461e..91fbb27 100644 --- a/src/modules/maphandler/maphandler.ts +++ b/src/modules/maphandler/maphandler.ts @@ -76,11 +76,11 @@ class MapHandler { L.PM.reInitLayer(e.layer); if (this.onChangeFunction != null) { - e.layer.on('pm:edit', this.onChangeFunction); - e.layer.on('pm:drag', this.onChangeFunction); - e.layer.on('pm:cut', this.onChangeFunction); - e.layer.on('pm:remove', this.onChangeFunction); - e.layer.on('pm:rotate', this.onChangeFunction); + e.layer.on('pm:edit', this.onChangeFunction.bind(this)); + e.layer.on('pm:drag', this.onChangeFunction.bind(this)); + e.layer.on('pm:cut', this.onChangeFunction.bind(this)); + e.layer.on('pm:remove', this.onChangeFunction.bind(this)); + e.layer.on('pm:rotate', this.onChangeFunction.bind(this)); this.onChangeFunction(); }; }) @@ -166,15 +166,6 @@ class MapHandler { }); } }); - - this.exclusionAreaFeatureGroup.addEventListener('pm:change', _ => { - let polygons: Polygon[] = []; - this.exclusionAreaFeatureGroup.eachLayer(layer => { - if (layer instanceof Polygon) { - polygons.push(layer); - } - }); - }); } public getCurrentStartPointId(): number { @@ -277,18 +268,16 @@ class MapHandler { var firstMarker = true; endpoints.forEach(endpoint => { var settings; + var marker; if (firstMarker) { + marker = L.marker([endpoint.latitude, endpoint.longitude], {icon: redIcon}).addTo(this.endMarkers); settings = { icon: redIcon }; } else { - settings = { - icon: violetIcon, - opacity: 0.7 - }; + marker = L.circleMarker([endpoint.latitude, endpoint.longitude], {radius: 2, fillOpacity: 1.0, color: 'purple', bubblingMouseEvents: false}).addTo(this.endMarkers); } - var marker = L.marker([endpoint.latitude, endpoint.longitude], settings).addTo(this.endMarkers); marker.bindTooltip(Math.round(endpoint.distanceFromStart) + 'm'); if (firstMarker) { marker.openTooltip();