Dashboard filters

[ptbrowne]

Work in progress.

Functionality

It is now possible to activate a single shared temporal filter for all charts depending on a particular temporal dimensions.

• Shared time slider, takes unit from dimension
• UI to activate/deactivate year filter
• Ability to change default from/to of the time rane
• Dashboard filter is not shown inside the "configurating" view
• Chart config gains a new attribute dashboardFilters where sharedFilters are stored

How to test

1. Start from Photovoltaikanlagen
2. Add a line chart
3. Add a new dataset like Median electricity tariff for Switzerland
4. Proceed to layout options
5. Choose Dashboard as a layout
6. See that a section "Shared filters" appears in the left panel
7. Activate the shared filter on Year
8. You can now interactively control both charts with the same filter
9. Control the default extent through the date pickers in the left panel
10. Publish the chart

Next steps in following PRs

• Implement the logic for data filters
• Implement the logic for "point in time" filter

Refactors

Take the opportunity to explode the big configurator-state file into multiple ones. With this, it should be easier to add changes. I'd like your feedback on this Bartosz also.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
visualization-tool	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 4, 2024 10:25am

[bprusinowski]

Code LGTM, with some questions and small nits 💯

When it comes to testing the deployment preview, I think it breaks when you merge cubes:

1. Go to this link.
2. Add a line chart.
3. Merge Heavy metal soil contamination dataset to the line chart.
4. Proceed to layout options.
5. Switch to Free canvas Dashboard layout.
6. Enable shared filters.
7. See that the filters do not work and the slider is not shown on top of the charts.

[bprusinowski]

Thinking out loud if these shouldn't be connected to RDF definitions? See that we already defined some of them here:

visualization-tool/app/rdf/parse.ts

Lines 301 to 305 in 92532b7

	const timeFormatters = new Map<string, (d: Date) => string>([
	[ns.xsd.gYear.value, timeFormat("%Y")],
	[ns.xsd.date.value, timeFormat("%Y-%m-%d")],
	[ns.xsd.dateTime.value, timeFormat("%Y-%m-%dT%H:%M:%S")],
	]);

[ptbrowne]

Do you mean that we should make sure that there are the same string formats used on the client & on the server, for example having a time-formats where

export const timeFormats : Record<TimeUnit, string> = {
  Year: "%Y"
  Second: "%Y-%m-%dT%H:%M:%S"
  ...
}

and imported by both ui-helpers and rdf/parse ?

[bprusinowski]

Yes, I was wondering if this would make sense and is actually needed. It looks that the formatters I shared in the link are only used in interpolateTimeValues function from the same file which is not used anywhere; so I guess we could just clean up and remove these server-side variables 👀

[bprusinowski]

For the breaking of giant configurator state into smaller files, I think it's a very good step into making this more manageable, which also shouldn't really change any behavior if I am not mistaken, so I am all for it :)