关于 syncfusion-maui-toolkit-cartesian-charts
面向 .NET MAUI 开发者的 Syncfusion SfCartesianChart 可视化指南,介绍图表类型、数据绑定、坐标轴、交互、定制和导出。
主要功能
- 0120 多种图表类型
- 02类别、数值、日期时间和对数坐标轴
- 03缩放、平移、选择和轨迹球
- 04标签、图例、注释和绘图区间
- 05图像导出与本地化
适用场景
- 01可视化时间序列数据
- 02展示金融或统计数据
- 03比较多个数据集
- 04构建交互式数据仪表板
安装
复制下面的命令,在终端中运行。
npx skills add https:/ / github.com/ syncfusion/ maui-toolkit-ui-components-skills --skill syncfusion-maui-toolkit-cartesian-charts安装后在 Claude Code 中输入/syncfusion-maui-toolkit-cartesian-charts确认已加载。
包含的文件
除 SKILL.md 外,安装时一起下载的参考资料和脚本。
references/advanced-chart-types.mdannotations-and-plotbands.mdaxis-configuration.mdaxis-customization.mdbasic-chart-types.mdcustomization-and-styling.mddata-handling.mddata-labels.mdexporting-and-localization.mdfinancial-charts.mdgetting-started.mdlegend-and-appearance.mdrange-charts.mdselection.mdstacked-charts.mdstatistical-charts.mdtooltips-and-interaction.mdzooming-and-panning.md详细介绍
实现 .NET MAUI 笛卡尔图表
指导用户实现 Syncfusion .NET MAUI 笛卡尔图表(SfCartesianChart)。它是一套全面的数据可视化解决方案,支持 20 多种图表类型、交互功能和丰富的自定义选项。使用此技能可实现从简单折线图到复杂金融和统计可视化的各种图表。
何时使用此技能
在用户需要以下功能时使用此技能:
- 可视化数据: 使用折线图、面积图、柱形图、条形图或散点图显示定量数据
- 金融分析: 创建蜡烛图或 OHLC 图表来可视化股票价格
- 统计数据: 绘制箱线图、直方图或误差线图
- 对比分析: 使用堆积图(面积图、柱形图、折线图)比较多个数据集
- 范围可视化: 使用范围面积图或范围柱形图显示最高值和最低值数据
- 交互式仪表板: 实现缩放、平移、选择和轨迹球功能
- 时间序列数据: 使用日期时间轴绘制时间数据,并支持自动滚动
- 自定义可视化: 添加注释、绘图区带和自定义样式
组件概览
SfCartesianChart 控件提供:
- 20 多种图表类型: 折线图、面积图、柱形图、条形图、散点图、气泡图、蜡烛图、OHLC 图、直方图、箱线图、各种堆积图、范围图、瀑布图等
- 灵活的坐标轴: 类别轴、数值轴、日期时间轴、对数轴,均支持全面自定义
- 交互功能: 缩放、平移、选择、工具提示、轨迹球
- 丰富的自定义选项: 数据标签、图例、注释、绘图区带和外观
- 数据处理: 空数据点模式、数据绑定、动态更新
- 导出和本地化: 图像导出、多语言支持
文档与导航指南
入门
📄 阅读: references/getting-started.md
- NuGet 包安装(
Syncfusion.Maui.Toolkit) - 在 XAML 和 C# 中初始化基本的 SfCartesianChart
- 创建数据模型和视图模型
- 设置坐标轴(XAxes、YAxes)
- 使用数据绑定添加第一个系列
- 完整的可运行示例
图表类型
基本图表类型
📄 阅读: references/basic-chart-types.md
- 折线图、面积图、柱形图、条形图、散点图、气泡图
- 各种图表类型的适用场景
- 实现示例
- 常用属性和样式
金融图表
📄 阅读: references/financial-charts.md
- 蜡烛图(蜡烛图可视化)
- OHLC(开盘价-最高价-最低价-收盘价)图表
- 金融数据结构和绑定
- 看涨/看跌样式
统计图表
📄 阅读: references/statistical-charts.md
- 箱线图
- 直方图
- 误差线图
- 统计数据要求
堆积图表
📄 阅读: references/stacked-charts.md
- 堆积面积图(普通和 100%)
- 堆积柱形图(普通和 100%)
- 堆积折线图(普通和 100%)
- 对系列进行分组以实现堆积
- 百分比值与绝对值
范围图表
📄 阅读: references/range-charts.md
- 范围面积图
- 范围柱形图
- 样条范围面积图
- 最高值和最低值数据绑定
高级图表类型
📄 阅读: references/advanced-chart-types.md
- Fastline(针对大型数据集优化)
- 阶梯面积图和阶梯折线图
- 瀑布图
- 性能注意事项
坐标轴配置
坐标轴基础
📄 阅读: references/axis-configuration.md
- 坐标轴类型(类别轴、数值轴、日期时间轴、对数轴)
- XAxes 和 YAxes 集合
- 坐标轴标签和格式设置
- 坐标轴标题
- 多坐标轴设置
- 自定义标签
坐标轴自定义
📄 阅读: references/axis-customization.md
- 网格线(主要、次要)样式
- 刻度线配置
- 坐标轴内边距
- 范围内边距
- 自动滚动增量
- 坐标轴位置
数据可视化与交互
数据标签
📄 阅读: references/data-labels.md
- 启用和定位数据标签
- 标签位置(内部、外部、自动)
- 标签格式和模板
- 样式与外观
- 发布模式显示配置
工具提示与交互功能
📄 阅读: references/tooltips-and-interaction.md
- 工具提示配置与自定义
- 用于多系列对比的追踪球功能
- 用于精确读取数值的十字线
- 工具提示模板
- 交互式显示模式
缩放与平移
📄 阅读: references/zooming-and-panning.md
- 缩放模式(捏合、选择、鼠标滚轮)
- 平移配置
- ZoomPanBehavior 设置
- 程序化缩放控制
- 重置缩放功能
选择
📄 阅读: references/selection.md
- 选择类型(单选、多选、系列)
- DataPointSelectionBehavior
- SeriesSelectionBehavior
- 选择事件
- 自定义选择样式
自定义与样式
图例与外观
📄 阅读: references/legend-and-appearance.md
- 图例配置与位置
- 图例项模板
- 图表外观自定义
- 调色板
- 主题
注释与绘图区间
📄 阅读: references/annotations-and-plotbands.md
- 注释类型(文本、视图、形状)
- 添加和定位注释
- 用于突出显示区域的 PlotBand 配置
- 用例与示例
自定义样式
📄 阅读: references/customization-and-styling.md
- 系列外观自定义
- 添加自定义标签
- 颜色与渐变填充
- 边框与圆角半径
- 模板自定义
数据处理与高级功能
数据点管理
📄 阅读: references/data-handling.md
- 空数据点处理
- 空数据点模式(间隙、零、平均值、丢弃)
- 按区域获取数据点
- 检测触摸位置
- 数据操作
导出与本地化
📄 阅读: references/exporting-and-localization.md
- 将图表导出为图像
- 导出格式与选项
- 本地化配置
- 区域特定格式
- 资源文件