feat(stack by dimension): add a stack by dimension dropdown list #32707

jpchev · 2025-03-17T19:55:10Z

SUMMARY

feature for bar chart, to stack by dimension, see
#32496

basically, this is a new option to let users select a dimension to 'stack by', see the video here

stackByDimension.mp4

the dimension to 'stack by' can be selected between the dimensions defined by the user, in the Customize tab

fixes: #32496

korbit-ai

Review by Korbit AI

Korbit automatically attempts to detect when you fix issues in new commits.

Category	Issue	Fix Detected
	Missing conditional visibility for stack dimension control ▹ view	✅
	Redundant shouldMapStateToProps Function ▹ view	✅
	Incorrect Operator Precedence in Dimension Index Calculation ▹ view	✅

Files scanned

File Path	Reviewed
superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/constants.ts	✅
superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/types.ts	✅
superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx	✅
superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts	✅

Explore our documentation to understand the languages and file types we support and the files we ignore.

Need a new review? Comment /korbit-review on this PR and I'll review your latest changes.

Korbit Guide: Usage and Customization

Interacting with Korbit

You can manually ask Korbit to review your PR using the /korbit-review command in a comment at the root of your PR.

You can ask Korbit to generate a new PR description using the /korbit-generate-pr-description command in any comment on your PR.

Too many Korbit comments? I can resolve all my comment threads if you use the /korbit-resolve command in any comment on your PR.

On any given comment that Korbit raises on your pull request, you can have a discussion with Korbit by replying to the comment.

Help train Korbit to improve your reviews by giving a 👍 or 👎 on the comments Korbit posts.

Customizing Korbit

Check out our docs on how you can make Korbit work best for you and your team.

Customize Korbit for your organization through the Korbit Console.

Feedback and Support

Tell us what you think of Korbit

Schedule a call with our team

Email us @ [email protected]

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts

+    const idxSelectedDimension = formData.metrics.length > 1 ? 1 : 0 
+      + chartProps.rawFormData.groupby.indexOf(stackdimension);


superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx

villebro · 2025-03-17T20:37:18Z

@jpchev please add a comprehensive description + screens to this PR so reviewers can first validate the design, and then look at the implementation details. I know these may be covered by the linked GH Issue, but the discussion is pretty lengthy. I think the feature is great, but I feel we need to be very careful of how this is implemented to ensure we don't pile on technical/design debt that will be difficult to clean up later.

rusackas · 2025-03-17T21:35:57Z

This is looking cool!

Do you need to add the "Stack by" dimension to the "Dimensions" input? If so, this works fine as-is.

If you don't, I'd be still be happy with:
• Renaming "Dimension" to "Split By"
• Moving the "Stack By" to the main control panel
• Killing the checkbox

... but if that entails a lot of work (which it might) then I still like this improvement :)

jpchev · 2025-03-17T23:30:28Z

@villebro I added a description for this PR

michael-s-molina · 2025-03-18T17:19:55Z

How is this going to interact with the Stack control that already exists?

sadpandajoe · 2025-03-18T17:21:08Z

I'm a little bit confused about this since not everything is stacked according to your video. Is this more of a group by dimension or something?

villebro · 2025-03-18T17:22:29Z

@jpchev I reviewed the video and in general I think this is an elegant and backwards compatible solution to the problem 👍 I will review in more detail in the coming days.

jpchev · 2025-03-18T17:24:14Z

How is this going to interact with the Stack control that already exists?

as far as I understand, the new feature has no interaction with the existing stack control

jpchev · 2025-03-18T17:26:18Z

I'm a little bit confused about this since not everything is stacked according to your video. Is this more of a group by dimension or something?

yes, this is a sort of 'group by', but it's called 'stack' in the Apache Echarts vocabulary (see https://echarts.apache.org/handbook/en/how-to/chart-types/bar/stacked-bar/).
Actually the feature propagates a 'stack' parameter in the underlying Echarts component

michael-s-molina · 2025-03-18T17:34:30Z

Wouldn't be better to offer a control to define how things are stacked AFTER you set Stacked Style to Stack? Right now, it find really confusing that we have 2 controls for stacking.

jpchev · 2025-03-18T17:37:02Z

Wouldn't be better to offer a control to define how things are stacked AFTER you set Stacked Style to Stack? Right now, it find really confusing that we have 2 controls for stacking.

I don't know, what is the existing stack doing?

michael-s-molina · 2025-03-18T17:43:25Z

I don't know, what is the existing stack doing?

It's stacking the bars under a common name. That's why all bars appear in the same stacking group. It seems you're trying to offer a way to modify this logic and that's why I think they are related.

jpchev · 2025-03-20T08:41:19Z

I don't know, what is the existing stack doing?

It's stacking the bars under a common name. That's why all bars appear in the same stacking group. It seems you're trying to offer a way to modify this logic and that's why I think they are related.

yes, they are probably related and I think that the existing stack feature should become a particular case of a broader feature which should let user stack by a label in each series. This label would work as a group by criteria, as it is implemented in Apache Echarts

b4s36t4 · 2025-03-25T06:43:12Z

