added waterways

README.md

@@ -10,7 +10,7 @@ Say, you'd like to know when most of a specific feature type (e.g. buildings) in
 Features
 --------
 
-* supported feature types: *buildings* (any closed osm way with a building tag), *roads* (any osm way with a highway tag)
+* supported feature types: *buildings* (any closed osm way with a building tag), *roads* (any osm way with a highway tag), *rivers* (any osm way with a waterway tag)
 * graphs of feature *recency* or *mapper experience*
 * highlighting of features by custom date range or user experience interval
 * calculated statistics: total number/length of features in selected region and date/experience range, number of contributors

app/components/CompareBar/index.js

@@ -31,11 +31,11 @@ class CompareBar extends Component {
           return (<li key={filter} title={filterOptions.find(f => f.id === filter).altText}>
             <span className="number">{
               numberWithCommas(
-                (filter === 'highways' ? unitSystems[this.props.stats.unitSystem].distance.convert : x=>x)(
+                (filter === 'highways' || filter === 'waterways' ? unitSystems[this.props.stats.unitSystem].distance.convert : x=>x)(
                   (this.state.featureCounts[filter].find(counts => counts && counts.id === this.props.map.times[0]) || {}).value
               ))
             }</span><br/>
-            {filter === 'highways'
+            {filter === 'highways' || filter === 'waterways'
             ? <UnitSelector
                 unitSystem={this.props.stats.unitSystem}
                 unit='distance'
@@ -52,11 +52,11 @@ class CompareBar extends Component {
           return (<li key={filter} title={filterOptions.find(f => f.id === filter).altText}>
             <span className="number">{
               numberWithCommas(
-                (filter === 'highways' ? unitSystems[this.props.stats.unitSystem].distance.convert : x=>x)(
+                (filter === 'highways' || filter === 'waterways' ? unitSystems[this.props.stats.unitSystem].distance.convert : x=>x)(
                   (this.state.featureCounts[filter].find(counts => counts && counts.id === this.props.map.times[1]) || {}).value
               ))
             }</span><br/>
-            {filter === 'highways'
+            {filter === 'highways' || filter === 'waterways'
             ? <UnitSelector
                 unitSystem={this.props.stats.unitSystem}
                 unit='distance'
@@ -110,7 +110,7 @@ class CompareBar extends Component {
               featureCounts[filter][timeIdx] = {
                 id: timeOption.id,
                 day: +timeOption.timestamp,
-                value: filter === 'highways'
+                value: filter === 'highways' || filter === 'waterways'
                   ? data.features.reduce((prev, feature) => prev + (feature.properties._length || 0.0), 0.0)
                   : data.features.reduce((prev, feature) => prev + (feature.properties._count || 1), 0)
               }

app/components/Legend/style.css

@@ -73,6 +73,29 @@
         }
       }
 
+      &.waterways {
+        background-color: #c89ab7;
+        border-color: #c89ab7;
+
+        &.feature {
+          background-color: transparent;
+          border-style: solid;
+          border-width: 2px;
+          border-top-width: 0;
+          border-left-width: 0;
+          transform: translateX(-2px) rotate(-20deg);
+        }
+        &.high {
+          opacity: 1.0;
+        }
+        &.mid {
+          opacity: 0.55;
+        }
+        &.low {
+          opacity: 0.1;
+        }
+      }
+
       &.pois {
         background-color: #FF0000;
 

app/components/Map/glstyles/index.js

@@ -1,5 +1,6 @@
 import buildings from './buildings.json'
 import highways from './highways.json'
+import waterways from './waterways.json'
 import pois from './pois.json'
 
 import settings from '../../../settings/settings'
@@ -13,6 +14,7 @@ export default function getStyle(filters, options) {
   const filterStyles = {
     buildings,
     highways,
+    waterways,
     pois
   }
   var allSources = {}
@@ -56,7 +58,8 @@ export default function getStyle(filters, options) {
       })
   }
   buildings,
-  highways
+  highways,
+  waterways
 }
 
 export function getCompareStyles(filters, compareTimes) {