Experiment with producing multiple chart types from same data on one page.

[rouilj]

This is a precursor to a full dashboard configuration for Roundup. The dashboard will not be finished by this team but some exploration can be done.

The first task is to create a dashboard like display using a version on the current chart template.

The idea is to handle multiple values in @charttype and generate a chart using the same data in different forms. e.g. @charttype=bar,horizonalbar,stacked,bar

would display four charts with the same data.

Start with the existing _generic.chart.html by adding a div around the existing embed and use TAL to create a new embed for each comma separated element of @charttype.

The div allows you to target it with css so you can use for example grid or flexbox to lay all the emeds out in a column, or two or more.

Once you have all the embeds working, modify style.css to set up styles that target your div and experiment with different layouts. e.g.

div.small-multiples {
  display: flex;
  flex-wrap: wrap;
  gap: 32px 48px;
}

Also add support for an @chart_class keyword that can be used to select one specific set of styles from the types you added to style.css. So including @chart_class=small-multiples would cause the css example above to be used.

[ashrith-UMB]

Now, we are able to view all the charts possible for the data using "Show All". If we select only one group property and click on Show all, Piechart, Barchart and Horizontal Barchart will show up and when we select multiple group properties, Stacked Barchart and Multi Barchart will show up.

[rouilj]

I think this is on main and can be closed.