Hi, @jpchev. I'm trying to implement the stacked chart as you did above for the below dataset.

id,sprint,stories,p0_issues,p1_p2_issues,effieciency
1,2023#07,24,1,5,4
7,2023#06,25,4,10,1.785714286
2,2023#05,26,4,12,1.625
3,2023#04,26,8,20,0.7878787879
4,2023#03,22,10,30,0.55
5,2023#02,23,9,40,0.4693877551
6,2023#01,21,15,28,0.488372093

Can you help me understand by giving a demo for this, I'm not able to build the chart for the dataset as you did.
You can hit me @b4s36t4 in discord or telegram we can take things over there. Thanks for the help!

jpchev · 2025-03-25T09:10:08Z

Hi, @jpchev. I'm trying to implement the stacked chart as you did above for the below dataset.
id,sprint,stories,p0_issues,p1_p2_issues,effieciency
1,2023#07,24,1,5,4
7,2023#06,25,4,10,1.785714286
2,2023#05,26,4,12,1.625
3,2023#04,26,8,20,0.7878787879
4,2023#03,22,10,30,0.55
5,2023#02,23,9,40,0.4693877551
6,2023#01,21,15,28,0.488372093
Can you help me understand by giving a demo for this, I'm not able to build the chart for the dataset as you did. You can hit me @b4s36t4 in discord or telegram we can take things over there. Thanks for the help!

hello,
if you want to stack together p0_issues and p1_p2_issues, and keep 'stories' in a separate stack, in order to use my approach you can change your dataset (you can always modify your SQL query) like the following dataset (I put only the data for the sprint '2023#07'): getting one row per measure, measures types are stored in the 'type' column and their values are in the 'val' column. The the 'cat' column lets you separate the stacks, and that's the dimension you can stack by.

id,    sprint,           cat,       type,                 no,
1,      2023#07,         S1,         stories,             24
1,      2023#07,         S2,         p0_issues,           1
1,      2023#07,         S2,         p1_p2_issues,        5
1,      2023#07,         S3,         efficiency,          4

jpchev · 2025-04-16T11:16:45Z

@kgabryje @michael-s-molina @rusackas I've removed the checkbox and bound the visibility of the "dimension to stack by" dropdown to the value "Stack" of the existing "Stacked style" control.

Can you please have a look?

github-actions · 2025-04-16T11:22:18Z

@michael-s-molina Processing your ephemeral environment request here. Action: up. More information on how to use or configure ephemeral environments

github-actions · 2025-04-16T11:33:54Z

@michael-s-molina Ephemeral environment spinning up at http://35.167.64.30:8080. Credentials are 'admin'/'admin'. Please allow several minutes for bootstrapping and startup.

rusackas · 2025-04-18T16:25:46Z

Added a test chart here. Controls look a lot cleaner with the conditional rendering now, thank you! Seems to work well in both vertical and horizontal mode. I still feel the dimension added to "Stack by" feels more like a "Split by" or "Create Stacks for" but again, maybe it's just me expecting "Stack by" to be the dimension that IS stacked. I think the tooltip does help explain the situation, though.

jpchev · 2025-04-22T08:38:27Z

Added a test chart here. Controls look a lot cleaner with the conditional rendering now, thank you! Seems to work well in both vertical and horizontal mode. I still feel the dimension added to "Stack by" feels more like a "Split by" or "Create Stacks for" but again, maybe it's just me expecting "Stack by" to be the dimension that IS stacked. I think the tooltip does help explain the situation, though.

Good, thanks for reviewing, can we consider having the feature merged? I can change the labels if that's better (replace "Stack by")

jpchev · 2025-04-25T16:30:08Z

@rusackas I replaced "Dimension to stack by" with "Dimension to split by", is that better?

jpchev · 2025-05-06T14:02:26Z

@rusackas @michael-s-molina @villebro any update on this feature?

jpchev · 2025-05-22T08:36:13Z

is this feature considered as abandoned or not relevant anymore? @rusackas @michael-s-molina @villebro

michael-s-molina · 2025-05-22T12:09:18Z

Thanks for the patience @jpchev but as you can imagine, we receive many review requests. I pulled your branch and it looks good.

Can you remove the package-lock.json changes?
I believe a better name for the control would be Split stack by.

I can approve and merge the PR with these changes.

michael-s-molina · 2025-05-22T13:17:27Z

@jpchev You deleted the package-lock.json file but I meant to just delete the changes.

jpchev · 2025-05-22T13:35:59Z

@michael-s-molina I've restored the package-lock.json without my changes
and renamed the control to "Split stack by"

thank you

michael-s-molina

Thank you for the improvement, for addressing the comments, and for the patience @jpchev!

jpchev · 2025-05-22T13:55:54Z

thank you, I'm very happy and it creates huge value for me

…che#32707) Co-authored-by: CAPELLI Giampaolo <[email protected]>

…che#32707) Co-authored-by: CAPELLI Giampaolo <[email protected]> (cherry picked from commit 5b2f1bb)

stack by dimension

94584fa

pull-request-size bot added the size/M label Mar 17, 2025

