feat: add green and noise extra info

close #162
GIScience · Jul 8, 2021 · 61aff08 · 61aff08
1 parent 04d0a8e
commit 61aff08
Show file tree

Hide file tree

Showing 29 changed files with 268 additions and 240 deletions.
diff --git a/src/config-examples/default-map-settings-example.js b/src/config-examples/default-map-settings-example.js
@@ -39,17 +39,16 @@ const defaultMapSettings = {
 
   steepness: true,
   surface: true,
-  waytype: true,
-
+  waytype: true,  
   tollways: false,  
   waycategory: false,
   traildifficulty: false, 
   roadaccessrestrictions: false,
-
-  // Extra settings not being used yet
-  suitability: false,
   green: false,
   noise: false,
+
+  // Extra settings not being used yet
+  suitability: false
 }
 
 export default defaultMapSettings
diff --git a/src/config-examples/ors-map-filters-example.js b/src/config-examples/ors-map-filters-example.js
@@ -37,7 +37,9 @@ const filters = [
         slug: 'foot-walking',
         icon: 'directions_walk',
         nestedProfiles: ['foot-walking', 'foot-hiking'],
-        supportsTrailDifficulty: true
+        supportsTrailDifficulty: true,
+        supportsGreen: true,
+        supportsNoise: true
       },
       'driving-car': {
         slug: 'driving-car',

diff --git a/...omponents/place-and-directions/components/route-details/components/extras/RouteExtras.vue b/...omponents/place-and-directions/components/route-details/components/extras/RouteExtras.vue
@@ -9,11 +9,11 @@
           <v-flex xs10 sm11>
             <v-list>
               <div style="padding:0 0 0 10px">
-                <h5 >{{$t('routeExtras.' + extraKey )}}</h5>
+                <h5 >{{$t('global.' + extraKey )}}</h5>
                 <div class="extra-bar">
                   <template v-for="(summary, index) in routeExtras[extraKey].summary">
                     <v-tooltip :key="index + extraKey" :disabled="$lowResolution" top>
-                      <div @click="showSection(extraKey, summary.value, index)" slot="activator" class="segment" :style="segmentStyle(extraKey, summary.amount, index)"></div>
+                      <div @click="showSection(extraKey, summary.value, index)" slot="activator" class="segment" :style="segmentStyle(extraKey, summary, index)"></div>
                       {{getExtraValueLabel(extraKey, summary.value)}} - {{$t('routeExtras.clickToHighlightOnMap')}}
                     </v-tooltip>
                   </template>

diff --git a/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.de-de.js b/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.de-de.js
@@ -5,19 +5,6 @@ export default {
     extraInfo: 'Zusatzinformationen',
     value: 'Wert',
     clickToHighlightOnMap: 'Klicken um auf der Karte anzuzeigen',
-    showAllOnMap: 'Alle auf Karte zeigen',
-
-    steepness: 'Steilheit',
-    surface: 'Oberfläche',
-    roadaccessrestrictions: 'Straßen Zugangsbeschränkung',
-    waytypes: 'Weg Arten',
-    suitability: 'Eignung',
-    waycategory: 'Wegkategorie',
-    tollways: 'Mautstraßen',
-    traildifficulty: 'Trail Schwierigkeit',
-    osmid: 'OSM ID',
-    countryinfo: 'Länderinfo',
-    green: 'Grün',
-    noise: 'Lärm' 
+    showAllOnMap: 'Alle auf Karte zeigen'
   }
 }
diff --git a/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.en-us.js b/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.en-us.js
@@ -5,20 +5,6 @@ export default {
     extraInfo: 'Extra info',
     value: 'Value',
     clickToHighlightOnMap: 'Click to highlight it on map',
-    showAllOnMap: 'Show all on map',
-
-    steepness: 'Steepness',
-    surface: 'Surface',
-    roadaccessrestrictions: 'Road access restrictions',
-    waytypes: 'Way types',
-    suitability: 'Suitability',
-    waycategory: 'Way category',
-    tollways: 'Tollways',
-    traildifficulty: 'Trail difficulty',
-    osmid: 'OSM ID',
-    countryinfo: 'Country info',
-    green: 'Green',
-    noise: 'Noise',
-    opacity: 'Opacity'
+    showAllOnMap: 'Show all on map'
   }
 }
