@opengeoweb/time-series 13.0.0 → 13.1.0

package/index.esm.js

@@ -911,14 +911,14 @@ var createUrl = function createUrl(baseUrl, pathToAdd, queryParameters) {
   return urlObject.toString();
 };
 var supportedOutputFormat = 'CoverageJSON';
-var getBaseQueryParamArray = function getBaseQueryParamArray(parameter, instance, clipInterval) {
-  var _instance$extent, _instance$extent2;
+var getBaseQueryParamArray = function getBaseQueryParamArray(parameter, instance, collection, clipInterval) {
+  var _instance$extent, _collection$collectio, _instance$extent2, _collection$collectio2;
   if (clipInterval === void 0) {
     clipInterval = [1 * 24, 10 * 24];
   }
   var res = [];
   res.push(['parameter-name', parameter.propertyName]);
-  var interval = (_instance$extent = instance.extent) == null || (_instance$extent = _instance$extent.temporal) == null ? void 0 : _instance$extent.interval[0];
+  var interval = ((_instance$extent = instance.extent) == null || (_instance$extent = _instance$extent.temporal) == null ? void 0 : _instance$extent.interval[0]) || ((_collection$collectio = collection.collectionDetails.extent) == null || (_collection$collectio = _collection$collectio.temporal) == null ? void 0 : _collection$collectio.interval[0]);
   // ----->  This will also set datetime parameter to the EDR query    <-----
   var _clipEdrInterval = clipEdrInterval(interval, clipInterval[0], clipInterval[1]),
     start = _clipEdrInterval[0],
@@ -926,8 +926,9 @@ var getBaseQueryParamArray = function getBaseQueryParamArray(parameter, instance
   if (interval != null && interval.length) {
     res.push(['datetime', start + "/" + end]);
   }
-  if ((_instance$extent2 = instance.extent) != null && _instance$extent2.spatial.crs) {
-    res.push(['crs', instance.extent.spatial.crs]);
+  var crs = ((_instance$extent2 = instance.extent) == null ? void 0 : _instance$extent2.spatial.crs) || ((_collection$collectio2 = collection.collectionDetails.extent) == null ? void 0 : _collection$collectio2.spatial.crs);
+  if (crs) {
+    res.push(['crs', crs]);
   }
   if (parameter.dimension) {
     if (parameter.dimension.id && parameter.dimension.id !== REFERENCE_TIME_ID && parameter.dimension.value !== '' && parameter.dimension.value !== undefined) {
@@ -941,6 +942,9 @@ var latestInstance = function latestInstance(instances) {
   if (instances.length === 0) {
     return null;
   }
+  if (instances.length === 1) {
+    return instances[0];
+  }
   return instances.reduce(function (latest, current) {
     return latest.id < current.id ? current : latest;
   }, {
@@ -1055,6 +1059,7 @@ var getParametersFromCollections = function getParametersFromCollections(service
       collectionId: collection.id,
       parameters: constructParameterObject(service.id, collection.id, parameterSource),
       customDimensions: ((_collection$extent = collection.extent) == null ? void 0 : _collection$extent.custom) || [],
+      collectionDetails: collection,
       allInstances: allInstances
     });
   };
@@ -2273,32 +2278,38 @@ var fetchParametersForService = /*#__PURE__*/function () {
           _context3.next = 7;
           return Promise.all(collections.map(/*#__PURE__*/function () {
             var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2(collection) {
+              var _collection$data_quer2;
               var allInstances, instance, details;
               return _regeneratorRuntime().wrap(function _callee2$(_context2) {
                 while (1) switch (_context2.prev = _context2.next) {
                   case 0:
-                    _context2.next = 2;
+                    if (!((_collection$data_quer2 = collection.data_queries) != null && _collection$data_quer2.instances)) {
+                      _context2.next = 10;
+                      break;
+                    }
+                    _context2.next = 3;
                     return getSupportedInstances(url, collection.id);
-                  case 2:
+                  case 3:
                     allInstances = _context2.sent;
                     instance = latestInstance(allInstances);
                     if (!instance) {
-                      _context2.next = 9;
+                      _context2.next = 10;
                       break;
                     }
-                    _context2.next = 7;
+                    _context2.next = 8;
                     return getInstanceDetails(url, collection.id, instance.id);
-                  case 7:
+                  case 8:
                     details = _context2.sent;
                     return _context2.abrupt("return", {
                       latestInstance: Object.assign({}, instance, details),
+                      collectionDetails: collection,
                       allInstances: allInstances,
                       collectionId: collection.id,
                       serviceId: serviceId
                     });
-                  case 9:
-                    return _context2.abrupt("return", null);
                   case 10:
+                    return _context2.abrupt("return", null);
+                  case 11:
                   case "end":
                     return _context2.stop();
                 }
@@ -2337,15 +2348,15 @@ var getPosition = function getPosition(serviceUrl, collectionId, instanceId, pos
   return fetch(url).then(handleResponse);
 };
 var fetchEdrParameter = /*#__PURE__*/function () {
-  var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee4(serviceUrl, parameter, location, instance) {
-    var _instance$data_querie, _instance$data_querie2;
+  var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee4(serviceUrl, parameter, location, instance, collection) {
+    var _instance$data_querie, _collection$collectio, _instance$data_querie2, _collection$collectio2;
     var collectionId, queryParamArr, locationId, result, _result;
     return _regeneratorRuntime().wrap(function _callee4$(_context4) {
       while (1) switch (_context4.prev = _context4.next) {
         case 0:
           collectionId = parameter.collectionId;
-          queryParamArr = getBaseQueryParamArray(parameter, instance);
-          if (!(isTimeSeriesLocation(location) && (_instance$data_querie = instance.data_queries) != null && _instance$data_querie.locations)) {
+          queryParamArr = getBaseQueryParamArray(parameter, instance, collection);
+          if (!(isTimeSeriesLocation(location) && ((_instance$data_querie = instance.data_queries) != null && _instance$data_querie.locations || (_collection$collectio = collection.collectionDetails.data_queries) != null && _collection$collectio.locations))) {
             _context4.next = 11;
             break;
           }
@@ -2363,7 +2374,7 @@ var fetchEdrParameter = /*#__PURE__*/function () {
           _context4.next = 16;
           break;
         case 11:
-          if (!((_instance$data_querie2 = instance.data_queries) != null && _instance$data_querie2.position)) {
+          if (!((_instance$data_querie2 = instance.data_queries) != null && _instance$data_querie2.position || (_collection$collectio2 = collection.collectionDetails.data_queries) != null && _collection$collectio2.position)) {
             _context4.next = 16;
             break;
           }
@@ -2380,7 +2391,7 @@ var fetchEdrParameter = /*#__PURE__*/function () {
       }
     }, _callee4);
   }));
-  return function fetchEdrParameter(_x6, _x7, _x8, _x9) {
+  return function fetchEdrParameter(_x6, _x7, _x8, _x9, _x0) {
     return _ref4.apply(this, arguments);
   };
 }();
@@ -2499,37 +2510,39 @@ var getNearbyLocation = function getNearbyLocation(parameter, service, selectedL
   return null;
 };
 var getEdrParameter = /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(presetParameter, serviceUrl, location, allInstances) {
-    var instanceInfo, apiData, paramKey, unit;
+  var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(presetParameter, serviceUrl, location, collection) {
+    var _collection$allInstan, _collection$allInstan2;
+    var instanceInfo, apiData, paramData, paramKey, unit;
     return _regeneratorRuntime().wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
-          instanceInfo = presetParameter.instanceId && (allInstances == null ? void 0 : allInstances.find(function (inst) {
+          instanceInfo = presetParameter.instanceId && ((_collection$allInstan = collection.allInstances) == null ? void 0 : _collection$allInstan.find(function (inst) {
             return inst.id === presetParameter.instanceId;
-          })) || (allInstances == null ? void 0 : allInstances[0]) || {
+          })) || ((_collection$allInstan2 = collection.allInstances) == null ? void 0 : _collection$allInstan2[0]) || {
             id: ''
           };
           _context.next = 3;
-          return fetchEdrParameter(serviceUrl, presetParameter, location, instanceInfo);
+          return fetchEdrParameter(serviceUrl, presetParameter, location, instanceInfo, collection);
         case 3:
           apiData = _context.sent;
-          if (!(!(apiData != null && apiData.ranges) || !apiData.domain.axes.t || apiData.domain.axes.t.values.length === 0)) {
-            _context.next = 6;
+          paramData = apiData != null && apiData.coverages ? apiData == null ? void 0 : apiData.coverages[0] : apiData;
+          if (!(!apiData || !(paramData != null && paramData.ranges) || !paramData.domain.axes.t || paramData.domain.axes.t.values.length === 0)) {
+            _context.next = 7;
             break;
           }
           return _context.abrupt("return", null);
-        case 6:
+        case 7:
           // assume only one parameter
-          paramKey = Object.keys(apiData.ranges)[0];
+          paramKey = Object.keys(paramData.ranges)[0];
           unit = getUnit(apiData.parameters[paramKey], i18n.language, 'en');
           return _context.abrupt("return", Object.assign({}, presetParameter, {
             unit: unit,
-            timestep: apiData.domain.axes.t.values.map(function (str) {
+            timestep: paramData.domain.axes.t.values.map(function (str) {
               return dateUtils.utc(str);
             }),
-            value: apiData.ranges[paramKey].values
+            value: paramData.ranges[paramKey].values
           }));
-        case 9:
+        case 10:
         case "end":
           return _context.stop();
       }
@@ -2548,8 +2561,14 @@ var fetchParameter = /*#__PURE__*/function () {
     return _regeneratorRuntime().wrap(function _callee2$(_context2) {
       while (1) switch (_context2.prev = _context2.next) {
         case 0:
+          if (collection) {
+            _context2.next = 2;
+            break;
+          }
+          throw new Error('No collection found for parameter');
+        case 2:
           if (!isTimeSeriesLocation(selectedLocation)) {
-            _context2.next = 12;
+            _context2.next = 14;
             break;
           }
           // The selected location contains a lisf of occurrences (combination of service and collection)
@@ -2558,68 +2577,68 @@ var fetchParameter = /*#__PURE__*/function () {
             return ((_occ$properties = occ.properties) == null ? void 0 : _occ$properties.collectionId) === parameter.collectionId && ((_occ$properties2 = occ.properties) == null ? void 0 : _occ$properties2.serviceId) === parameter.serviceId;
           });
           if (!occurrence) {
-            _context2.next = 12;
+            _context2.next = 14;
             break;
           }
-          _context2.prev = 3;
-          _context2.next = 6;
+          _context2.prev = 5;
+          _context2.next = 8;
           return getEdrParameter(parameter, service.url, {
             id: occurrence.id,
             lat: selectedLocation.lat,
             lon: selectedLocation.lon
-          }, collection == null ? void 0 : collection.allInstances);
-        case 6:
+          }, collection);
+        case 8:
           return _context2.abrupt("return", _context2.sent);
-        case 9:
-          _context2.prev = 9;
-          _context2.t0 = _context2["catch"](3);
+        case 11:
+          _context2.prev = 11;
+          _context2.t0 = _context2["catch"](5);
           throw new Error(getErrorMessage(parameter));
-        case 12:
+        case 14:
           // Try a position query
           position = {
             lon: selectedLocation.lon,
             lat: selectedLocation.lat
           };
-          _context2.prev = 13;
-          _context2.next = 16;
-          return getEdrParameter(parameter, service.url, position, collection == null ? void 0 : collection.allInstances);
-        case 16:
+          _context2.prev = 15;
+          _context2.next = 18;
+          return getEdrParameter(parameter, service.url, position, collection);
+        case 18:
           result = _context2.sent;
           if (!result) {
-            _context2.next = 19;
+            _context2.next = 21;
             break;
           }
           return _context2.abrupt("return", result);
-        case 19:
-          _context2.next = 35;
-          break;
         case 21:
-          _context2.prev = 21;
-          _context2.t1 = _context2["catch"](13);
+          _context2.next = 37;
+          break;
+        case 23:
+          _context2.prev = 23;
+          _context2.t1 = _context2["catch"](15);
           // As a final option look for a nearby location
           nearbyLocation = getNearbyLocation(parameter, service, selectedLocation, geojsonMap);
           if (!nearbyLocation) {
-            _context2.next = 34;
+            _context2.next = 36;
             break;
           }
-          _context2.prev = 25;
-          _context2.next = 28;
-          return getEdrParameter(parameter, service.url, nearbyLocation, collection == null ? void 0 : collection.allInstances);
-        case 28:
+          _context2.prev = 27;
+          _context2.next = 30;
+          return getEdrParameter(parameter, service.url, nearbyLocation, collection);
+        case 30:
           return _context2.abrupt("return", _context2.sent);
-        case 31:
-          _context2.prev = 31;
-          _context2.t2 = _context2["catch"](25);
+        case 33:
+          _context2.prev = 33;
+          _context2.t2 = _context2["catch"](27);
           throw new Error(getErrorMessage(parameter));
-        case 34:
+        case 36:
           throw new Error(getErrorMessage(parameter));
-        case 35:
+        case 37:
           throw new Error(getErrorMessage(parameter));
-        case 36:
+        case 38:
         case "end":
           return _context2.stop();
       }
-    }, _callee2, null, [[3, 9], [13, 21], [25, 31]]);
+    }, _callee2, null, [[5, 11], [15, 23], [27, 33]]);
   }));
   return function fetchParameter(_x5, _x6, _x7, _x8, _x9) {
     return _ref2.apply(this, arguments);
@@ -3345,15 +3364,14 @@ var ParameterDimensionSelect = function ParameterDimensionSelect(_ref) {
 };
 
 var TimeSeriesManagerRowAccordion = function TimeSeriesManagerRowAccordion(_ref) {
-  var plot = _ref.plot,
-    plotIsEnabled = _ref.plotIsEnabled,
+  var plotIsEnabled = _ref.plotIsEnabled,
     rowIsEnabled = _ref.rowIsEnabled,
     parameter = _ref.parameter,
     styles = _ref.styles,
     addParameter = _ref.addParameter,
     patchParameter = _ref.patchParameter,
     deleteParameter = _ref.deleteParameter,
-    togglePlot = _ref.togglePlot,
+    toggleParameter = _ref.toggleParameter,
     t = _ref.t;
   return jsx(CustomAccordion, {
     "data-testid": "timeSeriesManagerRowAccordion",
@@ -3380,12 +3398,16 @@ var TimeSeriesManagerRowAccordion = function TimeSeriesManagerRowAccordion(_ref)
         children: jsx(CustomIconButton, {
           onClick: function onClick(event) {
             event.stopPropagation();
-            togglePlot(plot.plotId);
+            toggleParameter(parameter.id);
           },
-          tooltipTitle: (plotIsEnabled ? t('timeseries-hide') : t('timeseries-show')) + " " + plot.title,
-          shouldShowAsDisabled: !plotIsEnabled,
+          tooltipTitle: (parameter.enabled !== false ? t('timeseries-hide') : t('timeseries-show')) + " " + parameter.propertyName,
           "data-testid": "accordionEnableButton",
-          children: plotIsEnabled ? jsx(Visibility, {}) : jsx(VisibilityOff, {})
+          shouldShowAsDisabled: !plotIsEnabled,
+          children: parameter.enabled !== false && plotIsEnabled ? jsx(Visibility, {
+            "data-testid": "enabled-visible"
+          }) : jsx(VisibilityOff, {
+            "data-testid": "disabled-visible"
+          })
         })
       }), jsx(Grid, {
         children: jsx(Grid, {
@@ -3555,7 +3577,6 @@ var ParameterList = function ParameterList(_ref) {
     toggleParameter = _ref.toggleParameter,
     patchParameter = _ref.patchParameter,
     addParameter = _ref.addParameter,
-    togglePlot = _ref.togglePlot,
     moveParameter = _ref.moveParameter,
     t = _ref.t;
   var onSortEnd = React__default.useCallback(function (sort) {
@@ -3599,8 +3620,7 @@ var ParameterList = function ParameterList(_ref) {
             addParameter: addParameter,
             patchParameter: patchParameter,
             deleteParameter: deleteParameter,
-            togglePlot: togglePlot,
-            plot: plot,
+            toggleParameter: toggleParameter,
             t: t
           })
         }), jsx(RowLayout, {
@@ -3866,7 +3886,6 @@ var PlotRows = function PlotRows(_ref) {
         patchParameter: patchParameter,
         addParameter: addParameter,
         moveParameter: moveParameter,
-        togglePlot: togglePlot,
         t: t
       })
     })]
@@ -6399,6 +6418,59 @@ var dateFormatter = function dateFormatter(date) {
 var getTooltipTimeLabel = function getTooltipTimeLabel(date) {
   return dateUtils.dateToString(dateUtils.utc(date), dateUtils.DATE_FORMAT_NAME_OF_DAY_MONTH);
 };
+var createParameterNames = function createParameterNames(plotsWithData) {
+  var plotTitles = new Map();
+  var parameters = plotsWithData.flatMap(function (plot) {
+    plotTitles.set(plot.plotId, plot.title);
+    return plot.parametersWithData;
+  });
+  // count all parameters with the same name
+  var duplicateParameterCount = new Map();
+  for (var _iterator = _createForOfIteratorHelperLoose(parameters), _step; !(_step = _iterator()).done;) {
+    var _duplicateParameterCo2;
+    var parameter = _step.value;
+    var name = getParameterDisplayName(parameter);
+    duplicateParameterCount.set(name, ((_duplicateParameterCo2 = duplicateParameterCount.get(name)) != null ? _duplicateParameterCo2 : 0) + 1);
+  }
+  // count per plot how many duplicate names there are
+  var perBaseNamePlotCounters = new Map();
+  return parameters.map(function (parameter) {
+    var _parameter$id, _duplicateParameterCo, _plotCounters$get, _parameter$enabled3;
+    var name = getParameterDisplayName(parameter);
+    var id = (_parameter$id = parameter.id) != null ? _parameter$id : '';
+    var totalCount = (_duplicateParameterCo = duplicateParameterCount.get(name)) != null ? _duplicateParameterCo : 0;
+    if (totalCount === 1) {
+      var _parameter$enabled;
+      return {
+        name: name,
+        id: id,
+        enabled: (_parameter$enabled = parameter.enabled) != null ? _parameter$enabled : true
+      };
+    }
+    var plotCounters = perBaseNamePlotCounters.get(name);
+    if (!plotCounters) {
+      plotCounters = new Map();
+      perBaseNamePlotCounters.set(name, plotCounters);
+    }
+    var idx = ((_plotCounters$get = plotCounters.get(parameter.plotId)) != null ? _plotCounters$get : 0) + 1;
+    plotCounters.set(parameter.plotId, idx);
+    // First occurrence in this plot → just plotId
+    if (idx === 1) {
+      var _parameter$enabled2;
+      return {
+        name: name + " (" + plotTitles.get(parameter.plotId) + ")",
+        id: id,
+        enabled: (_parameter$enabled2 = parameter.enabled) != null ? _parameter$enabled2 : true
+      };
+    }
+    // Subsequent occurrences → plotId + index (starting at 2)
+    return {
+      name: name + " (" + plotTitles.get(parameter.plotId) + " - " + idx + ")",
+      id: id,
+      enabled: (_parameter$enabled3 = parameter.enabled) != null ? _parameter$enabled3 : true
+    };
+  });
+};
 var paramIntervals = [{
   propertyName: 'Temp',
   interval: 2,
@@ -6617,10 +6689,11 @@ var getOption = function getOption(plotsWithData) {
   var newTimeSpan = CalculateTimeSpan(plotsWithData);
   var minDate = newTimeSpan.left;
   var maxDate = newTimeSpan.right;
+  var parameterNames = createParameterNames(plotsWithData);
   var plotCharts = getPlotCharts(plotsWithData);
   var xAxis = getXAxis(plotCharts, minDate, maxDate);
   var yAxis = getYAxis(plotCharts);
-  var series = getSeries(plotCharts);
+  var series = getSeries(plotCharts, parameterNames);
   var grid = getGrid(plotCharts);
   var tooltip = {
     trigger: 'axis',
@@ -6649,17 +6722,19 @@ var getOption = function getOption(plotsWithData) {
       return "<b>" + timeLabel + "</b>" + value;
     }
   };
-  var parameters = plotsWithData.flatMap(function (plot) {
-    return plot.parametersWithData;
-  });
-  var parameterNames = parameters.map(function (parameter) {
-    return getParameterDisplayName(parameter);
+  var legend = parameterNames.reduce(function (legendConfig, parameter) {
+    var _legendConfig$data, _parameter$enabled4, _Object$assign;
+    return Object.assign({}, legendConfig, {
+      data: (_legendConfig$data = legendConfig.data) == null ? void 0 : _legendConfig$data.concat(parameter.name),
+      selected: Object.assign({}, legendConfig.selected, (_Object$assign = {}, _Object$assign[parameter.name] = (_parameter$enabled4 = parameter.enabled) != null ? _parameter$enabled4 : true, _Object$assign))
+    });
+  }, {
+    data: [],
+    selected: {}
   });
   var dataZoomLabelWidth = 70;
   var option = {
-    legend: {
-      data: parameterNames
-    },
+    legend: legend,
     tooltip: tooltip,
     axisPointer: {
       link: [{
@@ -6671,7 +6746,7 @@ var getOption = function getOption(plotsWithData) {
       realtime: true,
       left: dataZoomLabelWidth,
       right: dataZoomLabelWidth,
-      xAxisIndex: parameters.map(function (_, index) {
+      xAxisIndex: parameterNames.map(function (_, index) {
         return index;
       }),
       labelFormatter: function labelFormatter(_, date) {
@@ -6772,7 +6847,7 @@ var getEChartsSeriesDataByTimestep = function getEChartsSeriesDataByTimestep(tim
   });
   return data;
 };
-var getSeries = function getSeries(plotCharts) {
+var getSeries = function getSeries(plotCharts, parameterNames) {
   var allTimesteps = plotCharts.flatMap(function (plotChart) {
     return Object.values(plotChart.parametersByUnit).flatMap(function (parameters) {
       return parameters.flatMap(function (parameter) {
@@ -6789,12 +6864,14 @@ var getSeries = function getSeries(plotCharts) {
     return Object.entries(plotChart.parametersByUnit).flatMap(function (_ref2, unitIndex) {
       var parameters = _ref2[1];
       return parameters.flatMap(function (parameter) {
-        var _COLOR_NAME_TO_HEX_MA;
+        var _COLOR_NAME_TO_HEX_MA, _parameterNames$find;
         var color = (_COLOR_NAME_TO_HEX_MA = COLOR_NAME_TO_HEX_MAP[parameter.color]) != null ? _COLOR_NAME_TO_HEX_MA : COLOR_NAME_TO_HEX_MAP[COLOR_MAP[parameter.propertyName]];
         var type = parameter.plotType === 'area' ? 'line' : parameter.plotType;
         return Object.assign({
           data: getEChartsSeriesDataByTimestep(uniqueTimesteps, parameter),
-          name: getParameterDisplayName(parameter),
+          name: (_parameterNames$find = parameterNames.find(function (pName) {
+            return pName.id === parameter.id;
+          })) == null ? void 0 : _parameterNames$find.name,
           type: type,
           xAxisIndex: plotIndex,
           yAxisIndex: plotChart.countPreviousUnits + unitIndex,
@@ -6993,7 +7070,8 @@ var TimeSeriesChart = function TimeSeriesChart(_ref2) {
     _ref2$animation = _ref2.animation,
     animation = _ref2$animation === void 0 ? false : _ref2$animation,
     _ref2$shouldShowLegen = _ref2.shouldShowLegend,
-    shouldShowLegend = _ref2$shouldShowLegen === void 0 ? true : _ref2$shouldShowLegen;
+    shouldShowLegend = _ref2$shouldShowLegen === void 0 ? true : _ref2$shouldShowLegen,
+    onToggleLegendParam = _ref2.onToggleLegendParam;
   var _useThemeContext = useThemeContext(),
     namedTheme = _useThemeContext.namedTheme;
   var isDark = (namedTheme == null ? void 0 : namedTheme.theme.palette.mode) === 'dark';
@@ -7026,7 +7104,18 @@ var TimeSeriesChart = function TimeSeriesChart(_ref2) {
       onChartReady: updateHeight,
       // noop, prevent flickering when toggling legend
       onEvents: {
-        finished: function finished() {}
+        finished: function finished() {},
+        legendselectchanged: function legendselectchanged(params) {
+          if (!option.legend) {
+            return;
+          }
+          var foundParam = createParameterNames(plotsWithData).find(function (param) {
+            return param.name === params.name;
+          });
+          if (foundParam && foundParam.id) {
+            onToggleLegendParam == null || onToggleLegendParam(foundParam.id);
+          }
+        }
       }
     })
   }) : null;
@@ -7039,7 +7128,8 @@ var TimeSeriesView = /*#__PURE__*/React__default.memo(function (_ref) {
     splitGeoJsonByCollection = _ref.splitGeoJsonByCollection,
     isLoading = _ref.isLoading,
     _ref$shouldShowLegend = _ref.shouldShowLegend,
-    shouldShowLegend = _ref$shouldShowLegend === void 0 ? true : _ref$shouldShowLegend;
+    shouldShowLegend = _ref$shouldShowLegend === void 0 ? true : _ref$shouldShowLegend,
+    onToggleLegendParam = _ref.onToggleLegendParam;
   var _useTimeseriesTransla = useTimeseriesTranslation(),
     t = _useTimeseriesTransla.t;
   var _useGetPlotsWithData = useGetPlotsWithData(plotPreset, selectedLocation, services, splitGeoJsonByCollection),
@@ -7064,7 +7154,8 @@ var TimeSeriesView = /*#__PURE__*/React__default.memo(function (_ref) {
       shouldClose: true
     }), plotsWithData && jsx(TimeSeriesChart, {
       plotsWithData: plotsWithData,
-      shouldShowLegend: shouldShowLegend
+      shouldShowLegend: shouldShowLegend,
+      onToggleLegendParam: onToggleLegendParam
     })]
   });
 }, function (previousProps, nextProps) {
@@ -7492,6 +7583,12 @@ var TimeSeriesConnect = function TimeSeriesConnect(_ref3) {
       isLegendVisible: !shouldShowLegend
     }));
   };
+  var onToggleLegendParam = function onToggleLegendParam(parameterId) {
+    dispatch(timeSeriesActions.toggleParameter({
+      parameterId: parameterId,
+      panelId: panelId
+    }));
+  };
   return jsxs(Stack, {
     sx: {
       padding: '20px',
@@ -7554,7 +7651,8 @@ var TimeSeriesConnect = function TimeSeriesConnect(_ref3) {
         services: services,
         splitGeoJsonByCollection: geoJSONWithService || [],
         isLoading: isLoading,
-        shouldShowLegend: shouldShowLegend
+        shouldShowLegend: shouldShowLegend,
+        onToggleLegendParam: onToggleLegendParam
       })
     })]
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/time-series",
-  "version": "13.0.0",
+  "version": "13.1.0",
   "description": "GeoWeb time-series library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -9,26 +9,26 @@
   },
   "dependencies": {
     "immer": "^10.0.3",
-    "@opengeoweb/shared": "13.0.0",
+    "@opengeoweb/shared": "13.1.0",
     "@reduxjs/toolkit": "^2.6.1",
     "react-redux": "^9.2.0",
-    "@opengeoweb/webmap": "13.0.0",
-    "@opengeoweb/webmap-react": "13.0.0",
+    "@opengeoweb/webmap": "13.1.0",
+    "@opengeoweb/webmap-react": "13.1.0",
     "lodash": "^4.17.21",
-    "@opengeoweb/api": "13.0.0",
-    "@opengeoweb/theme": "13.0.0",
-    "@opengeoweb/store": "13.0.0",
+    "@opengeoweb/api": "13.1.0",
+    "@opengeoweb/theme": "13.1.0",
+    "@opengeoweb/store": "13.1.0",
     "echarts-for-react": "^3.0.2",
     "echarts": "^5.4.3",
     "react-sortablejs": "^6.1.4",
-    "@opengeoweb/snackbar": "13.0.0",
+    "@opengeoweb/snackbar": "13.1.0",
     "react-window": "^1.8.10",
     "react-virtualized-auto-sizer": "^1.0.21",
     "msw": "^2.7.3",
     "i18next": "^25.0.1",
     "react-i18next": "^15.1.1",
-    "@opengeoweb/core": "13.0.0",
-    "@opengeoweb/form-fields": "13.0.0",
+    "@opengeoweb/core": "13.1.0",
+    "@opengeoweb/form-fields": "13.1.0",
     "@mui/material": "^7.0.1",
     "react-hook-form": "^7.61.1",
     "uuid": "^10.0.0",

package/src/lib/components/TimeSeries/TimeSeriesChart.d.ts

@@ -14,4 +14,5 @@ export declare const TimeSeriesChart: React.FC<{
     plotsWithData: PlotWithData[];
     animation?: boolean;
     shouldShowLegend?: boolean;
+    onToggleLegendParam?: (legendId: string) => void;
 }>;

package/src/lib/components/TimeSeries/TimeSeriesView.d.ts

@@ -8,6 +8,7 @@ interface TimeSeriesViewProps {
     splitGeoJsonByCollection: GeoJsonWithService[];
     isLoading?: (startOrFinish: boolean) => void;
     shouldShowLegend?: boolean;
+    onToggleLegendParam?: (legendId: string) => void;
 }
 export declare const TimeSeriesView: React.FC<TimeSeriesViewProps>;
 export {};

package/src/lib/components/TimeSeries/chartUtils.d.ts

@@ -3,6 +3,11 @@ import { ParameterWithData, Plot, PlotWithData } from './types';
 export declare const MIN_GRAPH_WIDTH = 300;
 export declare const dateFormatter: (date: string) => string;
 export declare const getTooltipTimeLabel: (date: string) => string;
+export declare const createParameterNames: (plotsWithData: PlotWithData[]) => {
+    name: string;
+    id: string;
+    enabled: boolean;
+}[];
 interface ParamIntervalType {
     unit?: string;
     propertyName?: string;
@@ -18,7 +23,10 @@ export declare const getParameterDisplayName: (parameter: ParameterWithData) =>
 export declare const roundDecimalValues: (value: number) => string;
 export declare const getOption: (plotsWithData: PlotWithData[]) => EChartsOption;
 export declare const getEChartsSeriesDataByTimestep: (timesteps: Date[], parameter: ParameterWithData) => (number | string)[][];
-export declare const getSeries: (plotCharts: PlotChart[]) => (LineSeriesOption | BarSeriesOption | ScatterSeriesOption)[];
+export declare const getSeries: (plotCharts: PlotChart[], parameterNames: {
+    name: string;
+    id: string;
+}[]) => (LineSeriesOption | BarSeriesOption | ScatterSeriesOption)[];
 export declare const getGrid: (plotCharts: PlotChart[]) => GridComponentOption[];
 export declare const Y_AXIS_OFFSET = 80;
 export declare const PLOT_HEIGHT = 150;

package/src/lib/components/TimeSeries/types.d.ts

@@ -127,6 +127,11 @@ export interface EDRPositionResponse {
     parameters: EDRParameters;
     ranges?: EDRRange;
 }
+export interface EDRPositionResponseCoverageCollection {
+    coverages: EDRPositionResponse[];
+    parameters: EDRParameters;
+    type: string;
+}
 export interface EDRCollection {
     parameter_names?: object;
     parameters?: object;

package/src/lib/components/TimeSeries/utils.d.ts

@@ -1,11 +1,11 @@
 import { Plot, PlotParameter, TimeSeriesService } from '@opengeoweb/shared';
 import { FeatureCollection, GeoJsonProperties, GeometryObject } from 'geojson';
-import { EDRInstance, GeoJsonWithService, Parameter, ParameterWithData, PlotWithData, PointerLocation, TimeSeriesLocation } from './types';
+import { GeoJsonWithService, Parameter, ParameterWithData, PlotWithData, PointerLocation, TimeSeriesLocation } from './types';
 import { TimeseriesCollectionDetail } from '../TimeSeriesSelect/utils';
 export declare const createGeoJsonArrays: (locations: (FeatureCollection<GeometryObject, GeoJsonProperties> | undefined)[], services: TimeSeriesService[] | undefined, hideFeatures: boolean, memoizedSelectedFeature: TimeSeriesLocation | null) => {
     combinedGeoJson: FeatureCollection<GeometryObject, GeoJsonProperties>;
 };
-export declare const getEdrParameter: (presetParameter: Parameter, serviceUrl: string, location: PointerLocation, allInstances?: EDRInstance[]) => Promise<ParameterWithData | null>;
+export declare const getEdrParameter: (presetParameter: Parameter, serviceUrl: string, location: PointerLocation, collection: TimeseriesCollectionDetail) => Promise<ParameterWithData | null>;
 export declare const fetchParameter: (parameter: PlotParameter, selectedLocation: PointerLocation, service: TimeSeriesService, geojsonMap: Map<string, GeoJsonWithService>, collection?: TimeseriesCollectionDetail) => Promise<ParameterWithData | null>;
 export declare const getPlotsWithParameters: (plots: Plot[], parameters: ParameterWithData[]) => PlotWithData[];
 export declare function consolidateFeatures(features: {

package/src/lib/components/TimeSeriesManager/ParameterList.d.ts

@@ -9,7 +9,6 @@ export declare const ParameterList: FC<{
     toggleParameter: (id: string) => void;
     patchParameter: (parameter: Partial<Parameter>) => void;
     addParameter: (parameter: Parameter) => void;
-    togglePlot: (id: string) => void;
     moveParameter: (event: MoveParameterPayload) => void;
     t: TFunction;
 }>;

package/src/lib/components/TimeSeriesManager/TimeSeriesManagerRowAccordion.d.ts

@@ -1,8 +1,7 @@
 import React from 'react';
 import { TFunction } from 'i18next';
-import { Parameter, ParameterListStyles, Plot } from '../TimeSeries/types';
+import { Parameter, ParameterListStyles } from '../TimeSeries/types';
 declare const TimeSeriesManagerRowAccordion: React.FC<{
-    plot: Plot;
     plotIsEnabled: boolean;
     rowIsEnabled: boolean;
     parameter: Parameter;
@@ -10,7 +9,7 @@ declare const TimeSeriesManagerRowAccordion: React.FC<{
     addParameter: (parameter: Parameter) => void;
     patchParameter: (parameter: Partial<Parameter>) => void;
     deleteParameter: (id: string) => void;
-    togglePlot: (id: string) => void;
+    toggleParameter: (id: string) => void;
     t: TFunction;
 }>;
 export default TimeSeriesManagerRowAccordion;

package/src/lib/components/TimeSeriesSelect/utils.d.ts

@@ -1,8 +1,9 @@
 import { EDRInstance } from '@opengeoweb/shared';
 import { ServiceFilterChipsObjectEntities } from '../../store/types';
-import { CustomDimension, SelectParameter } from '../TimeSeries/types';
+import { CustomDimension, EDRCollection, SelectParameter } from '../TimeSeries/types';
 export interface TimeseriesCollectionDetail {
     collectionId: string;
+    collectionDetails: EDRCollection;
     serviceId: string;
     parameters: SelectParameter[];
     serviceName: string;

package/src/lib/utils/edrUtils.d.ts

@@ -5,7 +5,7 @@ import { type EDRCollection, type EDRInstance, type EDRParameter, type Parameter
 import { TimeseriesCollectionDetail } from '../components/TimeSeriesSelect/utils';
 export declare const createUrl: (baseUrl: string, pathToAdd?: string, queryParameters?: [string, string][]) => string;
 export declare const supportedOutputFormat = "CoverageJSON";
-export declare const getBaseQueryParamArray: (parameter: Parameter, instance: EDRInstance, clipInterval?: [number, number]) => [string, string][];
+export declare const getBaseQueryParamArray: (parameter: Parameter, instance: EDRInstance, collection: TimeseriesCollectionDetail, clipInterval?: [number, number]) => [string, string][];
 export declare const latestInstance: (instances: EDRInstance[]) => EDRInstance | null;
 export declare const isSupportedInstance: (instances: EDRInstance) => boolean;
 export declare const listSupportedInstances: (instances: EDRInstance[]) => EDRInstance[];

package/src/lib/utils/mocks/handlers.d.ts

@@ -1,4 +1,4 @@
-import { EDRCollection, EDRInstance, EDRPositionResponse, Parameter } from '../../components/TimeSeries/types';
+import { EDRCollection, EDRInstance, EDRPositionResponse, EDRPositionResponseCoverageCollection, Parameter } from '../../components/TimeSeries/types';
 export declare const EDR_FINLAND_NAME = "EDR Finland";
 export declare const EDR_FINLAND_DESCRIPTION = "EDR Finland Description";
 export declare const EDR_FINLAND_URL = "https://opendata.fmi.fi/edr";
@@ -142,6 +142,7 @@ export declare const knmiUwcwHa43DInifInstances: {
         };
     })[];
 };
+export declare const edrPositionResponseCoverageCollectionMock: EDRPositionResponseCoverageCollection;
 export declare const edrPositionResponseMock: EDRPositionResponse;
 export declare const edrLocationResponseMock: EDRPositionResponse;
 export declare const mockLocations: {
@@ -157,6 +158,7 @@ export declare const mockLocations: {
     }[];
 };
 export declare const collectionsMockNorway: EDRCollection;
+export declare const collectionsMockNoInstances: EDRCollection;
 export declare const collectionsMockFinland: EDRCollection;
 export declare const edrEndpoints: import("msw").HttpHandler[];
 export declare const edrTestCollectionNoInstancesMock: {};

package/src/lib/utils/timeseries-api/api.d.ts

@@ -1,6 +1,6 @@
 import { GeometryObject } from 'geojson';
 import { TimeSeriesService } from '@opengeoweb/shared';
-import { EDRCollection, EDRInstance, EDRPositionResponse, Parameter, PointerLocation } from '../../components/TimeSeries/types';
+import { EDRCollection, EDRInstance, EDRPositionResponse, EDRPositionResponseCoverageCollection, Parameter, PointerLocation } from '../../components/TimeSeries/types';
 import { TimeseriesCollectionDetail } from '../../components/TimeSeriesSelect/utils';
 export interface LocationsResult {
     features: {
@@ -35,5 +35,5 @@ export declare const getCollections: (serviceUrl: string) => Promise<{
 }>;
 export declare const getSupportedInstances: (serviceUrl?: string, collectionId?: string, useCollectionFallback?: boolean) => Promise<EDRInstance[]>;
 export declare const fetchParametersForService: (service: TimeSeriesService) => Promise<TimeseriesCollectionDetail[]>;
-export declare const fetchEdrParameter: (serviceUrl: string, parameter: Parameter, location: PointerLocation, instance: EDRInstance) => Promise<EDRPositionResponse | null>;
+export declare const fetchEdrParameter: (serviceUrl: string, parameter: Parameter, location: PointerLocation, instance: EDRInstance, collection: TimeseriesCollectionDetail) => Promise<EDRPositionResponse | EDRPositionResponseCoverageCollection | null>;
 export {};

package/src/lib/utils/utils.d.ts

@@ -0,0 +1,3 @@
+export declare const generateTimeSeriesId: () => string;
+export declare const generateParameterId: () => string;
+export declare const generateServiceId: () => string;