Preferences

Theme Selection

Theme Modes

Mode Selection

Touch

Mouse

Localization

*Translated by Google Translator.

Currency

HOME

Grids
- Data GridUpdated
- Pivot Table
- Tree GridUpdated
- Spreadsheet
Interactive Chat
- AI AssistViewUpdated
- Chat UIpreview
Data Visualization
- ChartUpdated
- 3D Chart
- 3D Circular Chart
- Stock Chart
- Arc Gauge
- Circular Gauge
- DiagramUpdated
- HeatMap Chart
- Linear Gauge
- Maps
- Range Selector
- Smith Charts
- Barcode
- Sparkline Charts
- TreeMap
- Bullet Chart
- Kanban
Viewer & Editors
- PDF ViewerUpdated
- Rich Text Editor
- Markdown Editor
- Word Processor
- Image Editor
- ChipsUpdated
- Button
- In-place Editor
- Floating Action Button
- SpeedDial
Calendars
- SchedulerUpdated
- Gantt ChartUpdated
- Calendar
- DatePickerUpdated
- DateRangePicker
- DateTimePickerUpdated
- TimePicker
Dropdowns
- AutoComplete
- ComboBox
- Dropdown List
- Dropdown Tree
- MultiSelect Dropdown
- List Box
- MentionUpdated
- MultiColumn ComboBox
Navigation
- Accordion
- AppBar
- Breadcrumb
- Carousel
- Context Menu
- File Manager
- Menu Bar
- Sidebar
- Tabs
- Toolbar
- TreeView
- Ribbon
- Stepper
Notification
- Message
- Badge
- Toast
- Progress Bar
- Skeleton
Inputs
- Textbox
- TextArea
- Input Mask
- Numeric Textbox
- Color Picker
- File Upload
- Range Slider
- Signature
- Rating
- OTP Input
- Speech To Textpreview
Layout
- Avatar
- Card
- Dashboard Layout
- Dialog
- Predefined Dialogs
- ListView
- Tooltip
- Splitter
- Timeline
Forms
- Query Builder
Document Processing Libraries
- Word (DocIO)Updated
- PDFUpdated
- PowerPoint (Presentation)Updated
- Excel (XlsIO)

All Controls

Range Selector
Default
Lightweight
Axis
DateTime
Numeric Axis
Logarithmic Scale
Multi Labels
Period Selector
Default
Stock Chart
Customization
Empty Points
Filter
Export
Print and Export
RTL
RTL

Example of Default in ASP.NET MVC Range Selector Control

Range Selector

Default

This sample visualizes the bitcoin price range with area series in the range navigator. Selected range values are enhanced with tooltip.

Bitcoin (USD) Price Range

In this example, you can see how to render and configure the range navigator with area type series. Tooltip is used to represent selected data value. You can also use selectedRegionColor and unselectedRegionColor properties to customize selected and unselected area in range navigator.