refactor: functions used to generate time series

core/client/components/collection/KGrid.vue

@@ -229,7 +229,7 @@ function onLoad (index, done) {
     done(true)
     return
   }
-  // set the current page and tell the collection to be refreshed  
+  // set the current page and tell the collection to be refreshed
   currentPage.value = index
   refreshCollection()
   loadDoneFunction.value = done

core/client/components/collection/KScrollDown.vue

@@ -75,7 +75,7 @@ function scrollOnce () {
   const targetElement = document.getElementById(props.target)
   if (!targetElement) return
   const position = qScrollUtils.getVerticalScrollPosition(targetElement)
-  qScrollUtils.setVerticalScrollPosition(targetElement, position + targetElement.offsetHeight * .75, props.duration)
+  qScrollUtils.setVerticalScrollPosition(targetElement, position + targetElement.offsetHeight * 0.75, props.duration)
   refresh()
 }
 

core/client/components/layout/KPage.vue

@@ -32,8 +32,8 @@
       Be careful of the order
      -->
     <!-- Bottom pane -->
-    <q-page-sticky 
-      position="bottom" 
+    <q-page-sticky
+      position="bottom"
       class="k-bottom-pane-sticky"
       @click="onClicked('panes.bottom')"
     >
@@ -53,8 +53,8 @@
       </div>
     </q-page-sticky>
     <!-- Right pane -->
-    <q-page-sticky 
-      position="right" 
+    <q-page-sticky
+      position="right"
       class="k-right-pane-sticky"
       @click="onClicked('panes.right')"
     >
@@ -75,8 +75,8 @@
       </div>
     </q-page-sticky>
     <!-- Top pane -->
-    <q-page-sticky 
-      position="top" 
+    <q-page-sticky
+      position="top"
       class="k-top-pane-sticky"
       @click="onClicked('panes.top')"
     >
@@ -96,9 +96,9 @@
       </div>
     </q-page-sticky>
     <!-- Fab -->
-    <q-page-sticky 
-      :position="fab.position" 
-      :offset="fab.offset" 
+    <q-page-sticky
+      :position="fab.position"
+      :offset="fab.offset"
       class="k-fab-sticky"
       @click="onClicked('fab')"
     >
@@ -110,9 +110,9 @@
       />
     </q-page-sticky>
     <!-- left Window -->
-    <q-page-sticky 
-      position="top-left" 
-      :offset="leftWindow.position" 
+    <q-page-sticky
+      position="top-left"
+      :offset="leftWindow.position"
       class="k-left-window-sticky"
       @click="onClicked('windows.left')"
     >
@@ -125,10 +125,10 @@
       />
     </q-page-sticky>
     <!-- top Window -->
-    <q-page-sticky 
-      position="top-left" 
-      :offset="topWindow.position" 
-      class="k-top-window-sticky" 
+    <q-page-sticky
+      position="top-left"
+      :offset="topWindow.position"
+      class="k-top-window-sticky"
       @click="onClicked('windows.top')"
     >
       <KWindow
@@ -140,10 +140,10 @@
       />
     </q-page-sticky>
     <!-- right Window -->
-    <q-page-sticky 
-      position="top-left" 
-      :offset="rightWindow.position" 
-      class="k-right-window-sticky" 
+    <q-page-sticky
+      position="top-left"
+      :offset="rightWindow.position"
+      class="k-right-window-sticky"
       @click="onClicked('windows.right')"
     >
       <KWindow
@@ -155,10 +155,10 @@
       />
     </q-page-sticky>
     <!-- bottom Window -->
-    <q-page-sticky 
-      position="top-left" 
-      :offset="bottomWindow.position" 
-      class="k-bottom-window-sticky" 
+    <q-page-sticky
+      position="top-left"
+      :offset="bottomWindow.position"
+      class="k-bottom-window-sticky"
       @click="onClicked('windows.bottom')"
     >
       <KWindow

core/client/layout.js

