New to Telerik UI for BlazorStart a free 30-day trial

Configures chart panning functionality to enable interactive chart navigation. Allows users to pan (scroll) through chart data by dragging the chart plot area, providing smooth data exploration for large datasets. Supports keyboard modifiers and axis locking to control panning behavior and enhance user experience.

Definition

Constructors

C#
public ChartPannable()

Methods

C#
protected override void BuildRenderTree(RenderTreeBuilder __builder)
Parameters:__builderRenderTreeBuilder

Overrides: ComponentBase.BuildRenderTree(RenderTreeBuilder)

C#
protected override void OnAfterRender(bool firstRender)
Parameters:firstRenderbool

Overrides: ComponentBase.OnAfterRender(bool)

C#
protected override void OnInitialized()

Overrides: DataVizChildComponent.OnInitialized()

C#
protected override void OnParametersSet()

Overrides: ComponentBase.OnParametersSet()

C#
public Dictionary<string, object> Serialize()
Returns:

Dictionary<string, object>

Properties

C#
[Parameter]
public RenderFragment ChildContent { get; set; }

Enables or disables chart panning functionality. When true, users can drag the chart plot area to navigate through data, providing smooth scrolling for large datasets. When false, panning is disabled and the chart remains static. Default behavior depends on chart configuration and data size.

C#
[Parameter]
public bool? Enabled { get; set; }

Specifies the keyboard modifier key that must be pressed to activate panning. Use ChartPannableKey values like Ctrl, Alt, or Shift to prevent accidental panning during other interactions. When set, users must hold the specified key while dragging to pan the chart.

C#
[Parameter]
public ChartPannableKey? Key { get; set; }

Restricts panning to specific chart axes using ChartAxisLock values. Set to prevent panning along certain axes (X, Y, or both) to maintain data context or enforce specific navigation patterns. Useful for time-series charts where only horizontal scrolling is desired.

C#
[Parameter]
public ChartAxisLock? Lock { get; set; }