mariusmuntean / ChartJs.Blazor

Brings Chart.js charts to Blazor
https://www.iheartblazor.com/
MIT License
676 stars 151 forks source link

Is it possible to display legend in another place ? #138

Closed win32nipuh closed 3 years ago

win32nipuh commented 3 years ago

For example https://www.iheartblazor.com/PieChart there are 4 labels only. They are located in the center of page.

I have 24 labels. Is it possible to place the legend to the right bottom ? Or somehow to change the existing layout?

SeppPenner commented 3 years ago

From https://www.chartjs.org/docs/latest/configuration/legend.html#position might help you there. So, basically, you should be able to set the following positions:

In the library, you should be able to set Legend.Position (Check https://github.com/mariusmuntean/ChartJs.Blazor/blob/master/src/ChartJs.Blazor/ChartJS/Common/Properties/Legend.cs).

_config = new PieConfig
        {
            Options = new PieOptions
            {
                Legend = new Legend
                {
                    Position = Position.Bottom
                }
            }
        };

The example from https://www.iheartblazor.com/PieChart is located under https://github.com/mariusmuntean/ChartJs.Blazor/blob/master/samples/Shared/ChartJs.Blazor.Sample.Shared/Components/PieChartComponent.razor.

It's not possible to place the legend on the right bottom as far as I know. (Well, not easily at least).

Joelius300 commented 3 years ago

Thank you @SeppPenner.

Nothing to add to his great comment except that we're sorry for the lack of documentation currently available.