Skip to content

Miss alignment in grouped stacked bard #48

@BuddhaCodes

Description

@BuddhaCodes

Hello there, I want to create a grouped/stacked Chart, similar to this one https://www.chartjs.org/docs/latest/samples/bar/stacked-groups.html when I emulate the configuration, I get the following result.
act

This is the configuration and the dataset I use
`_configBar5 = new BarChartConfig()
{
Options = new Options()
{
Interaction = new ()
{
Intersect = false
},
Plugins = new Plugins()
{
Title = new Title()
{
Display = true,
Text = "Population growth (millions)",
Font = new Font()
{
Size = 18
}
}
},
Scales = new Dictionary<string, Axis>()
{
{
Scales.XAxisId, new Axis()
{
//Stacked = true,
BeginAtZero = true,
}
},
{
Scales.YAxisId, new Axis()
{
Stacked = true,
BeginAtZero = true,
}
}
},
}
};

    _configBar5.Data.Labels.AddRange(Labels);

    List<decimal?> Grouped1 = new List<decimal?>() { 133, 221, 783, 2478 };
    List<decimal?> Grouped2 = new List<decimal?>() { 408, 547, 675, 734 };

    _configBar5.Data.Datasets.Add(new BarDataset()
        {
            Stack = new() {"One"},
            Type = "bar",
            Label = "Africa",
            Data = Grouped1,
            BackgroundColor = new List<string>() { "#3e95cd" }
        });

    _configBar5.Data.Datasets.Add(new BarDataset()
    {
        Stack = new() { "One" },
        Label = "India",
            Type = "bar",
            Data = Grouped2,
        BackgroundColor = new List<string>() { "#8e5eff" }
    });

    _configBar5.Data.Datasets.Add(new BarDataset()
        {
            Stack = new() { "Two" },
            Label = "Europe",
            Type = "bar",
            Data = Grouped1,
            BackgroundColor = new List<string>() { "#8e5ea2" }
        });`

Metadata

Metadata

Assignees

Labels

No labels
No labels

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions