Multivariable charts

[dsuren1]

Description

• Support to multi variable charts (now we have wfsChart or wpsChart enhancer to retrieve data, we may have multiple services)
• Refactor of the widget config UI.
• Backward compatibility. Define a model that is compatible and allows to edit old charts, together with these new charts.

Finalized implementation flow

Multivariable chart

1. Current chart configuration

Current chart configuration and functionality with respect to chart type (Bar, Line and Pie) are retained as is except for changes to the chart wizard is toolbar and Chart dropdown field is that all the configurations with respect to current chart is accessible from the buttons placed next to charts dropdown
Toolbar

Chart field

In order of the buttons placed

• Edit chart name
• Apply filter to current chart (Hidden when chart type is Multi chart)
• Add new chart (Let’s user to select a layer and a new chart is created)
• Delete a current chart

2. Multi chart type

A new chart type is introduced to handle multivariable chart configuration. User will be able to select a new chart type called ‘Multi chart’

• Upon selecting the chart type Multi chart
• The wizard presents user with Traces, traces options and advanced options specific to trace
  Traces
  Traces are meaningful grouping of data for the chart. Each trace corresponds to a layer.
  
  In order of the buttons placed
  • Edit trace name
  • Apply filter to current trace(layer)
  • Add new trace (Let’s user to select a layer and a new trace is created)
  • Delete a current trace or layer (Disabled when trace is not more than 1)

Trace options
Trace options are specific configuration applicable for the trace

Template (hovertemplate) properties of yaxis (suffix, prefix, format and formula) are used to format value to be present on the tooltip

Advanced Options

Tick format properties of yaxis (suffix, prefix, format and formula) are used used to format value to be present on yaxis

2.1 Multiple trace - Different trace type
When more than one trace is present, the user can configure each trace with a chart type from the trace type field in trace option
Example

Trace 1 -> Bar chart
Trace 2 -> Line chart

2.2 Multiple trace - Y axis
Enabled when more than one trace is present, the user can configure yaxis specific configuration

• Title of the yaxis
• Title font color
• Anchor (x | free)
  • Free - When anchoring to axis the position slider is enabled; Position slider lets the user to position yaxis on the chart between (0 and 1). 0 - left most value and 1-right most value
  • x - Default anchoring
• Side (Positioning of the title around the yaxis)
  

2.3 Multiple trace - Template
User can configure template of yaxis per trace using the following configuration options from trace option

• Prefix, format and suffix - Used on hover box
• Formula used on yaxis data
  

2.4 Multiple trace - X attributes
On Multi chart type, the x attributes should have the same domain. Hence the user can add layers which are similar or layers with similar attributes. If an invalid layer is selected a similar error message is displayed on layer selector

2.5 Multiple trace - Delete trace

• When user deletes a trace, the trace information is removed and chart is updated accordingly
• When user deletes trace(s) resulting in only one trace, the delete button on trace is disabled

2.6 Multiple trace - Changing chart type
When user changes the chart type from Multi chart to predefined chart type (Bar or Line)

• When only one trace is present, the chart data is retained during the type change and the traces and trace specific options are hidden (Traces, trace type and template)

  • Ex: One trace with trace type as Line/Bar, the user changes the chart type to Line/Bar/Pie, the data is retained and the chart preview is updated

• When multiple traces are present, changing chart type the data is not retained. And should warn the user about the data loss

2.7 Multiple trace - Filter
Filter is applied per trace. Dependencies to other widgets is to be managed based on the filter/quickfilter accordingly

Mockup

⚠️ Note

The Multi chart type is available and configurable only in the Dashboard widgets for now. Support for in Map viewer will be a future enhancement.
To make this new feature available also in map viewer it is necessary to change the current behavior of layer association from TOC selection or allow to select (eg. from a drop down) additional layers (from the ones available in TOC) in the wizard.