@@ -6,7 +6,7 @@ import { Store } from './store.js'
 import { bindContent } from './utils/utils.content.js'
 
 const defaultZIndex = {
-  drawer: 3000,  // see Quasar css variables
+  drawer: 3000, // see Quasar css variables
   panes: 1000,
   fab: 1000,
   windows: 990,
@@ -39,7 +39,7 @@ const defaults = {
   stickies: { ...contentDefaults, zIndex: defaultZIndex.stickies },
   fab: { ...contentDefaults, icon: 'las la-ellipsis-v', position: 'bottom-right', offset: [16, 16], zIndex: defaultZIndex.fab },
   panes: {
-    left: { ...contentDefaults, ...paneDefaults, sizes: 300, zIndex: defaultZIndex.drawer }, 
+    left: { ...contentDefaults, ...paneDefaults, sizes: 300, zIndex: defaultZIndex.drawer },
     top: { ...contentDefaults, ...paneDefaults, sizes: undefined },
     right: { ...contentDefaults, ...paneDefaults, sizes: { xs: [85, 75], sm: [360, 75], md: [440, 80], lg: [500, 80], xl: [500, 85] } },
     bottom: { ...contentDefaults, ...paneDefaults, sizes: undefined }
@@ -426,10 +426,10 @@ export const Layout = {
     const focus = this.getElement('focus')
     if (focus.element) {
       if (focus.element === element) return
-      Store.patch(this.getElementPath(focus.element.path), { zIndex: focus.element.zIndex })  
+      Store.patch(this.getElementPath(focus.element.path), { zIndex: focus.element.zIndex })
     }
     const props = this.getElement(element)
-    Store.patch(this.getElementPath('focus'), { element: { path: element, zIndex: props.zIndex }})
+    Store.patch(this.getElementPath('focus'), { element: { path: element, zIndex: props.zIndex } })
     Store.patch(this.getElementPath(element), { zIndex: focus.zIndex })
   },
   clearFocus () {

core/client/services/index.js

@@ -31,6 +31,7 @@ export default function init () {
     timelineStep: 'time.step',
     timelineInterval: 'time.interval',
     timeseriesSpan: 'timeseries.span',
+    timeseriesGroupBy: 'timeseries.groupBy',
     location: 'locationFormat',
     restoreView: 'restore.view',
     restoreLayers: 'restore.layers',

core/common/schemas/settings.update.json

@@ -130,6 +130,18 @@
         ]
       }
     },
+    "timeseriesGroupBy": {
+      "type": "string",
+      "group": "group-timeseries",
+      "field": {
+        "component": "form/KSelectField",
+        "label": "schemas.TIMESERIES_GROUP_BY",
+        "options": [
+          { "label": "schemas.TIMESERIES_GROUP_BY_VARIABLE", "value": "variable" },
+          { "label": "schemas.TIMESERIES_GROUP_BY_FEATURE", "value": "feature", "selected": true }
+        ]
+      }
+    },
     "restoreView": {
       "type": "boolean",
       "group": "group-map",

map/client/i18n/map_en.json

@@ -233,6 +233,9 @@
     "TIMELINE_INTERVAL": "Real-time data refresh update interval",
     "TIMESERIES_SETTINGS": "Timeseries parameters",
     "TIMESERIES_SPAN": "Timeseries span (in hours)",
+    "TIMESERIES_GROUP_BY": "Timeseries grouping",
+    "TIMESERIES_GROUP_BY_VARIABLE": "Broup by variable",
+    "TIMESERIES_GROUP_BY_FEATURE": "Group by geographical feature",
     "CAPTURE_RESOLUTION_FIELD_LABEL": "Resolution setting",
     "CAPTURE_HEADER_FIELD_LABEL": "Title setting",
     "CAPTURE_FOOTER_FIELD_LABEL": "Footer setting",

map/client/i18n/map_fr.json

@@ -233,6 +233,9 @@
     "TIMELINE_INTERVAL": "Fréquence de rafraichissement des données en temps-réel",
     "TIMESERIES_SETTINGS": "Paramètrage des séries temporelles",
     "TIMESERIES_SPAN": "Intervalle des séries temporelles, en heures",
+    "TIMESERIES_GROUP_BY": "Regroupement des séries temporelles",
+    "TIMESERIES_GROUP_BY_VARIABLE": "Regroupement par variable",
+    "TIMESERIES_GROUP_BY_FEATURE": "Regroupement par élément géographique",
     "CAPTURE_RESOLUTION_FIELD_LABEL": "Paramétrez la résolution",
     "CAPTURE_HEADER_FIELD_LABEL": "Paramétrez le titre",
     "CAPTURE_FOOTER_FIELD_LABEL": "Paramétrez le pied de page",

map/client/init.js

@@ -83,7 +83,8 @@ export default async function init () {
   }))
   // Default timeseries parameters
   Store.set('timeseries', reactive({
-    span: 1440 // 24H
+    span: 1440, // 24H
+    groupBy: 'feature'
   }))
 
   // Register the readers

map/client/mixins/mixin.weacast.js

@@ -1,5 +1,6 @@
 import _ from 'lodash'
 import logger from 'loglevel'
+import { getForecastForLocation, getForecastProbe, getForecastForFeature } from '../utils/utils.weacast.js'
 
 export const weacast = {
   emits: [
@@ -64,45 +65,11 @@ export const weacast = {
     async getForecastForLocation (long, lat, startTime, endTime) {
       // Not yet ready
       if (!this.forecastModel) return
-      // From now to last available time
-      const geometry = {
-        type: 'Point',
-        coordinates: [long, lat]
-      }
-      const query = {
-        forecastTime: {
-          $gte: startTime.format(),
-          $lte: endTime.format()
-        },
-        geometry: {
-          $geoIntersects: {
-            $geometry: geometry
-          }
-        }
-      }
-      let probedLocation
       this.setCursor('processing-cursor')
-      try {
-        let elements = this.forecastModel.elements.map(element => element.name)
-        // Filter available elements according to current level if any
-        if (this.forecastLevel) elements = elements.filter(element => element.endsWith(this.forecastLevel.toString()))
-        else {
-          elements = elements.filter(element => {
-            const tokens = element.split('-')
-            return (tokens.length === 0) || !_.isFinite(_.toNumber(tokens[tokens.length - 1]))
-          })
-        }
-        const response = await this.getWeacastApi().getService('probes')
-          .create({
-            forecast: this.forecastModel.name,
-            elements
-          }, { query })
-        if (response.features.length > 0) {
-          probedLocation = response.features[0]
-        } else throw new Error('Cannot find valid forecast at location')
-      } catch (error) {
-        logger.error(error)
-      }
+      const probedLocation = await getForecastForLocation({
+        long, lat, startTime, endTime, forecastModel: this.forecastModel,
+        forecastLevel: this.forecastLevel, weacastApi: this.getWeacastApi()
+      })
       this.unsetCursor('processing-cursor')
       return probedLocation
     },
@@ -113,63 +80,17 @@ export const weacast = {
       if (this.probe && (this.probe.name === name) && (this.probe.forecast === this.forecastModel.name)) {
         return this.probe
       }
-      const results = await this.getWeacastApi().getService('probes').find({
-        query: {
-          name,
-          forecast: this.forecastModel.name,
-          $paginate: false,
-          $select: ['elements', 'forecast', 'featureId']
-        }
-      })
-      if (results.length > 0) {
-        this.probe = results[0]
-        return this.probe
-      } else {
-        return null
-      }
+      this.probe = await getForecastProbe({ name, forecastModel: this.forecastModel, weacastApi: this.getWeacastApi() })
+      return this.probe
     },
     async getForecastForFeature (featureId, startTime, endTime) {
       // Not yet ready
       if (!this.forecastModel) return
       // Check if probe is available
       if (!this.probe) return
 
-      let probedLocation
       this.setCursor('processing-cursor')
-      try {
-        let elements = this.forecastModel.elements.map(element => element.name)
-        // Filter available elements according to current level if any
-        if (this.forecastLevel) {
-          elements = elements.filter(element => element.endsWith(this.forecastLevel.toString()))
-        } else {
-          elements = elements.filter(element => {
-            const tokens = element.split('-')
-            return (tokens.length === 0) || !_.isFinite(_.toNumber(tokens[tokens.length - 1]))
-          })
-        }
-        // Need to add derived values for static probes as they are not computed on the fly
-        const windDirection = (this.forecastLevel ? `windDirection-${this.forecastLevel}` : 'windDirection')
-        const windSpeed = (this.forecastLevel ? `windSpeed-${this.forecastLevel}` : 'windSpeed')
-        elements = elements.concat([windDirection, windSpeed])
-
-        const results = await this.getWeacastApi().getService('probe-results').find({
-          query: {
-            probeId: this.probe._id,
-            forecastTime: {
-              $gte: startTime.format(),
-              $lte: endTime.format()
-            },
-            [this.probe.featureId]: featureId,
-            $groupBy: this.probe.featureId,
-            $aggregate: elements
-          }
-        })
-        if (results.length > 0) {
-          probedLocation = results[0]
-        } else throw new Error('Cannot find valid forecast for feature')
-      } catch (error) {
-        logger.error(error)
-      }
+      const probedLocation = await getForecastForFeature({ probe: this.probe, featureId, startTime, endTime, forecastModel: this.forecastModel, forecastLevel: this.forecastLevel, weacastApi: this.getWeacastApi() })
       this.unsetCursor('processing-cursor')
       return probedLocation
     },

map/client/utils/index.js

@@ -7,3 +7,4 @@ export * from './utils.location.js'
 export * from './utils.project.js'
 export * from './utils.schema.js'
 export * from './utils.style.js'
+export * from './utils.time-series.js'