Skip to content

Latest commit

 

History

History
33 lines (25 loc) · 1.22 KB

chart-responsive.md

File metadata and controls

33 lines (25 loc) · 1.22 KB
title description type page_title slug position tags res_type
Responsive Chart
How to adjust the size of a chart when its container or the browser window size changes.
how-to
How to make a responsive chart
chart-kb-responsive
kb

Environment

Product Chart 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