Merge pull request #110 from developmentseed/feature/current-trace-layer

show gps track while recording
developmentseed · Oct 22, 2019 · 00e5091 · 00e5091
2 parents d70880e + b618a32
commit 00e5091
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 4 deletions.
diff --git a/app/components/RecordHeader.js b/app/components/RecordHeader.js
@@ -14,7 +14,7 @@ const headerStyles = getPlatformStyles({
     height: 100
   },
   android: {
-    height: 64,
+    height: 80,
     paddingTop: 0
   }
 })

diff --git a/app/screens/Explore.js b/app/screens/Explore.js
@@ -330,7 +330,8 @@ class Explore extends React.Component {
       selectedFeatures,
       editsGeojson,
       mode,
-      currentTraceStatus
+      currentTraceStatus,
+      currentTrace
     } = this.props
     let selectedFeatureIds = null
 
@@ -561,6 +562,9 @@ class Explore extends React.Component {
               <MapboxGL.LineLayer id='editedLines' filter={filters.editedLines} style={style.editedLines} minZoomLevel={16} />
               <MapboxGL.SymbolLayer id='editedPois' style={style.icons} filter={filters.editedPois} />
             </MapboxGL.ShapeSource>
+            <MapboxGL.ShapeSource id='currentTraceGeojsonSource' shape={currentTrace}>
+              <MapboxGL.LineLayer id='trace' style={style.traces} minZoomLevel={16} />
+            </MapboxGL.ShapeSource>
           </StyledMap>
           { overlay }
           {/* should hide this entire element when not in loading state */}

diff --git a/app/selectors/index.js b/app/selectors/index.js
@@ -154,7 +154,19 @@ export const getPendingEviction = state => state.map.pendingEviction
 
 export const getIsTracing = state => !!state.traces.currentTrace
 
-export const getCurrentTraceGeoJSON = state => state.currentTrace
+export const getCurrentTraceGeoJSON = state => {
+  if (state.traces.currentTrace && state.traces.currentTrace.geometry.coordinates.length > 2) {
+    return {
+      'type': 'FeatureCollection',
+      'features': [ state.traces.currentTrace ]
+    }
+  } else {
+    return {
+      'type': 'FeatureCollection',
+      'features': []
+    }
+  }
+}
 
 export const getCurrentTraceLength = state => {
   const currentTrace = state.traces.currentTrace

diff --git a/app/style/map.js b/app/style/map.js
@@ -37,6 +37,16 @@ const editedLines = {
   lineColor: 'blue'
 }
 
+const traces = {
+  lineWidth: [
+    'interpolate', ['linear'],
+    ['zoom'],
+    16, 1,
+    20, 3
+  ],
+  lineColor: 'red'
+}
+
 const highways = {
   lineWidth: standardLineWidth,
   lineColor: [
@@ -170,5 +180,6 @@ export default {
   icons,
   iconEditedHalo,
   editedPolygons,
-  editedLines
+  editedLines,
+  traces
 }