move jku marker to path for distance calculation

src/App.js

@@ -27,7 +27,7 @@ export class App extends React.Component{
     this.state = {
       mapConfig: {
         zoom: 15,
-        path: [],
+        path: [[latitude, longitude]],
         coords: [latitude, longitude],
         defaultZoom: 15,
         distance: 0,

src/Leaflet.js

@@ -9,14 +9,14 @@ import {
 } from "react-leaflet";
 import "./css/maps.css";
 import {calcDistance} from "./helpers/distance";
-import {longitude, latitude, mapWidth, mapHeight} from "./config/variables";
+import {longitude, latitude, mapWidth, mapHeight, testPath} from "./config/variables";
 
 export default class Leaflet extends React.Component{
   state = {
     latitude: latitude,
     longitude: longitude,
     zoom: 15,
-    path: [[48.295742, 14.286967], [48.328529, 14.322428]],
+    path: testPath,
     distance: 0
     }
 
@@ -63,12 +63,6 @@ export default class Leaflet extends React.Component{
               url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
             />
             <ZoomControl position="bottomright" />
-  
-            <Marker position={position} onClick={this.newPathPoint}>
-              <Popup>
-                JKU: Ente
-              </Popup>
-            </Marker>
 
             {this.state.path.map((pos, idx) =>
               <Marker

src/MapGL.js

@@ -23,7 +23,8 @@ export default class MapGL extends React.Component{
       bearing: 0,
       pitch: 0
     },
-    path: []
+    path: [[latitude, longitude]],
+    distance: 0,
   };
   
   addMarker = event => {
@@ -83,19 +84,6 @@ export default class MapGL extends React.Component{
           </Marker>
         )}
 
-          <Marker
-            longitude={longitude}
-            latitude={latitude}
-            captureClick={false}
-            draggable={false}
-            offsetTop={-20}
-            offsetLeft={-8}
-          >
-            <svg height={20} viewBox="0 0 24 24" style={{fill: "#343a40", stroke: "none"}}>
-              <path d={markerIcon} />
-            </svg>
-          </Marker>
-
           <div className="controllers">
             <GeolocateControl />
             <FullscreenControl />

src/Pigeon.js

@@ -57,8 +57,6 @@ export default class Pigeon extends React.Component{
           dprs={[1, 2]}
           onClick={(event) => this.addMarker(event)}
         >
-           <Marker anchor={[latitude, longitude]} payload={1} onClick={({ event, anchor, payload }) => {}} />
-
             {mapConfig.path.map((pos, idx) =>
               <Marker anchor={pos} key={idx}/>
             )}

src/config/variables.js

@@ -1,6 +1,8 @@
 export const latitude = 48.336950;
 export const longitude = 14.320570;
-export const testPath = [[48.295742, 14.286967], [48.328529, 14.322428]];
+export const testPath = [[latitude, longitude],
+                         [48.328529, 14.322428],
+                         [48.295742, 14.286967]];
 
 export const mapWidth = 600;
 export const mapHeight = 400;