Skip to content

MudChart: Fix series coloring issue with more than 20 custom colors (#8099)#8117

Merged
henon merged 2 commits intoMudBlazor:devfrom
alanmansour:fix/series-coloring
Feb 6, 2024
Merged

MudChart: Fix series coloring issue with more than 20 custom colors (#8099)#8117
henon merged 2 commits intoMudBlazor:devfrom
alanmansour:fix/series-coloring

Conversation

@alanmansour
Copy link
Contributor

Description

In "MudBlazor/Components/Chart/Charts", the files "Bar.razor", "Donut.razor", "Line.razor", "Pie.razor", and "StackedBar.razor" were modified. The modification was basically changing the operation ChartOptions.ChartPalette.Count() to MudChartParent.ChartOptions.ChartPalette.Count(). MudChartParent allows Bar, Donut, Line, Pie, and StackedBar to access their parent MudChart's properties and methods. When accessing ChartPalette directly through ChartOptions class, then Count() operation will perform counting on the predefined array in "ChartOptions.cs":

string [] ChartPalette = { Colors.Blue.Accent3, Colors.Teal.Accent3, Colors.Amber.Accent3, Colors.Orange.Accent3, Colors.Red.Accent3, Colors.DeepPurple.Accent3, Colors.Green.Accent3, Colors.LightBlue.Accent3, Colors.Teal.Lighten1, Colors.Amber.Lighten1, Colors.Orange.Lighten1, Colors.Red.Lighten1, Colors.DeepPurple.Lighten1, Colors.Green.Lighten1, Colors.LightBlue.Lighten1, Colors.Amber.Darken2, Colors.Orange.Darken2, Colors.Red.Darken2, Colors.DeepPurple.Darken2, Colors.Grey.Darken2 };

The same modification was applied to "Legend.razor" in "MudBlazor/Components/Chart/Parts".

This PR therefore fixes #8099.

How Has This Been Tested?

The fix was tested visually by inspecting few local made examples when running MudBlazor.Docs.Server. The example from this link https://try.mudblazor.com/snippet/GkcyulGAUNIYVebt was also used.

Test example (A stacked bar chart was used with 21 series and 21 colors. The colors have a pattern. Every 3 series have the colors green, blue, and red):
Before (21st bar is green, though it should be red):
image

After (21st bar is red as expected)
image

Before (when specifying one color, while having 20 series)
System.IndexOutOfRangeException: 'Index was outside the bounds of the array.'

After (it succeeds mapping the color specified to all series)
image

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)

Checklist:

  • The PR is submitted to the correct branch (dev).
  • My code follows the code style of this project.
  • I've added relevant tests.

@github-actions github-actions bot added bug Unexpected behavior or functionality not working as intended PR: needs review labels Jan 31, 2024
@ScarletKuro ScarletKuro requested a review from henon January 31, 2024 21:58
@ScarletKuro
Copy link
Member

Hi.
It would be nice to make a bUnit for this if possible.

@henon
Copy link
Contributor

henon commented Feb 1, 2024

Yes please check in the test case that the parent chart palette is used and that the argument exception is not thrown

@codecov
Copy link

codecov bot commented Feb 6, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Comparison is base (90a4ac5) 88.11% compared to head (8cc350c) 88.12%.
Report is 3 commits behind head on dev.

Additional details and impacted files
@@            Coverage Diff             @@
##              dev    #8117      +/-   ##
==========================================
+ Coverage   88.11%   88.12%   +0.01%     
==========================================
  Files         394      394              
  Lines       11760    11760              
  Branches     2384     2384              
==========================================
+ Hits        10362    10364       +2     
  Misses        871      871              
+ Partials      527      525       -2     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@alanmansour
Copy link
Contributor Author

I added the bUnit tests that test the coloring on all charts.

@henon henon merged commit c322e99 into MudBlazor:dev Feb 6, 2024
@henon henon changed the title Chart: Fix series coloring issue which restricted specifying more than 20 custom colors (#8099) MudChart: Fix series coloring issue with more than 20 custom colors (#8099) Feb 6, 2024
@henon
Copy link
Contributor

henon commented Feb 6, 2024

Thanks @Alanocorleo

biegehydra pushed a commit to biegehydra/MudBlazor that referenced this pull request Apr 26, 2024
…Blazor#8099) (MudBlazor#8117)

* Chart: Fix series coloring issue which restricted specifying more than 20 custom colors (MudBlazor#8099)

* Chart: Add bUnit tests to check the coloring of the charts (MudBlazor#8099)

---------

Co-authored-by: APXM <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Unexpected behavior or functionality not working as intended

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Series coloring

3 participants