[charts] Introduce the notion of series with positions #20461

alexfauquette · 2025-11-26T13:21:27Z

Alternative to #20437

I made alexfauquette#14 to illustrate how it will simplify future feature

mui-bot · 2025-11-26T13:22:56Z

Deploy preview: https://deploy-preview-20461--material-ui-x.netlify.app/

Bundle size report

Bundle	Parsed size	Gzip size
@mui/x-data-grid	0B^(0.00%)	0B^(0.00%)
@mui/x-data-grid-pro	0B^(0.00%)	0B^(0.00%)
@mui/x-data-grid-premium	0B^(0.00%)	0B^(0.00%)
@mui/x-charts	🔺+242B^(+0.07%)	🔺+87B^(+0.09%)
@mui/x-charts-pro	🔺+435B^(+0.10%)	🔺+217B^(+0.16%)
@mui/x-charts-premium	🔺+242B^(+0.05%)	🔺+95B^(+0.07%)
@mui/x-date-pickers	0B^(0.00%)	0B^(0.00%)
@mui/x-date-pickers-pro	0B^(0.00%)	0B^(0.00%)
@mui/x-tree-view	0B^(0.00%)	0B^(0.00%)
@mui/x-tree-view-pro	0B^(0.00%)	0B^(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against 929faf2

codspeed-hq · 2025-11-26T16:17:41Z

CodSpeed Performance Report

Merging #20461 will not alter performance

_{Comparing alexfauquette:series-selectors (929faf2) with master (c70878f)¹}

Summary

✅ 13 untouched

No successful run was found on master (3984429) during the generation of this report, so c70878f was used instead as the comparison base. There might be some changes unrelated to this pull request in this report. ↩

bernardobelchior

IMO, this approach looks cleaner, especially if we go with seriesLayout only containing the layout instead of the whole series.

One weird thing is that the layout won't be present for all series. I wonder if we should abstract getting an item's position somehow so that we can provide a getter and avoid calculating the whole layout for all charts. In a sankey chart, it would do the layout and find the item, returning its position, but in other charts it would call the axis scales to find its position.

bernardobelchior · 2025-11-27T13:54:56Z

packages/x-charts-pro/src/SankeyChart/seriesConfig/index.ts

+    ...series,
+    series: {
+      [series.seriesOrder[0]]: {
+        ...series.series[series.seriesOrder[0]],


We already have the series in the seriesProcessor. Would it make sense to seriesPositions to only return the positions?

Otherwise we're spreading the series again unnecessarily.

Done.

I still return an object { sankeyLayout: (...) } instead of directly the layout.
My idea is to be able to add extra parameters latter if we need something

bernardobelchior · 2025-11-27T14:14:39Z

packages/x-charts/src/models/seriesType/config.ts

      >;
    };
    series: DefaultizedPieSeriesType;
+    seriesComputedPosition: {};


I wonder we should call this seriesLayout to be shorter.

I renamed most of those with "layout"

JCQuintas

I was thinking of moving the layout logic to the sankey selectors, but @alexfauquette pointed out that for the tooltip position a generic selector with the position would be better instead.

packages/x-charts/src/internals/plugins/corePlugins/useChartSeries/processSeries.ts

alexfauquette · 2025-11-27T14:57:01Z

One weird thing is that the layout won't be present for all series. I wonder if we should abstract getting an item's position somehow so that we can provide a getter and avoid calculating the whole layout for all charts.

That could effectively be interesting. It would create a big selector depending on

processed series
drawing area
cartesian axes
polar axes

It would basically replace hooks like the useBarPlotData()

I'm doing the modification to add layout for the sankey, such that we could latter add support for other series if needed

packages/x-charts-pro/src/hooks/useSankeySeries.ts

alexfauquette · 2025-11-27T16:31:25Z

packages/x-charts-pro/src/typeOverloads/modules.ts

+      seriesLayout: {
+        sankeyLayout: SankeyLayout;
+      };


I prefered this one instead of

seriesLayout: SankeyLayout;

yo ba able to add other layout if needed later

This is internal, so we could have gone for the simpler solution, I think, but this doesn't look bad either.

alexfauquette · 2025-11-27T16:32:46Z

packages/x-charts/src/internals/seriesSelectorOfType.ts

    ids?: SeriesId | SeriesId[],
  ) => {
-    if (!ids || (Array.isArray(ids) && ids.length === 0)) {
+    if (ids === undefined || (Array.isArray(ids) && ids.length === 0)) {


Edge case to support the case of a series with id set to an empty string.

packages/x-charts-pro/src/hooks/useSankeySeries.ts

Signed-off-by: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com>

bernardobelchior · 2025-11-28T08:35:14Z

packages/x-charts-pro/src/typeOverloads/modules.ts

+      seriesLayout: {
+        sankeyLayout: SankeyLayout;
+      };


This is internal, so we could have gone for the simpler solution, I think, but this doesn't look bad either.

bernardobelchior · 2025-11-28T09:03:54Z

packages/x-charts/src/internals/plugins/corePlugins/useChartSeries/processSeries.ts

+  (Object.keys(processedSeries) as TSeriesType[]).forEach((type) => {
+    const processor = seriesConfig[type]?.seriesLayout;
+    if (processor !== undefined) {
+      const newValue = processor(processedSeries[type] as any, drawingArea);
+
+      if (newValue && newValue !== processedSeries[type]) {
+        processingDetected = true;
+        (seriesLayout as any)[type] = newValue;
+      }
+    }
+  });


From my tests, we can remove as any by doing this:

Suggested change

(Object.keys(processedSeries) as TSeriesType[]).forEach((type) => {

const processor = seriesConfig[type]?.seriesLayout;

if (processor !== undefined) {

const newValue = processor(processedSeries[type] as any, drawingArea);

if (newValue && newValue !== processedSeries[type]) {

processingDetected = true;

(seriesLayout as any)[type] = newValue;

}

}

});

(Object.keys(processedSeries) as TSeriesType[]).forEach((type) => {

const processor = seriesConfig[type]?.seriesLayout;

const thisSeries = processedSeries[type];

if (processor !== undefined && thisSeries !== undefined) {

const newValue = processor(thisSeries, drawingArea);

if (newValue && newValue !== processedSeries[type]) {

processingDetected = true;

seriesLayout[type] = newValue;

}

}

});

Thanks, That let me totice some other as was useless

…o series-selectors

Signed-off-by: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com>

[charts] Introduce the notion of series with positions

1678e79

alexfauquette mentioned this pull request Nov 26, 2025

[charts-pro] Add support for anchor="node" on Sankey tooltip #20462

Merged

alexfauquette marked this pull request as ready for review November 26, 2025 13:53

alexfauquette requested review from JCQuintas and bernardobelchior as code owners November 26, 2025 13:53

zannager added the scope: charts Changes related to the charts. label Nov 26, 2025

bernardobelchior reviewed Nov 27, 2025

View reviewed changes

JCQuintas approved these changes Nov 27, 2025

View reviewed changes

JCQuintas reviewed Nov 27, 2025

View reviewed changes

packages/x-charts/src/internals/plugins/corePlugins/useChartSeries/processSeries.ts Outdated Show resolved Hide resolved

alexfauquette added 2 commits November 27, 2025 15:58

renaming

7f018ab

renaming

3096163

alexfauquette added the type: enhancement It’s an improvement, but we can’t make up our mind whether it's a bug fix or a new feature. label Nov 27, 2025

alexfauquette commented Nov 27, 2025

View reviewed changes

packages/x-charts-pro/src/hooks/useSankeySeries.ts Outdated Show resolved Hide resolved

alexfauquette commented Nov 27, 2025

View reviewed changes

fix

a6225f4

alexfauquette force-pushed the series-selectors branch from 684f49c to a6225f4 Compare November 27, 2025 17:13

alexfauquette requested a review from bernardobelchior November 28, 2025 08:00

alexfauquette commented Nov 28, 2025

View reviewed changes

packages/x-charts-pro/src/hooks/useSankeySeries.ts Outdated Show resolved Hide resolved

Update packages/x-charts-pro/src/hooks/useSankeySeries.ts

3dff78c

Signed-off-by: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com>

bernardobelchior reviewed Nov 28, 2025

View reviewed changes

alexfauquette added 2 commits November 28, 2025 10:55

remove typescript "as"

8531d4e

Merge branch 'series-selectors' of github.com:alexfauquette/mui-x int…

929faf2

…o series-selectors

alexfauquette merged commit 8acbe5b into mui:master Nov 28, 2025
22 checks passed

A-s-h-o-k pushed a commit to A-s-h-o-k/mui-x that referenced this pull request Dec 14, 2025

[charts] Introduce the notion of series with positions (mui#20461)

1c26ae1

Signed-off-by: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com>

mapache-salvaje pushed a commit to mapache-salvaje/mui-x that referenced this pull request Dec 29, 2025

[charts] Introduce the notion of series with positions (mui#20461)

5a47b53

Signed-off-by: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com>

Uh oh!

[charts] Introduce the notion of series with positions #20461

[charts] Introduce the notion of series with positions #20461

Uh oh!

Conversation

alexfauquette commented Nov 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

mui-bot commented Nov 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Bundle size report

Uh oh!

codspeed-hq bot commented Nov 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Merging #20461 will not alter performance

Summary

Footnotes

Uh oh!

bernardobelchior left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

JCQuintas left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

alexfauquette commented Nov 27, 2025

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

alexfauquette commented Nov 26, 2025 •

edited

Loading

mui-bot commented Nov 26, 2025 •

edited

Loading

codspeed-hq bot commented Nov 26, 2025 •

edited

Loading