Option to reverse render order of datasets

[mkstix6]

[edited] Feature request: option to choose the order stacked areas are drawn.

I have a stacked-filled-line-chart made with Chart.js

✅ The Input Data is alphabetically sorted. ✅ The Legend is alphabetically sorted. ☹️ But the chart itself is sorted top-to-bottom-reverse-alphabetical. …visually this makes the chart and the legend sorted the opposite way to each other.

I would like to reverse the order of the chart's stacked areas without reversing both the data and the legend. I know I can do both these things individually but it just seems silly to have to achieve the result I'm looking for this way.

Thank you for a wonderful charting library.

[benmccann]

The answer you got on StackOverflow is correct. Passing the data in the order you want it to be rendered is the only way to handle this for now

[mkstix6]

Hi @benmccann. Would it be appropriate for me to write up a feature-request or is this a complete no-go. Perhaps an option for sorting the order the areas are stacked in. Default stays like it is now. I don't know how the internal rendering works though 🤷‍♂️.

[mkstix6]

…trying to think of a concrete reason why it renders this way round actually. Do you think it was a choice or perhaps this bottom-to-top rendering is just easier for calculating the cumulative totals. Perhaps a request to reverse the order by default is appropriate?

[simonbrunel]

It's kind of a duplicate of #2399, right? Since this one has been closed long time ago, I'm reopening this one to keep track of that feature. IMO, we should add support for dataset sorting, maybe via a new order option. That's something I referred to in this comment, initially via the weight option.

Actually, the dataset order would allow to easily change the drawing/stacking order but would also impact the order in the legend, so I'm not sure it would solve your issue.

@mkstix6 no need to create a new ticket but instead can you please edit the description of this one as a feature request?

[mkstix6]

@simonbrunel Thanks. I've made an edit. How's that looking?

[jan-tosovsky-cz]

It sounds like duplicate of #4161

[mkstix6]

It sounds like duplicate of #4161

Yes it sounds like the same issue for different chart types. I don't know enough about the under-the-hood parts myself but if this can be solved for both chart types in one go that would be super.

[pierreben]

As  dataset.order also has an impact on the legends ordering the solution for the original need would be to use the order attribute on the dataset, combined with a specific sort on the legend plugin option in the generateLabels function :

Something like :

    options: {
      plugins: {
        legend: {
          labels: {
            generateLabels: function(chart) {
              const legendItems = Chart.defaults.plugins.legend.labels.generateLabels(chart);
              legendItems.sort((a, b) => a.text.localeCompare(b.text));
              return legendItems;
            }
          }
        }
      }
    }