diff --git a/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.es-es.js b/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.es-es.js
@@ -4,18 +4,6 @@ export default {
     'extraInfo': 'Información adicional',
     'value': 'Valor',
     'clickToHighlightOnMap': 'Haga clic para resaltar en el mapa',
-    'showAllOnMap': 'Mostrar todo en el mapa',
-    'steepness': 'Inclinación',
-    'surface': 'Superfície',
-    'roadaccessrestrictions': 'Restricciones de acceso por carretera',
-    'waytypes': 'tipos de camino',
-    'suitability': 'Adecuación',
-    'waycategory': 'Categoria de camino',
-    'tollways': 'Peajes',
-    'traildifficulty': 'Dificultad del camino',
-    'osmid': 'OSM ID',
-    'countryinfo': 'Información sobre el país',
-    'green': 'Verde',
-    'noise': 'Ruido'
+    'showAllOnMap': 'Mostrar todo en el mapa'
   }
 }
diff --git a/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.fr-fr.js b/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.fr-fr.js
@@ -5,19 +5,6 @@ export default {
     'extraInfo': 'Inform. supplémentaires',
     'value': 'Valeur',
     'clickToHighlightOnMap': 'Cliquez pour le mettre en évidence sur la carte',
-    'showAllOnMap': 'Tout afficher sur la carte',
-
-    'steepness': 'Inclinaison',
-    'surface': 'Surface',
-    'roadaccessrestrictions': 'Restrictions d\'accès à la route',
-    'waytypes': 'Types de voie',
-    'suitability': 'pertinence',
-    'waycategory': 'Catégorie de voie',
-    'tollways': 'Péages',
-    'traildifficulty': 'Difficulté du sentier',
-    'osmid': 'OSM ID',
-    'countryinfo': 'Informations sur le pays',
-    'green': 'Vert',
-    'noise': 'Bruit'
+    'showAllOnMap': 'Tout afficher sur la carte'
   }
 }
diff --git a/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.hu-hu.js b/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.hu-hu.js
@@ -5,18 +5,6 @@ export default {
     'extraInfo': 'További információk',
     'value': 'Érték',
     'clickToHighlightOnMap': 'Kattintson a térképen való megjelenítéshez',
-    'showAllOnMap': 'Az összes megjelenítése az térképen',
-    'steepness': 'Meredekség',
-    'surface': 'Felszín',
-    'roadaccessrestrictions': 'Behajtási korlátozások',
-    'waytypes': 'Úttípusok',
-    'suitability': 'Alkalmasság',
-    'waycategory': 'Útkategória',
-    'tollways': 'Fizetős utak',
-    'traildifficulty': 'Út nehézsége',
-    'osmid': 'OSM ID',
-    'countryinfo': 'Országinformációk',
-    'green': 'Zöld',
-    'noise': 'Zaj'    
+    'showAllOnMap': 'Az összes megjelenítése az térképen'
   }
 }
diff --git a/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.it-it.js b/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.it-it.js
@@ -1,23 +1,9 @@
 export default {
   routeExtras: {
-    'extras': 'Opzioni extra per il percorso',
-
+    'extras': 'Opzioni extra per il percorso',    
     'extraInfo': 'Informazioni extra',
     'value': 'Valore',
     'clickToHighlightOnMap': 'Clicca per evidenziare sulla mappa',
-    'showAllOnMap': 'Mostra tutto sulla mappa',
-
-    'steepness': 'Ripidezza',
-    'surface': 'Superficie',
-    'roadaccessrestrictions': 'Restrizioni d\'accesso alla strada',
-    'waytypes': 'Tipo di percorsi',
-    suitability: 'adeguatezza',
-    waycategory: 'Categoria di via',
-    tollways: 'Pedaggios',
-    traildifficulty: 'Difficoltà del sentiero',
-    osmid: 'OSM ID',
-    countryinfo: 'Informazioni sul paese',
-    green: 'Verde',
-    noise: 'Rumore'
+    'showAllOnMap': 'Mostra tutto sulla mappa'
   }
 }
