The range navigator control provides an intuitive interface for selecting a small range from a large collection. It is commonly used in financial dashboards to filter a date range for data that needs to be visualized.
You can plot any type of data in a range navigator using different value types like numeric, date-time, and logarithmic.
You can plot data in the range navigator using line, area and step line series type.
You can skip the chart and show the range alone to select data. This makes the range navigator light weight in mobile devices.
The major and minor scales display the range with different intervals and are placed at multiple levels of the range navigator. The required date-time scale can be configured to be shown in major and minor scales.
You can also select data using predefined periods in the range navigator.
You can bind selected data from the range navigator to any other data visualization control.
Deferred scrolling allows you to defer the selected range to be updated until the user stops dragging the thumbs. This provides a smooth scrolling experience.
The range navigator control provides the following three ways to select a range:
All the elements of the range navigator are highly customizable.
The size, color, font family, font attribute, and alignment of the labels are customizable.
The entire appearance of the left and right thumbs can be customized.
The color, stroke width, dash array, and visibility of the major and minor gridlines are customizable.
Tooltips display the start and end values of a selected range to enable users to select a required range easily.
The range navigator supports right-to-left rendering and allows the series and scale direction to be displayed from the right to left. This improves the user experience and accessibility of RTL languages.