Reanbling background geolocation.

src/components/gpx-overlay.tsx

@@ -43,7 +43,7 @@ const GPXOverlay: React.FC<{
           >
           <polyline
             points={trkToPolyline(props.track)}
-            stroke="black" stroke-width="3" fill="none"
+            stroke="black" strokeWidth="3" fill="none"
           ></polyline>
         </svg>
       )}

src/components/live-map.tsx

@@ -38,7 +38,6 @@ const LiveMap: react.FC = () => {
 
   let [track, setTrack] = useState(emptyTrack);
 
-  /*
   useEffect(() => {
     console.log('com.dyomedea.dyomedea  LOG', ' - Adding the watcher');
     BackgroundGeolocation.addWatcher(
@@ -99,10 +98,9 @@ const LiveMap: react.FC = () => {
         if (location !== undefined) {
           setCenter([location.latitude, location.longitude]);
           setPosition([location.latitude, location.longitude]);
-          track.geometry.coordinates.push([
-            location.longitude,
-            location.latitude,
-          ]);
+          track.trkseg[0].trkpt.push({
+            $: { lat: location.latitude, lon: location.longitude },
+          });
           setTrack(track);
         }
 
@@ -126,7 +124,6 @@ const LiveMap: react.FC = () => {
       });
   }, [track]);
 
-  */
   return (
     <Map
       center={center}
@@ -138,7 +135,7 @@ const LiveMap: react.FC = () => {
       animate={true}
     >
       <ZoomControl />
-      <Marker width={20} anchor={center} />
+      <Marker width={20} anchor={position} />
       <GPXOverlay
         mapState={undefined}
         latLngToPixel={undefined}