Responsive Chart
Environment
Product | Charts for Blazor |
Description
When the user resizes the browser window or some layout change happens (for example, a navigation panel is expanded or collapsed), you may want to have the charts redraw with the new dimensions.
Solution
Generally, the Width
and Height
parameters of the chart can take values in %
, and the chart will render according to the dimensions of its parent element.
This works well for the initial rendering and the chart will be "responsive" immediately according to your layout, regardless of the display (desktop, tablet, phone).
When the layout changes dynamically at runtime, you have to call its .Refresh()
method. You can find an example in the following sample project: https://github.com/telerik/blazor-ui/tree/master/chart/responsive-chart