Example of RTL in React Range Selector Component


This sample visualizes the consumer price with Range Navigator and Chart in RTL direction.

More Details...


Right-to-left(RTL) is used to render the component from right to left direction and it can be enabled by setting enableRtl property as true. In this demo, you can see Axis and Data Points are aligned from right to left direction.

Tooltip is enabled in this example, to see the tooltip in action, while the selected range is changed.

Injecting Module

The range navigator component features are segregated into individual feature-wise modules. To use area series, inject the AreaSeries module using the RangeNavigator.Inject(AreaSeries) method.