Browse Source

mapbox: added path buttons

Bernadette Elena Hammerle 4 years ago
parent
commit
d32ba5c69e
1 changed files with 11 additions and 1 deletions
  1. 11 1
      src/maps/Mapbox.js

+ 11 - 1
src/maps/Mapbox.js

@@ -11,6 +11,7 @@ import {calcDistance} from "./../helpers/distance";
 import {longitude, latitude, mapWidth, mapHeight} from "./../config/variables";
 import {Button} from "reactstrap";
 import {getRoute} from "./../helpers/mapboxHelper";
+import PathButtons from "./../PathButtons";
 
 const Map = ReactMapboxGl({ accessToken: mapboxToken });
 
@@ -25,14 +26,22 @@ export default class Mapbox extends React.Component{
       distance: 0,
       center: [longitude, latitude]
     }
-
     this.getRoute = getRoute.bind(this)
   }
 
+  updateState = (key, value) => {
+    this.setState({[key]: value})
+    this.getDistance()
+  }
+
   addMarker = (event, click) => {
     const lng = click.lngLat.lng
     const lat = click.lngLat.lat
     this.getRoute(lng, lat);
+//    let pathCopy = this.state.path.slice();
+//    pathCopy.push([lng, lat]);
+//    this.setState({path: pathCopy})
+    this.getDistance()
   }
 
   updateMarker = (idx, event) => {
@@ -87,6 +96,7 @@ export default class Mapbox extends React.Component{
           <p>
             Distanz: {Math.round(this.state.distance*100)/100} km
           </p>
+          <PathButtons updateState={this.updateState} path={this.state.path}/>
         </div>
       </div>
     );