github-actions bot added the plugins label Mar 17, 2025

dosubot bot added the viz:charts:bar Related to the Bar chart label Mar 17, 2025

korbit-ai bot reviewed Mar 17, 2025

View reviewed changes

fixes korbit-ai

adb4742

jpchev changed the title ~~stack by dimension~~ feat(stack by dimension): add a stack by dimension dropdown list Mar 17, 2025

fixes korbit-ai

9221dd0

jpchev mentioned this pull request Mar 17, 2025

Feature request: stacked grouped mixed chart #32496

Open

fixes lint

0b821c9

jpchev added 5 commits March 17, 2025 22:50

fixes lint

2c0cb8d

fixes lint

6c8d54e

fixes lint

f960f12

fixes lintush

eb1d571

fixes lintush

ea6d28f

sadpandajoe requested a review from villebro March 25, 2025 15:59

github-actions bot added the dependencies:npm label Apr 16, 2025

CAPELLI Giampaolo added 3 commits April 16, 2025 11:53

prettier

a304159

prettier

7028093

prettier

51f9e4b

michael-s-molina added testenv-up and removed testenv-up labels Apr 16, 2025

replaced title

beaa5a2

jpchev force-pushed the feature/stack branch from 669301e to beaa5a2 Compare May 22, 2025 13:31

Merge branch 'apache:master' into feature/stack

7b966d5

github-actions bot removed the dependencies:npm label May 22, 2025

Update controlPanel.tsx

8b38351

michael-s-molina approved these changes May 22, 2025

View reviewed changes

michael-s-molina merged commit 5b2f1bb into apache:master May 22, 2025
53 checks passed

jpchev deleted the feature/stack branch May 23, 2025 12:12

LevisNgigi pushed a commit to LevisNgigi/superset that referenced this pull request Jun 18, 2025

feat(stack by dimension): add a stack by dimension dropdown list (apa…

28480d4

…che#32707) Co-authored-by: CAPELLI Giampaolo <[email protected]>

alexandrusoare pushed a commit to alexandrusoare/superset that referenced this pull request Jun 19, 2025

feat(stack by dimension): add a stack by dimension dropdown list (apa…

8246b46

…che#32707) Co-authored-by: CAPELLI Giampaolo <[email protected]> (cherry picked from commit 5b2f1bb)

rusackas mentioned this pull request Jun 24, 2025

Show value on stacked bar chart is incorrect #33882

Open

3 tasks

sadpandajoe removed the testenv-up label Jun 25, 2025

		const idxSelectedDimension = formData.metrics.length > 1 ? 1 : 0
		+ chartProps.rawFormData.groupby.indexOf(stackdimension);

feat(stack by dimension): add a stack by dimension dropdown list #32707

feat(stack by dimension): add a stack by dimension dropdown list #32707

Uh oh!

Conversation

jpchev commented Mar 17, 2025 • edited by sadpandajoe Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

SUMMARY

Uh oh!

korbit-ai bot left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Review by Korbit AI

Korbit automatically attempts to detect when you fix issues in new commits.

Interacting with Korbit

Customizing Korbit

Feedback and Support

Uh oh!

This comment was marked as resolved.

Uh oh!

Uh oh!

Uh oh!

villebro commented Mar 17, 2025

Uh oh!

rusackas commented Mar 17, 2025

Uh oh!

jpchev commented Mar 17, 2025

Uh oh!

michael-s-molina commented Mar 18, 2025

Uh oh!

sadpandajoe commented Mar 18, 2025

Uh oh!

villebro commented Mar 18, 2025

Uh oh!

jpchev commented Mar 18, 2025

Uh oh!

jpchev commented Mar 18, 2025

Uh oh!

michael-s-molina commented Mar 18, 2025

Uh oh!

jpchev commented Mar 18, 2025

Uh oh!

michael-s-molina commented Mar 18, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jpchev commented Mar 20, 2025

Uh oh!

b4s36t4 commented Mar 25, 2025

Uh oh!

jpchev commented Mar 25, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jpchev commented Apr 16, 2025

Uh oh!

github-actions bot commented Apr 16, 2025

Uh oh!

github-actions bot commented Apr 16, 2025

Uh oh!

rusackas commented Apr 18, 2025

Uh oh!

jpchev commented Apr 22, 2025

Uh oh!

jpchev commented Apr 25, 2025

Uh oh!

jpchev commented May 6, 2025

Uh oh!

jpchev commented May 22, 2025

Uh oh!

michael-s-molina commented May 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

michael-s-molina commented May 22, 2025

Uh oh!

jpchev commented May 22, 2025

Uh oh!

michael-s-molina left a comment

Choose a reason for hiding this comment

Uh oh!

jpchev commented May 22, 2025

Uh oh!

Uh oh!

jpchev commented Mar 17, 2025 •

edited by sadpandajoe

Loading

korbit-ai bot left a comment •

edited

Loading

michael-s-molina commented Mar 18, 2025 •

edited

Loading

jpchev commented Mar 25, 2025 •

edited

Loading

michael-s-molina commented May 22, 2025 •

edited

Loading