组件概述
Syncfusion React Range Navigator 是一个数据可视化控件，为大型数据集提供直观的范围选择与导航能力。它以压缩视图展示数据，并配以交互式滑块，允许用户选择特定范围。该组件可与其他控件（如图表和 Data Grid）轻松组合，用于创建丰富的仪表盘。
主要能力
- 多种数据源支持（本地与远程）
- 交互式工具提示与动画
- 轻量模式，面向移动设备
- 周期选择器，提供自定义时间区间
- 多轴与多种系列类型
- 导出为图片格式（PNG、JPEG、SVG、PDF）
使用方式
安装与设置
通过 references/getting-started.md 获取安装步骤，涉及 @syncfusion/ej2-react-charts 包、开发环境搭建（Vite/Create React App）、添加 CSS 样式表与主题、基础实现、模块注入、数据填充与启用工具提示。
数据绑定与数值类型
支持数值类型（默认 Double）、范围配置（minimum、maximum、interval）、数值标签格式（n1、n2、p1、c1、自定义格式）、对数轴（含底数自定义）、DateTime 值类型（时间序列数据）、DateTime 间隔类型（Auto、Years、Quarter、Months、Weeks、Days、Hours、Minutes、Seconds）及标签格式。
系列类型
支持 Line 系列（默认，LineSeries 模块）、Area 系列（AreaSeries 模块）、StepLine 系列（StepLineSeries 模块），每种类型均需模块注入。
定制
通过 navigatorStyleSettings 定制导航器外观，包括选中/未选中区域颜色、滑块定制（Circle/Rectangle 形状、尺寸、边框、填充）、边框定制（宽度、颜色）、延迟更新（性能优化）、allowSnapping（精确选择）、动画时长控制。
周期选择器
配置预定义时间段（period 数组：interval、text、intervalType），注入 PeriodSelector 模块，支持位置（Top 或 Bottom）、高度定制、禁用范围选择器（仅周期选择器模式）及多种间隔类型。
轻量模式
无图表数据的轻量范围导航器，适用于移动端友好实现。
工具提示、标签、网格线与刻度线
- 工具提示：启用/禁用、定制（fill、opacity、textStyle）、标签格式、日期时间格式选项
- 标签：多级标签（DateTime 的 enableGrouping）、按间隔分组、智能标签避免重叠（labelIntersectAction）、标签位置（inside/outside）、样式定制
- 网格线与刻度线：majorGridLines 与 majorTickLines 的宽度、颜色和 dashArray 定制
无障碍与 RTL
支持键盘导航、屏幕阅读器兼容、WCAG 2.0 合规，以及通过 enableRtl 属性启用从右到左布局。
导出与打印
导出为 PNG、JPEG、SVG、PDF 格式，并提供打印功能及相应方法用法。
适用场景
- 金融数据可视化：股票价格分析、交易数据、市场趋势
- 时间序列导航：历史数据探索、日期范围选择
- 大型数据集过滤：高效滚动大量数据集合
- 仪表盘集成：与图表、网格及其他组件组合
- 移动端应用：轻量模式提供简单范围选择 UI
- 多量级数据可视化：使用对数刻度展示跨越多个数量级的数据
关键属性
核心配置包括 valueType（'Double'、'DateTime'、'Logarithmic'）、value（初始选中范围）、minimum、maximum、interval、intervalType。系列配置包括 dataSource、xName、yName、type（'Line'、'Area'、'StepLine'）。外观相关包括 navigatorStyleSettings、navigatorBorder、theme。功能相关包括 tooltip、periodSelectorSettings、enableDeferredUpdate、allowSnapping、enableGrouping、groupBy、labelPosition、enableRtl。
事件
- changed：范围选择变化时触发
- load：渲染前触发
- loaded：渲染后触发
- tooltipRender：工具提示渲染前触发
模块注入要求
Range Navigator 需要为特定功能注入模块，包括 AreaSeries、DateTime、RangeTooltip、PeriodSelector、Logarithmic、LineSeries、StepLineSeries。所有需要的模块应在单个 Inject 组件中注入。
限制
本资料未提供收费、价格、平台兼容性、性能数据或其他未明确列出的使用步骤，相关内容暂未提供。