diff --git a/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.pt-br.js b/...and-directions/components/route-details/components/extras/i18n/route-extras.i18n.pt-br.js
@@ -5,19 +5,6 @@ export default {
     extraInfo: 'Informações extra',
     value: 'Valor',
     clickToHighlightOnMap: 'Clique para destacar no mapa',
-    showAllOnMap: 'Mostrar tudo no mapa',
-
-    steepness: 'Inclinação',
-    surface: 'Superfície',
-    roadaccessrestrictions: 'Road access restrictions',
-    waytypes: 'tipos de caminho',
-    suitability: 'Adequação',
-    waycategory: 'Categoria do caminho',
-    tollways: 'Pedágios',
-    traildifficulty: 'Dificuldade da trilha',
-    osmid: 'OSM ID',
-    countryinfo: 'Informação do país',
-    green: 'Verde',
-    noise: 'Barulho' 
+    showAllOnMap: 'Mostrar tudo no mapa'
   }
 }
diff --git a/...omponents/place-and-directions/components/route-details/components/extras/route-extras.js b/...omponents/place-and-directions/components/route-details/components/extras/route-extras.js
@@ -56,9 +56,15 @@ export default {
      * @param {*} index
      * @param {*} value
      */
-    colorValue (extraKey, index, value) {
+    colorValue (extraKey, index, value = null) {
       let dict = orsDictionary
-      const color = dict.colors[extraKey][index] || dict.colors[extraKey][value]
+      let color
+      if (value) {
+        color = dict.colors[extraKey][value]
+      } else {
+        color = dict.colors[extraKey][index]
+      }
+
       return color
     },
     /**
@@ -69,10 +75,10 @@ export default {
      * @param {Integer} index
      * @returns {Object}
      */
-    segmentStyle (extraKey, amount, index) {
+    segmentStyle (extraKey, summary, index) {
       const style = {
-        width: amount + '%',
-        background: this.colorValue(extraKey, index)
+        width: summary.amount + '%',
+        background: this.colorValue(extraKey, index, summary.value)
       }
       return style
     },
@@ -106,13 +112,13 @@ export default {
      * @emits highlightPolylineSections (via eventBus)
      */
     showSection (extraKey, value, index) {
-      const sectionTitle = this.$t('routeExtras.' + extraKey).toLowerCase()
+      const sectionTitle = this.$t('global.' + extraKey).toLowerCase()
       const color = this.colorValue(extraKey, index)
-      const heighlighData = { extraKey, sectionTitle, sections: [{ intervals: [], color }] }
+      const highlighData = { extraKey, sectionTitle, sections: [{ intervals: [], color }] }
 
       const polylineData = this.buildExtraHighlighPolylineData(extraKey, index, value)
-      heighlighData.sections.push(polylineData)
-      this.eventBus.$emit('highlightPolylineSections', heighlighData)
+      highlighData.sections.push(polylineData)
+      this.eventBus.$emit('highlightPolylineSections', highlighData)
     },
     /**
      * Handle the show all sections click by
@@ -124,17 +130,17 @@ export default {
      * @emits highlightPolylineSections (via eventBus)
      */
     showAllSections (extraKey) {
-      const sectionTitle = this.$t('routeExtras.' + extraKey).toLowerCase()
-      const heighlighData = { extraKey: extraKey, sectionTitle, sections: [] }
+      const sectionTitle = this.$t('global.' + extraKey).toLowerCase()
+      const highlighData = { extraKey: extraKey, sectionTitle, sections: [] }
 
       let index = 0
       for (const summaryKey in this.routeExtras[extraKey].summary) {
         const summary = this.routeExtras[extraKey].summary[summaryKey]
         const polylineData = this.buildExtraHighlighPolylineData(extraKey, index, summary.value)
-        heighlighData.sections.push(polylineData)
+        highlighData.sections.push(polylineData)
         index++
       }
-      this.eventBus.$emit('highlightPolylineSections', heighlighData)
+      this.eventBus.$emit('highlightPolylineSections', highlighData)
     },
     /**
      * Build the the extra info highlighting data