mcpField
S
syncfusion-maui-pyramid-charts

syncfusion-maui-pyramid-charts

github.com/syncfusion设计与 UI61208 次安装2 周前更新
代码仓库

关于 syncfusion-maui-pyramid-charts

为 .NET MAUI 开发者提供 Syncfusion SfPyramidChart 实现指南,用于展示层级比例和整体组成关系,并介绍交互、样式与导出。

主要功能

  1. 01线性与表面积金字塔模式
  2. 02数据标签和图例定制
  3. 03工具提示定制
  4. 04方向与间距设置
  5. 05导出图像或数据流

适用场景

  1. 01展示总量中的各部分比例
  2. 02呈现销售阶段或流程
  3. 03为报告导出图表

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/syncfusion/maui-ui-components-skills --skill syncfusion-maui-pyramid-charts

安装后在 Claude Code 中输入/syncfusion-maui-pyramid-charts确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

references/
accessibility.md
appearance-customization.md
data-labels.md
exporting.md
getting-started.md
legend.md
orientation-and-effects.md
tooltip.md

详细介绍

实现 .NET MAUI 金字塔图表

指导用户实现 Syncfusion® .NET MAUI 金字塔图表(SfPyramidChart),该图表通过分层区段展示整体中的各部分比例,非常适合在高品质 .NET MAUI 应用程序中呈现部分与整体的关系。作为一种无坐标轴的单系列图表,它以百分比表示数据,各部分之和等于整体。

何时使用此技能

当用户需要执行以下操作时,请使用此技能:

  • 创建金字塔图表,在 .NET MAUI 应用程序中可视化分层或比例数据
  • 展示部分与整体的关系,其中各区段表示整体中的百分比
  • 实现类似漏斗的可视化效果,用于展示销售阶段、流程或人口统计细分
  • 为金字塔图表添加交互功能,例如工具提示、图例和数据标签
  • 自定义外观,包括调色板、渐变、区段间距和方向
  • 启用现代 UI 效果,例如适用于 iOS/macOS 应用程序的液态玻璃样式
  • 将图表可视化结果导出为图像(JPEG/PNG)或流,以用于报告和文档
  • 配置数据绑定,将视图模型绑定到金字塔图表区段

组件概述

SfPyramidChart 控件提供:

  • 单系列分层数据可视化
  • 可自定义的交互式工具提示和图例
  • 丰富的数据标签位置选项(Auto、Inner、Center、Outer)
  • 自定义调色板画刷和渐变支持
  • 两种金字塔模式:Linear(基于高度)和 Surface(基于面积)
  • 使用 GapRatio 控制区段间距
  • 纵向和横向方向选项
  • 现代液态玻璃视觉效果(iOS/macOS .NET 10+)
  • 导出为图像格式或流
  • 通过图例交互切换系列可见性
  • 可滚动图例,处理溢出内容

文档与导航指南

入门

📄 阅读: references/getting-started.md

当用户需要执行以下操作时:

  • 安装 Syncfusion.Maui.Charts NuGet 包
  • 在 XAML 或 C# 中初始化 SfPyramidChart
  • 创建视图模型并将数据绑定到图表
  • 配置 ItemsSource、XBindingPath 和 YBindingPath
  • 了解金字塔图表的基本设置和命名空间导入
  • 查看完整的可运行数据绑定示例
数据标签

📄 阅读: references/data-labels.md

当用户需要执行以下操作时:

  • 启用并显示金字塔区段上的数据标签
  • 配置 PyramidDataLabelSettings 以自定义标签
  • 控制标签位置(Auto、Inner、Center、Outer)
  • 设置标签上下文,以显示 X 值或 Y 值
  • 使用字体、颜色、背景、边框和圆角半径设置标签样式
  • 使用系列调色板颜色作为标签背景
  • 应用边距并自定义标签外观
图例

📄 阅读: references/legend.md

当用户需要执行以下操作时:

  • 添加并配置 ChartLegend,以显示区段信息
  • 自定义图例标签样式(字体、颜色、大小、属性)
  • 设置图例图标类型并自定义图标外观
  • 设置图例位置(Top、Bottom、Left、Right)
  • 创建带偏移位置的浮动图例
  • 启用通过点按图例切换系列可见性
  • 使用 ItemsLayout 自定义图例布局
  • 使用自定义图例项模板
  • 处理 LegendItemCreated 事件
  • 替代图例视图的最大尺寸请求
工具提示

📄 阅读: references/tooltip.md

当用户需要执行以下操作时:

  • 启用工具提示,以在悬停时显示区段信息
  • 配置 ChartTooltipBehavior 以自定义工具提示
  • 设置工具提示外观样式(背景、字体、颜色、边距)
  • 控制工具提示的显示时长
  • 为高级 UI 创建自定义工具提示模板
  • 将工具提示内容绑定到数据项属性
外观和自定义

📄 阅读: references/appearance-customization.md

当用户需要:

  • 为金字塔分段应用自定义调色板画笔
  • 使用渐变填充(LinearGradientBrush、RadialGradientBrush)
  • 在 Linear 和 Surface 金字塔模式之间切换
  • 了解模式差异(基于高度与基于面积)
  • 使用 GapRatio 属性控制分段间距
  • 实现视觉样式最佳实践
  • 为分段创建精致的渐变效果
方向和视觉效果

📄 阅读: references/orientation-and-effects.md

当用户需要:

  • 将图表方向从 Vertical 更改为 Horizontal
  • 实现液态玻璃视觉效果(iOS/macOS .NET 10+)
  • 集成 SfGlassEffectView,打造现代 UI 样式
  • 为工具提示启用玻璃效果
  • 配置 EffectType(Regular 或 Clear 玻璃外观)
  • 应用在背景上使用玻璃效果的最佳实践
  • 在自定义工具提示模板中使用透明背景
导出

📄 阅读: references/exporting.md

当用户需要:

  • 将金字塔图表导出为图像(JPEG 或 PNG)
  • 使用 SaveAsImage 方法导出文件
  • 了解特定平台的保存位置
  • 配置 Android 和 Windows Phone 的文件写入权限
  • 设置 iOS 相册访问权限
  • 使用 GetStreamAsync 将图表导出为流
  • 将图表流集成到 PDF、Excel 或 Word 组件中
  • 处理 ImageFileFormat 选项
无障碍功能

📄 阅读: references/accessibility.md

当用户需要:

  • 向屏幕阅读器公开图表标题、金字塔层和图例项
  • 了解播报格式(金字塔层 =“标签 + 值”)
  • 按平台启用无障碍功能(TalkBack、VoiceOver、Narrator)
  • 通过键盘导航图表元素(Windows Narrator、macOS VoiceOver)
  • 通过手势导航图表元素(Android TalkBack、iOS VoiceOver)
  • 提供有意义的标签,以便播报相关信息

评论

支持 Markdown