diff --git a/CHANGELOG.md b/CHANGELOG.md index afa03d167..f831ae548 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,7 @@ You can also check the [release page](https://github.com/visualize-admin/visuali - Features - Localized cube landing pages are now supported (dcat:landingPage) 🌎 + - Temporal dimensions can now be used as segmentation fields (excluding area and line charts) - Fixes - Copying a link to a new visualization from a dataset preview now correctly includes a data source diff --git a/app/charts/chart-config-ui-options.ts b/app/charts/chart-config-ui-options.ts index 9c2e6471c..cfc14e040 100644 --- a/app/charts/chart-config-ui-options.ts +++ b/app/charts/chart-config-ui-options.ts @@ -302,6 +302,7 @@ interface ChartSpecs { const SEGMENT_COMPONENT_TYPES: ComponentType[] = [ "NominalDimension", "OrdinalDimension", + "TemporalDimension", "TemporalOrdinalDimension", "GeoCoordinatesDimension", "GeoShapesDimension", diff --git a/app/charts/index.ts b/app/charts/index.ts index e5297d355..cd679dbf9 100644 --- a/app/charts/index.ts +++ b/app/charts/index.ts @@ -999,17 +999,23 @@ const chartConfigsAdjusters: ChartConfigsAdjusters = { } } else { const oldSegment = oldValue as Exclude; - newSegment = { - componentIri: oldSegment.componentIri, - palette: oldSegment.palette, - colorMapping: oldSegment.colorMapping, - sorting: - "sorting" in oldSegment && - oldSegment.sorting && - "sortingOrder" in oldSegment.sorting - ? oldSegment.sorting ?? DEFAULT_FIXED_COLOR_FIELD - : DEFAULT_SORTING, - }; + const segmentDimension = dimensions.find( + (d) => d.iri === oldValue.componentIri + ); + + if (!isTemporalDimension(segmentDimension)) { + newSegment = { + componentIri: oldSegment.componentIri, + palette: oldSegment.palette, + colorMapping: oldSegment.colorMapping, + sorting: + "sorting" in oldSegment && + oldSegment.sorting && + "sortingOrder" in oldSegment.sorting + ? oldSegment.sorting ?? DEFAULT_FIXED_COLOR_FIELD + : DEFAULT_SORTING, + }; + } } return produce(newChartConfig, (draft) => { @@ -1084,16 +1090,22 @@ const chartConfigsAdjusters: ChartConfigsAdjusters = { } } else { const oldSegment = oldValue as Exclude; - newSegment = { - componentIri: oldSegment.componentIri, - palette: oldSegment.palette, - colorMapping: oldSegment.colorMapping, - sorting: adjustSegmentSorting({ - segment: oldSegment, - acceptedValues: AREA_SEGMENT_SORTING.map((d) => d.sortingType), - defaultValue: "byTotalSize", - }), - }; + const segmentDimension = dimensions.find( + (d) => d.iri === oldValue.componentIri + ); + + if (!isTemporalDimension(segmentDimension)) { + newSegment = { + componentIri: oldSegment.componentIri, + palette: oldSegment.palette, + colorMapping: oldSegment.colorMapping, + sorting: adjustSegmentSorting({ + segment: oldSegment, + acceptedValues: AREA_SEGMENT_SORTING.map((d) => d.sortingType), + defaultValue: "byTotalSize", + }), + }; + } } return produce(newChartConfig, (draft) => { diff --git a/app/configurator/components/chart-options-selector.tsx b/app/configurator/components/chart-options-selector.tsx index 87cbc1222..3d39d3191 100644 --- a/app/configurator/components/chart-options-selector.tsx +++ b/app/configurator/components/chart-options-selector.tsx @@ -1193,7 +1193,8 @@ const ChartFieldMultiFilter = ({ Filter - {isTemporalDimension(component) ? ( + {/* For temporal-based segments, we want to treat values as nominal. */} + {isTemporalDimension(component) && field !== "segment" ? (