mcpField
S
syncfusion-maui-toolkit-funnel-charts

syncfusion-maui-toolkit-funnel-charts

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

关于 syncfusion-maui-toolkit-funnel-charts

该技能面向 .NET MAUI 开发者,指导使用 Syncfusion 的 SfFunnelChart 实现漏斗图。内容包括阶段数据可视化、标签与图例、自定义方向和外观,以及图像导出。

主要功能

  1. 01漏斗阶段数据可视化
  2. 02垂直或水平显示
  3. 03数据标签与可滚动图例
  4. 04提示、选择和图例切换
  5. 05颜色、渐变与间距自定义
  6. 06导出为图像

适用场景

  1. 01展示销售流程各阶段
  2. 02分析营销或转化漏斗
  3. 03查看阶段转化率与流失
  4. 04导出漏斗图用于分享

安装

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

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

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

包含的文件

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

references/
advanced-features.md
appearance.md
data-labels.md
exporting.md
getting-started.md
legend.md
tooltip.md

详细介绍

在 .NET MAUI 中实现漏斗图

一份全面的指南,介绍如何实现和自定义 Syncfusion .NET MAUI 漏斗图(SfFunnelChart)。漏斗图通过逐渐缩小的分段来可视化数据,非常适合表示销售管道、转化漏斗或营销活动等流程中的各个阶段。

何时使用此指南

在以下情况下使用此指南:

  • 创建漏斗图,可视化流程阶段(销售、营销、转化)
  • 显示层次结构数据,并以逐渐缩窄的分段呈现
  • 展示转化率或流失分析
  • 实现可自定义的漏斗图,包含数据标签和图例
  • 导出漏斗图为图像

组件概述

SfFunnelChart 是一个 .NET MAUI 控件,可创建美观的漏斗分段,用于分析流程中的各个阶段。主要功能包括:

  • **用户交互:**选择、工具提示和图例切换
  • **数据标签:**显示数值,并可自定义位置和样式
  • **图例支持:**可滚动的图例,并可识别各个项
  • **自定义:**外观、颜色、渐变、间距和效果
  • **方向:**垂直或水平显示漏斗图
  • **导出:**将图表保存为图像

文档和导航指南

入门

📄 阅读:references/getting-started.md

  • 安装 NuGet 包(Syncfusion.Maui.Toolkit)
  • 基本的 SfFunnelChart 实现(XAML 和 C#)
  • 创建视图模型和数据模型
  • 使用 ItemsSource、XBindingPath、YBindingPath 进行数据绑定
  • 添加标题、图例、工具提示和数据标签
  • 完整的可运行示例
数据标签

📄 阅读:references/data-labels.md

  • 启用数据标签(ShowDataLabels 属性)
  • 标签位置选项(Auto、Inner、Center、Outer)
  • 配置上下文(显示 XValue、YValue)
  • 自定义标签样式(字体、颜色、边距、边框)
  • 使用 UseSeriesPalette 为分段标签着色
外观和自定义

📄 阅读:references/appearance.md

  • 使用自定义 PaletteBrushes 设置分段颜色
  • 应用渐变(LinearGradientBrush、RadialGradientBrush)
  • 创建自定义配色方案
  • 配置 GradientStops
  • 视觉设计最佳实践
图例

📄 阅读:references/legend.md

  • 定义并初始化 ChartLegend
  • 图例的可见性和位置(Top、Bottom、Left、Right)
  • 自定义标签样式
  • 图例图标类型
  • 使用 OffsetX/OffsetY 设置浮动图例
  • 切换系列可见性
  • 图例项布局和 ItemTemplate
  • LegendItemCreated 事件
工具提示

📄 阅读:references/tooltip.md

  • 启用工具提示(EnableTooltip 属性)
  • 自定义工具提示模板
  • 绑定上下文和数据格式
  • 自定义工具提示外观
高级功能

📄 阅读:references/advanced-features.md

  • 方向(垂直或水平)
  • 配置分段间距
  • 间隙比例和大小设置
  • 视觉效果和润色
导出

📄 阅读:references/exporting.md

  • 将图表导出为图像
  • 导出格式选项
  • 分享和保存图表

评论

支持 Markdown