ChartJs.Blazor icon indicating copy to clipboard operation
ChartJs.Blazor copied to clipboard

Support for stacked line charts

Open dfederm opened this issue 5 years ago • 2 comments

Describe the feature request

Add support for a stacked line chart

Which charts does this feature request apply to?

Line/Time

Describe the solution you'd like

The ability to set stacked: true for the y axis

JavaScript equivalent

var stackedLine = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        scales: {
            yAxes: [{
                stacked: true
            }]
        }
    }
});

Describe alternatives you've considered

See first comment below

Additional context

Docs are at the very bottom of this page: https://www.chartjs.org/docs/latest/charts/line.html

dfederm avatar Apr 20 '20 21:04 dfederm

Thanks for contacting us. I appreciate the well-written issue :)

We should add this feature, nothing to debate there.

How to implement:

  • The Stacked property will be added to CartesianAxis since it can be used for any bar and line axis. It will also be removed from the bar extension axes.
  • Add summaries indicating the behaviour for both bar and line axis. We could also try to make the property virtual in the base class and override it in the line and bar axes respectively with adjusted summaries but that leads to redundancy in both code and summaries.

Workaround / alternative

Just create a sub class of the axis you want to use e.g. StackedLinearCartesianAxis : LinearCartesianAxis. Then add the Stacked property (type bool) to your class and use that instead of the original one when creating your config.
Let me know if that works as a temporary solution @dfederm.

Joelius300 avatar Apr 21 '20 06:04 Joelius300

@Joelius300 thanks that workaround worked great. I didn't realize these objects were just straight up serialized and used directly as the js config objects.

dfederm avatar Apr 21 '20 14:04 dfederm