syncfusion-aspnetcore-accumulation-chart

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Implementing Syncfusion ASP.NET Core Accumulation Charts

实现Syncfusion ASP.NET Core Accumulation Charts

A comprehensive skill for implementing Syncfusion's ASP.NET Core Accumulation Chart component. This component renders circular data visualizations including Pie, Doughnut, Pyramid, and Funnel charts using Scalable Vector Graphics (SVG).

这是一套用于实现Syncfusion ASP.NET Core Accumulation Chart组件的完整技能指南。该组件使用可缩放矢量图形（SVG）渲染环形数据可视化图表，包括饼图、环形图、金字塔图和漏斗图。

When to Use This Skill

何时使用本技能

Use this skill when you need to:

Create pie, doughnut, pyramid, or funnel charts in ASP.NET Core applications
Visualize proportional data or percentage distributions
Display hierarchical data with pyramid/funnel charts
Add data labels, tooltips, and legends to accumulation charts
Implement interactive features (exploding slices, selection, drill-down)
Handle grouped data or empty points in charts
Export or print accumulation charts
Make charts accessible (WCAG 2.2 compliant)
Dynamically update chart data in real-time
Customize chart appearance with themes, colors, and gradients

当你需要完成以下需求时可使用本技能：

在ASP.NET Core应用中创建饼图、环形图、金字塔图或漏斗图
可视化比例数据或百分比分布
用金字塔/漏斗图展示层级数据
为累计图表添加数据标签、工具提示和图例
实现交互功能（切片弹出、选中、下钻）
处理图表中的分组数据或空数据点
导出或打印累计图表
实现符合无障碍标准的图表（WCAG 2.2合规）
实时动态更新图表数据
通过主题、颜色和渐变自定义图表外观

Component Overview

组件概述

AccumulationChart is a circular graphics component that divides data into segments to illustrate numerical proportions. It supports:

Chart Types: Pie (including Doughnut variant), Pyramid, Funnel
- Note: Doughnut is achieved by setting
```
innerRadius
```
  on a Pie chart, not a separate type
Smart Labels: Automatic label positioning to prevent overlapping
Grouping: Combine small data points based on value or count
Semi-Charts: Customize start and end angles for semi-pie/doughnut
Legend: Display additional point information
Tooltips: Interactive data point details
Empty Points: Graceful handling of missing data
Accessibility: Full WCAG 2.2 Level A & AA compliance
Export: PNG, JPEG, SVG, PDF formats
Print: Direct browser printing support

AccumulationChart 是一个环形图形组件，它将数据拆分为多个分段来展示数值比例，支持以下功能：

图表类型： 饼图（包含环形图变体）、金字塔图、漏斗图
- 注意： 环形图通过设置饼图的
```
innerRadius
```
  实现，并非独立的图表类型
智能标签： 自动调整标签位置避免重叠
分组： 根据数值或数量合并小数据点
半环图表： 自定义起止角度实现半饼图/半环形图
图例： 展示额外的数据点信息
工具提示： 交互式展示数据点详情
空数据点： 优雅处理缺失数据
无障碍： 完全符合WCAG 2.2 Level A & AA标准
导出： 支持PNG、JPEG、SVG、PDF格式
打印： 支持浏览器直接打印

Documentation and Navigation Guide

文档与导航指南

Getting Started

入门指南

📄 Read: references/getting-started.md

When to read: Setting up accumulation charts for the first time, or need complete installation and basic implementation guidance.

What you'll learn:

Prerequisites and system requirements
Installing Syncfusion NuGet packages
Registering tag helpers and script resources
Creating your first pie/doughnut chart
Basic data binding (dataSource, xName, yName)
CSS theme imports and script manager setup
Running and testing the chart
Complete minimal working example

📄 阅读： references/getting-started.md

适用场景： 首次搭建累计图表，或需要完整的安装和基础实现指导时。

你将学到：

前置条件与系统要求
安装Syncfusion NuGet包
注册Tag Helper和脚本资源
创建你的第一个饼图/环形图
基础数据绑定（dataSource、xName、yName）
CSS主题导入与脚本管理器设置
运行和测试图表
完整的最小可运行示例

Chart Types and Variants

图表类型与变体

📄 Read: references/chart-types.md

When to read: Need to implement specific chart types (Pie, Doughnut, Pyramid, Funnel) or customize chart geometry and appearance.

What you'll learn:

Pie chart implementation and configuration
Doughnut chart with inner radius and center labels
Pyramid chart with width, gap, and neck customization
Funnel chart with neck dimensions
Radius customization for all chart types
Start and end angles for semi-pie/semi-doughnut
Exploding slices (single and multiple points)
Chart center positioning
Complete code examples for each type

📄 阅读： references/chart-types.md

适用场景： 需要实现特定图表类型（饼图、环形图、金字塔图、漏斗图）或自定义图表几何形状与外观时。

你将学到：

饼图的实现与配置
带内半径和中心标签的环形图
支持宽度、间距、颈部自定义的金字塔图
支持颈部尺寸配置的漏斗图
所有图表类型的半径自定义
半饼图/半环形图的起止角度设置
切片弹出（单点和多点）
图表中心位置调整
每种类型的完整代码示例

Data Visualization Features

数据可视化功能

📄 Read: references/data-visualization.md

When to read: Enhancing charts with data labels, tooltips, legends, colors, or custom styling.

What you'll learn:

Data label visibility, positioning, and templates
Smart labels for overlap prevention
Connector lines for outside labels
Tooltip configuration and templates
Legend positioning, alignment, and customization
Title and subtitle configuration
Point colors and gradient fills
Text mapping from data source
Border and margin customization
Complete styling patterns

📄 阅读： references/data-visualization.md

适用场景： 通过数据标签、工具提示、图例、颜色或自定义样式增强图表能力时。

你将学到：

数据标签可见性、位置与模板设置
避免重叠的智能标签功能
外部标签的连接线设置
工具提示配置与模板
图例位置、对齐方式与自定义
标题与副标题配置
数据点颜色与渐变填充
从数据源映射文本
边框与边距自定义
完整的样式实现模式

Data Handling

数据处理

📄 Read: references/data-handling.md

When to read: Working with complex data scenarios like grouping small values, handling missing data, or updating charts dynamically.

What you'll learn:

Grouping points by value or count threshold
Group settings (threshold, mode, color, name)
Empty points handling (null/undefined values)
Empty point modes (Zero, Drop, Average, Gap)
Dynamic data updates and live scenarios
Data source binding patterns
Sorting and ordering data
Edge cases and troubleshooting

📄 阅读： references/data-handling.md

适用场景： 处理复杂数据场景，比如小数值分组、缺失数据处理或动态更新图表时。

你将学到：

按数值或数量阈值分组数据点
分组设置（阈值、模式、颜色、名称）
空数据点处理（null/undefined值）
空数据点模式（Zero、Drop、Average、Gap）
动态数据更新与实时场景
数据源绑定模式
数据排序与顺序调整
边缘场景与问题排查

Advanced Features

高级功能

📄 Read: references/advanced-features.md

When to read: Implementing annotations, export/print functionality, or migrating from EJ1 to EJ2.

What you'll learn:

Chart annotations (text, shapes, images)
Annotation positioning (coordinate, region, alignment)
Export to image formats (PNG, JPEG, SVG)
Export to PDF
Print functionality and customization
EJ1 to EJ2 API migration guide
Performance optimization tips
Complex implementation patterns

📄 阅读： references/advanced-features.md

适用场景： 实现注释、导出/打印功能，或从EJ1迁移到EJ2时。

你将学到：

图表注释（文本、形状、图片）
注释定位（坐标、区域、对齐方式）
导出为图片格式（PNG、JPEG、SVG）
导出为PDF
打印功能与自定义
EJ1到EJ2的API迁移指南
性能优化技巧
复杂实现模式

Accessibility

无障碍功能

📄 Read: references/accessibility.md

When to read: Making charts accessible for users with disabilities or ensuring WCAG 2.2 compliance.

What you'll learn:

WCAG 2.2 Level A & AA compliance features
Keyboard navigation (Tab, arrow keys, Enter)
ARIA attributes and roles
Screen reader support and announcements
High contrast theme support
Focus indicators and visual feedback
Color contrast requirements
Accessible color palettes
Testing with assistive technologies
Complete accessible chart implementation

📄 阅读： references/accessibility.md

适用场景： 为残障用户提供无障碍访问能力，或确保符合WCAG 2.2标准时。

你将学到：

WCAG 2.2 Level A & AA合规功能
键盘导航（Tab、方向键、Enter）
ARIA属性与角色
屏幕阅读器支持与播报
高对比度主题支持
焦点指示器与视觉反馈
颜色对比度要求
无障碍调色板
辅助技术测试方法
完整的无障碍图表实现方案

Quick Start Example

快速入门示例

Here's a minimal example to render a pie chart in ASP.NET Core:

以下是在ASP.NET Core中渲染饼图的最小示例：

1. Install Package

1. 安装包

bash

Install-Package Syncfusion.EJ2.AspNet.Core -Version {{ site.releaseversion }}

bash

Install-Package Syncfusion.EJ2.AspNet.Core -Version {{ site.releaseversion }}

2. Register Tag Helper (~/Pages/_ViewImports.cshtml)

2. 注册Tag Helper (~/Pages/_ViewImports.cshtml)

csharp

@addTagHelper *, Syncfusion.EJ2

csharp

@addTagHelper *, Syncfusion.EJ2

3. Add Scripts (~/Pages/Shared/_Layout.cshtml)

3. 添加脚本 (~/Pages/Shared/_Layout.cshtml)

html

<head>
    <!-- Syncfusion CSS -->
    <link href="https://cdn.syncfusion.com/ej2/{{ site.ej2version }}/material.css" rel="stylesheet" />
    <!-- Syncfusion JS -->
    <script src="https://cdn.syncfusion.com/ej2/{{ site.ej2version }}/dist/ej2.min.js"></script>
</head>
<body>
    <!-- Content -->
    <ejs-scripts></ejs-scripts>
</body>

html

<head>
    <!-- Syncfusion CSS -->
    <link href="https://cdn.syncfusion.com/ej2/{{ site.ej2version }}/material.css" rel="stylesheet" />
    <!-- Syncfusion JS -->
    <script src="https://cdn.syncfusion.com/ej2/{{ site.ej2version }}/dist/ej2.min.js"></script>
</head>
<body>
    <!-- Content -->
    <ejs-scripts></ejs-scripts>
</body>

4. Create Pie Chart (~/Pages/Index.cshtml)

4. 创建饼图 (~/Pages/Index.cshtml)

cshtml

@{
    List<PieChartData> chartData = new List<PieChartData>
    {
        new PieChartData { xValue = "Chrome", yValue = 37 },
        new PieChartData { xValue = "Firefox", yValue = 22 },
        new PieChartData { xValue = "Safari", yValue = 19 },
        new PieChartData { xValue = "Edge", yValue = 12 },
        new PieChartData { xValue = "Others", yValue = 10 }
    };
}

<ejs-accumulationchart id="pieChart">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="@chartData" xName="xValue" yName="yValue">
        </e-accumulation-series>
    </e-accumulation-series-collection>
</ejs-accumulationchart>

cshtml

@{
    List<PieChartData> chartData = new List<PieChartData>
    {
        new PieChartData { xValue = "Chrome", yValue = 37 },
        new PieChartData { xValue = "Firefox", yValue = 22 },
        new PieChartData { xValue = "Safari", yValue = 19 },
        new PieChartData { xValue = "Edge", yValue = 12 },
        new PieChartData { xValue = "Others", yValue = 10 }
    };
}

<ejs-accumulationchart id="pieChart">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="@chartData" xName="xValue" yName="yValue">
        </e-accumulation-series>
    </e-accumulation-series-collection>
</ejs-accumulationchart>

5. Define Data Model (~/Pages/Index.cshtml.cs or separate class)

5. 定义数据模型 (~/Pages/Index.cshtml.cs 或独立类)

csharp

public class PieChartData
{
    public string xValue { get; set; }
    public double yValue { get; set; }
}

Result: A basic pie chart displaying browser usage statistics.

csharp

public class PieChartData
{
    public string xValue { get; set; }
    public double yValue { get; set; }
}

效果： 一个展示浏览器使用占比的基础饼图。

Common Patterns

常用实现模式

Pattern 1: Doughnut Chart with Center Label

模式1：带中心标签的环形图

cshtml

<ejs-accumulationchart id="container">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="chartData" xName="x" yName="y" innerRadius="65%">
        </e-accumulation-series>
    </e-accumulation-series-collection>
    <e-accumulationchart-centerlabel text="Mobile<br>Browsers<br>Statistics">
    </e-accumulationchart-centerlabel>
    <e-accumulationchart-legendsettings visible="false">
    </e-accumulationchart-legendsettings>
</ejs-accumulationchart>

Use Case: Dashboard KPIs with center text showing total value.

cshtml

<ejs-accumulationchart id="container">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="chartData" xName="x" yName="y" innerRadius="65%">
        </e-accumulation-series>
    </e-accumulation-series-collection>
    <e-accumulationchart-centerlabel text="Mobile<br>Browsers<br>Statistics">
    </e-accumulationchart-centerlabel>
    <e-accumulationchart-legendsettings visible="false">
    </e-accumulationchart-legendsettings>
</ejs-accumulationchart>

适用场景： 仪表盘KPI展示，中心文本展示总数值。

Pattern 2: Pie Chart with Smart Labels and Tooltips

模式2：带智能标签和工具提示的饼图

cshtml

<ejs-accumulationchart id="smartLabelChart" enableSmartLabels="true">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="@chartData" xName="xValue" yName="yValue">
            <e-accumulationseries-datalabel visible="true" 
                                          position="Outside" 
                                          name="text">
                <e-connectorstyle type="Curve"></e-connectorstyle>
            </e-accumulationseries-datalabel>
        </e-accumulation-series>
    </e-accumulation-series-collection>
    <e-accumulationchart-tooltipsettings enable="true" format="${point.x}: ${point.y}%">
    </e-accumulationchart-tooltipsettings>
</ejs-accumulationchart>

Use Case: Preventing label overlap in charts with many small slices.

cshtml

<ejs-accumulationchart id="smartLabelChart" enableSmartLabels="true">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="@chartData" xName="xValue" yName="yValue">
            <e-accumulationseries-datalabel visible="true" 
                                          position="Outside" 
                                          name="text">
                <e-connectorstyle type="Curve"></e-connectorstyle>
            </e-accumulationseries-datalabel>
        </e-accumulation-series>
    </e-accumulation-series-collection>
    <e-accumulationchart-tooltipsettings enable="true" format="${point.x}: ${point.y}%">
    </e-accumulationchart-tooltipsettings>
</ejs-accumulationchart>

适用场景： 避免多小切片场景下的标签重叠问题。

Pattern 3: Grouped Data with Small Values

模式3：小数值分组数据

cshtml

<ejs-accumulationchart id="groupedChart">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="@chartData" 
                              xName="xValue" 
                              yName="yValue"
                              groupTo="11">
        </e-accumulation-series>
    </e-accumulation-series-collection>
</ejs-accumulationchart>

Use Case: Combining values below 11% into a single "Others" group.

cshtml

<ejs-accumulationchart id="groupedChart">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="@chartData" 
                              xName="xValue" 
                              yName="yValue"
                              groupTo="11">
        </e-accumulation-series>
    </e-accumulation-series-collection>
</ejs-accumulationchart>

适用场景： 将低于11%的数值合并为单个“其他”分组。

Pattern 4: Funnel Chart with Export

模式4：带导出功能的漏斗图

cshtml

<button id="exportBtn">Export as PNG</button>

<ejs-accumulationchart id="funnelChart">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="@chartData" 
                              xName="xValue" 
                              yName="yValue" 
                              type="Funnel"
                              neckWidth="15%"
                              neckHeight="18%">
        </e-accumulation-series>
    </e-accumulation-series-collection>
</ejs-accumulationchart>

<script>
    document.getElementById('exportBtn').onclick = function() {
        var chart = document.getElementById('funnelChart').ej2_instances[0];
        chart.export('PNG', 'funnel-chart');
    };
</script>

Use Case: Sales funnel visualization with image export.

cshtml

<button id="exportBtn">Export as PNG</button>

<ejs-accumulationchart id="funnelChart">
    <e-accumulation-series-collection>
        <e-accumulation-series dataSource="@chartData" 
                              xName="xValue" 
                              yName="yValue" 
                              type="Funnel"
                              neckWidth="15%"
                              neckHeight="18%">
        </e-accumulation-series>
    </e-accumulation-series-collection>
</ejs-accumulationchart>

<script>
    document.getElementById('exportBtn').onclick = function() {
        var chart = document.getElementById('funnelChart').ej2_instances[0];
        chart.export('PNG', 'funnel-chart');
    };
</script>

适用场景： 销售漏斗可视化，支持图片导出。

API Reference

API参考

AccumulationChart Class

AccumulationChart类

Represents the main accumulation chart component. All properties are defined in the

Syncfusion.EJ2.Charts

namespace.

代表累计图表的核心组件，所有属性都定义在

Syncfusion.EJ2.Charts

命名空间下。

Constructor

构造函数

csharp

public AccumulationChart()

csharp

public AccumulationChart()

Core Properties

核心属性

Property	Type	Default	Description	API Reference
`Accessibility`	`AccumulationAccessibility`	null	Options to improve accessibility for accumulation chart elements	AccumulationAccessibility
`Annotations`	`List<AccumulationAnnotationSettings>`	null	Annotations for highlighting specific data points	AccumulationAnnotationSettings
`Background`	`string`	null	Background color (hex or rgba)	-
`BackgroundImage`	`string`	null	Background image URL	-
`Border`	`AccumulationChartBorder`	null	Chart border configuration	AccumulationChartBorder
`Center`	`AccumulationChartCenter`	null	Center position of pie/doughnut (x, y percentages)	AccumulationChartCenter
`CenterLabel`	`AccumulationChartCenterLabel`	null	Center label configuration for doughnut charts	AccumulationChartCenterLabel
`DataSource`	`object`	null	Chart data collection	-
`EnableAnimation`	`bool`	true	Enable chart animation on load	-
`EnableBorderOnMouseMove`	`bool`	true	Enable border on mouse hover	-
`EnableExport`	`bool`	true	Enable export to JPEG, PNG, SVG, PDF, XLSX, CSV	-
`EnableHtmlSanitizer`	`bool`	false	Sanitize untrusted HTML in chart content	-
`EnablePersistence`	`bool`	false	Persist component state across page reloads	-
`EnableRtl`	`bool`	false	Enable right-to-left rendering	-
`EnableSmartLabels`	`bool`	true	Auto-arrange labels to prevent overlap	-
`FocusBorderColor`	`string`	-	Focus border color for accessibility	-
`FocusBorderMargin`	`double`	0	Focus border margin	-
`FocusBorderWidth`	`double`	1.5	Focus border width	-
`Height`	`string`	null	Chart height (e.g., "450px", "100%")	-
`HighlightColor`	`string`	""	Color for highlighting data points on hover	-
`HighlightMode`	`AccumulationHighlightMode`	None	Highlight mode: None or Point	AccumulationHighlightMode
`HighlightPattern`	`SelectionPattern`	None	Pattern for highlighting series/points	SelectionPattern
`IsMultiSelect`	`bool`	false	Enable multiple point selection (requires selectionMode=Point)	-
`LegendSettings`	`AccumulationChartLegendSettings`	null	Legend configuration	AccumulationChartLegendSettings
`Locale`	`string`	""	Culture/localization override (default: en-US)	-
`Margin`	`AccumulationChartMargin`	null	Chart margins (left, right, top, bottom)	AccumulationChartMargin
`NoDataTemplate`	`object`	null	Template for empty chart state	-
`SelectedDataIndexes`	`object`	null	Initial selected point indexes	-
`SelectionMode`	`AccumulationSelectionMode`	None	Selection mode: None or Point	AccumulationSelectionMode
`SelectionPattern`	`SelectionPattern`	None	Pattern for selected series/points	SelectionPattern
`Series`	`List<AccumulationSeries>`	null	Chart series collection	AccumulationSeries
`SubTitle`	`string`	null	Chart subtitle text	-
`SubTitleStyle`	`AccumulationChartSubTitleStyle`	null	Subtitle font and styling	AccumulationChartSubTitleStyle
`Theme`	`AccumulationTheme`	Material	Visual theme	AccumulationTheme
`Title`	`string`	null	Chart title text	-
`TitleStyle`	`AccumulationChartTitleStyleSettings`	null	Title font and styling	AccumulationChartTitleStyleSettings
`Tooltip`	`AccumulationChartTooltipSettings`	null	Tooltip configuration	AccumulationChartTooltipSettings
`UseGroupingSeparator`	`bool`	false	Use thousand separator for numbers	-
`Width`	`string`	null	Chart width (e.g., "100px", "100%")	-

属性	类型	默认值	描述	API参考
`Accessibility`	`AccumulationAccessibility`	null	优化累计图表元素无障碍访问能力的配置项	AccumulationAccessibility
`Annotations`	`List<AccumulationAnnotationSettings>`	null	用于高亮特定数据点的注释配置	AccumulationAnnotationSettings
`Background`	`string`	null	背景颜色（十六进制或rgba格式）	-
`BackgroundImage`	`string`	null	背景图片URL	-
`Border`	`AccumulationChartBorder`	null	图表边框配置	AccumulationChartBorder
`Center`	`AccumulationChartCenter`	null	饼图/环形图的中心位置（x、y百分比）	AccumulationChartCenter
`CenterLabel`	`AccumulationChartCenterLabel`	null	环形图的中心标签配置	AccumulationChartCenterLabel
`DataSource`	`object`	null	图表数据集	-
`EnableAnimation`	`bool`	true	启用图表加载动画	-
`EnableBorderOnMouseMove`	`bool`	true	鼠标悬停时显示边框	-
`EnableExport`	`bool`	true	启用导出为JPEG、PNG、SVG、PDF、XLSX、CSV格式的能力	-
`EnableHtmlSanitizer`	`bool`	false	对图表内容中的不可信HTML进行消毒处理	-
`EnablePersistence`	`bool`	false	页面重载时保留组件状态	-
`EnableRtl`	`bool`	false	启用从右到左渲染	-
`EnableSmartLabels`	`bool`	true	自动排列标签避免重叠	-
`FocusBorderColor`	`string`	-	无障碍功能的焦点边框颜色	-
`FocusBorderMargin`	`double`	0	焦点边框边距	-
`FocusBorderWidth`	`double`	1.5	焦点边框宽度	-
`Height`	`string`	null	图表高度（例如"450px"、"100%"）	-
`HighlightColor`	`string`	""	鼠标悬停时数据点的高亮颜色	-
`HighlightMode`	`AccumulationHighlightMode`	None	高亮模式：None或Point	AccumulationHighlightMode
`HighlightPattern`	`SelectionPattern`	None	高亮系列/数据点的图案	SelectionPattern
`IsMultiSelect`	`bool`	false	启用多数据点选择（需要selectionMode=Point）	-
`LegendSettings`	`AccumulationChartLegendSettings`	null	图例配置	AccumulationChartLegendSettings
`Locale`	`string`	""	文化/本地化覆盖（默认：en-US）	-
`Margin`	`AccumulationChartMargin`	null	图表边距（左、右、上、下）	AccumulationChartMargin
`NoDataTemplate`	`object`	null	空图表状态的模板	-
`SelectedDataIndexes`	`object`	null	初始选中的数据点索引	-
`SelectionMode`	`AccumulationSelectionMode`	None	选择模式：None或Point	AccumulationSelectionMode
`SelectionPattern`	`SelectionPattern`	None	选中系列/数据点的图案	SelectionPattern
`Series`	`List<AccumulationSeries>`	null	图表系列集合	AccumulationSeries
`SubTitle`	`string`	null	图表副标题文本	-
`SubTitleStyle`	`AccumulationChartSubTitleStyle`	null	副标题字体与样式	AccumulationChartSubTitleStyle
`Theme`	`AccumulationTheme`	Material	视觉主题	AccumulationTheme
`Title`	`string`	null	图表标题文本	-
`TitleStyle`	`AccumulationChartTitleStyleSettings`	null	标题字体与样式	AccumulationChartTitleStyleSettings
`Tooltip`	`AccumulationChartTooltipSettings`	null	工具提示配置	AccumulationChartTooltipSettings
`UseGroupingSeparator`	`bool`	false	数字使用千位分隔符	-
`Width`	`string`	null	图表宽度（例如"100px"、"100%"）	-

Event Properties

事件属性

Event	Type	Description
`AfterExport`	`string`	Triggered after export completes
`AnimationComplete`	`string`	Triggered after animation completes
`AnnotationRender`	`string`	Triggered before annotation renders
`BeforeExport`	`string`	Triggered before export starts
`BeforePrint`	`string`	Triggered before print starts
`BeforeResize`	`string`	Triggered before window resize
`ChartDoubleClick`	`string`	Triggered on double-click
`ChartMouseClick`	`string`	Triggered on mouse click
`ChartMouseDown`	`string`	Triggered on mouse down
`ChartMouseLeave`	`string`	Triggered when cursor leaves
`ChartMouseMove`	`string`	Triggered on mouse move/hover
`ChartMouseUp`	`string`	Triggered on mouse up
`LegendClick`	`string`	Triggered after legend click
`LegendRender`	`string`	Triggered before legend renders
`Load`	`string`	Triggered before chart loads
`Loaded`	`string`	Triggered after chart loads
`PointClick`	`string`	Triggered when point is clicked
`PointMove`	`string`	Triggered when point is hovered
`PointRender`	`string`	Triggered before point renders
`Resized`	`string`	Triggered after window resize completes
`SelectionComplete`	`string`	Triggered after selection completes
`SeriesRender`	`string`	Triggered before series renders
`TextRender`	`string`	Triggered before data label renders
`TooltipRender`	`string`	Triggered before tooltip renders

事件	类型	描述
`AfterExport`	`string`	导出完成后触发
`AnimationComplete`	`string`	动画完成后触发
`AnnotationRender`	`string`	注释渲染前触发
`BeforeExport`	`string`	导出开始前触发
`BeforePrint`	`string`	打印开始前触发
`BeforeResize`	`string`	窗口调整大小前触发
`ChartDoubleClick`	`string`	双击时触发
`ChartMouseClick`	`string`	鼠标点击时触发
`ChartMouseDown`	`string`	鼠标按下时触发
`ChartMouseLeave`	`string`	光标离开时触发
`ChartMouseMove`	`string`	鼠标移动/悬停时触发
`ChartMouseUp`	`string`	鼠标松开时触发
`LegendClick`	`string`	图例点击后触发
`LegendRender`	`string`	图例渲染前触发
`Load`	`string`	图表加载前触发
`Loaded`	`string`	图表加载后触发
`PointClick`	`string`	数据点被点击时触发
`PointMove`	`string`	数据点被悬停时触发
`PointRender`	`string`	数据点渲染前触发
`Resized`	`string`	窗口调整大小完成后触发
`SelectionComplete`	`string`	选择完成后触发
`SeriesRender`	`string`	系列渲染前触发
`TextRender`	`string`	数据标签渲染前触发
`TooltipRender`	`string`	工具提示渲染前触发

AccumulationSeries Class

AccumulationSeries类

Represents a data series in the accumulation chart.

代表累计图表中的一个数据系列。

Properties

属性

Property	Type	Default	Description	API Reference
`DataSource`	`object[]`	null	Series data collection	-
`XName`	`string`	null	Field name for X values (categories)	-
`YName`	`string`	null	Field name for Y values (numeric data)	-
`Type`	`string`	"Pie"	Series type: Pie, Pyramid, Funnel (Doughnut = Pie + innerRadius)	-
`Radius`	`string`	"80%"	Chart radius (percentage or pixels)	-
`InnerRadius`	`string`	"0%"	Inner radius for doughnut effect (percentage)	-
`StartAngle`	`double`	0	Start angle in degrees (0-360)	-
`EndAngle`	`double`	360	End angle in degrees (0-360)	-
`Explode`	`bool`	false	Enable explosion on click	-
`ExplodeIndex`	`double`	null	Index of pre-exploded point	-
`ExplodeOffset`	`string`	"10%"	Distance exploded slice moves	-
`GroupTo`	`string`	null	Grouping threshold (value or percentage)	-
`GroupMode`	`string`	"Value"	Group mode: Value or Point	-
`GroupName`	`string`	"Others"	Name for grouped points	-
`PyramidMode`	`string`	"Linear"	Pyramid mode: Linear or Surface	-
`FunnelMode`	`string`	"Standard"	Funnel mode: Standard or Trapezoidal	-
`NeckWidth`	`string`	"20%"	Funnel neck width (percentage)	-
`NeckHeight`	`string`	"20%"	Funnel neck height (percentage)	-
`Width`	`string`	"80%"	Pyramid/Funnel width (percentage)	-
`Height`	`string`	"80%"	Pyramid/Funnel height (percentage)	-
`GapRatio`	`double`	0	Gap between pyramid/funnel segments	-
`Palettes`	`string[]`	null	Custom color palette	-
`PointColorMapping`	`string`	null	Field name for point colors	-
`PointRender`	`string`	null	Event triggered before point renders	-
`DataLabel`	`AccumulationDataLabelSettings`	null	Data label configuration	AccumulationDataLabelSettings
`EmptyPointSettings`	`AccumulationChartEmptyPointSettings`	null	Empty point handling	AccumulationChartEmptyPointSettings
`ConnectorStyle`	`AccumulationChartConnector`	null	Connector line styling	AccumulationChartConnector
`Border`	`AccumulationChartBorder`	null	Series border styling	AccumulationChartBorder
`LegendShape`	`LegendShape`	SeriesType	Legend icon shape	LegendShape
`TooltipMappingName`	`string`	null	Field for custom tooltip content	-

属性	类型	默认值	描述	API参考
`DataSource`	`object[]`	null	系列数据集	-
`XName`	`string`	null	X值（分类）对应的字段名	-
`YName`	`string`	null	Y值（数值数据）对应的字段名	-
`Type`	`string`	"Pie"	系列类型：Pie、Pyramid、Funnel（Doughnut = Pie + innerRadius）	-
`Radius`	`string`	"80%"	图表半径（百分比或像素）	-
`InnerRadius`	`string`	"0%"	实现环形效果的内半径（百分比）	-
`StartAngle`	`double`	0	起始角度（0-360度）	-
`EndAngle`	`double`	360	结束角度（0-360度）	-
`Explode`	`bool`	false	启用点击弹出切片功能	-
`ExplodeIndex`	`double`	null	预弹出切片的索引	-
`ExplodeOffset`	`string`	"10%"	切片弹出的距离	-
`GroupTo`	`string`	null	分组阈值（数值或百分比）	-
`GroupMode`	`string`	"Value"	分组模式：Value或Point	-
`GroupName`	`string`	"Others"	分组合并后的名称	-
`PyramidMode`	`string`	"Linear"	金字塔模式：Linear或Surface	-
`FunnelMode`	`string`	"Standard"	漏斗模式：Standard或Trapezoidal	-
`NeckWidth`	`string`	"20%"	漏斗颈部宽度（百分比）	-
`NeckHeight`	`string`	"20%"	漏斗颈部高度（百分比）	-
`Width`	`string`	"80%"	金字塔/漏斗宽度（百分比）	-
`Height`	`string`	"80%"	金字塔/漏斗高度（百分比）	-
`GapRatio`	`double`	0	金字塔/漏斗分段之间的间距	-
`Palettes`	`string[]`	null	自定义调色板	-
`PointColorMapping`	`string`	null	数据点颜色对应的字段名	-
`PointRender`	`string`	null	数据点渲染前触发的事件	-
`DataLabel`	`AccumulationDataLabelSettings`	null	数据标签配置	AccumulationDataLabelSettings
`EmptyPointSettings`	`AccumulationChartEmptyPointSettings`	null	空数据点处理配置	AccumulationChartEmptyPointSettings
`ConnectorStyle`	`AccumulationChartConnector`	null	连接线样式配置	AccumulationChartConnector
`Border`	`AccumulationChartBorder`	null	系列边框样式	AccumulationChartBorder
`LegendShape`	`LegendShape`	SeriesType	图例图标形状	LegendShape
`TooltipMappingName`	`string`	null	自定义工具提示内容对应的字段名	-

AccumulationDataLabelSettings Class

AccumulationDataLabelSettings类

Configures data labels displayed on data points.

配置数据点上显示的数据标签。

Properties

属性

Property	Type	Default	Description
`Visible`	`bool`	false	Show/hide data labels
`Position`	`string`	"Outside"	Label position: Inside or Outside
`Name`	`string`	null	Field name for label text
`Template`	`string`	null	HTML template for labels
`Format`	`string`	null	Number format (e.g., "p1", "n2", "c2")
`TextWrap`	`string`	"Normal"	Text wrapping: Normal, Wrap, AnyWhere
`MaxWidth`	`double`	null	Max label width (pixels)
`Font`	`object`	null	Font configuration
`Border`	`object`	null	Label border configuration
`ConnectorStyle`	`string`	"Line"	Connector type: Line or Curve

属性	类型	默认值	描述
`Visible`	`bool`	false	显示/隐藏数据标签
`Position`	`string`	"Outside"	标签位置：Inside或Outside
`Name`	`string`	null	标签文本对应的字段名
`Template`	`string`	null	标签的HTML模板
`Format`	`string`	null	数字格式（例如"p1"、"n2"、"c2"）
`TextWrap`	`string`	"Normal"	文本换行：Normal、Wrap、AnyWhere
`MaxWidth`	`double`	null	标签最大宽度（像素）
`Font`	`object`	null	字体配置
`Border`	`object`	null	标签边框配置
`ConnectorStyle`	`string`	"Line"	连接线类型：Line或Curve

AccumulationChartLegendSettings Class

AccumulationChartLegendSettings类

Configures the legend for the chart.

配置图表的图例。

Properties

属性

Property	Type	Default	Description	API Reference
`Visible`	`bool`	false	Show/hide legend	-
`Position`	`string`	"Right"	Legend position: Top, Bottom, Left, Right	LegendPosition
`Alignment`	`string`	"Center"	Legend alignment: Near, Center, Far	Alignment
`Width`	`string`	"0"	Legend width (pixels or percentage)	-
`Height`	`string`	"0"	Legend height (pixels or percentage)	-
`Reverse`	`bool`	false	Reverse legend item order	-
`Layout`	`string`	"Vertical"	Layout: Vertical or Horizontal	-
`MaximumColumns`	`double`	null	Max columns in horizontal layout	-
`ShapeWidth`	`double`	15	Legend shape width	-
`ShapeHeight`	`double`	15	Legend shape height	-
`Title`	`object`	null	Legend title configuration	-
`Template`	`string`	null	Custom HTML template for legend	-
`TextWrap`	`string`	"Normal"	Text wrapping: Normal or Wrap	-
`MaximumLabelWidth`	`double`	null	Max legend item label width	-
`EnablePages`	`bool`	false	Enable paging for large legends	-
`ToggleVisibility`	`bool`	true	Toggle point visibility on legend click	-

属性	类型	默认值	描述	API参考
`Visible`	`bool`	false	显示/隐藏图例	-
`Position`	`string`	"Right"	图例位置：Top、Bottom、Left、Right	LegendPosition
`Alignment`	`string`	"Center"	图例对齐方式：Near、Center、Far	Alignment
`Width`	`string`	"0"	图例宽度（像素或百分比）	-
`Height`	`string`	"0"	图例高度（像素或百分比）	-
`Reverse`	`bool`	false	反转图例项顺序	-
`Layout`	`string`	"Vertical"	布局：Vertical或Horizontal	-
`MaximumColumns`	`double`	null	水平布局下的最大列数	-
`ShapeWidth`	`double`	15	图例形状宽度	-
`ShapeHeight`	`double`	15	图例形状高度	-
`Title`	`object`	null	图例标题配置	-
`Template`	`string`	null	图例的自定义HTML模板	-
`TextWrap`	`string`	"Normal"	文本换行：Normal或Wrap	-
`MaximumLabelWidth`	`double`	null	图例项标签的最大宽度	-
`EnablePages`	`bool`	false	大量图例时启用分页	-
`ToggleVisibility`	`bool`	true	点击图例时切换数据点可见性	-

AccumulationChartTooltipSettings Class

AccumulationChartTooltipSettings类

Configures tooltips for the chart.

配置图表的工具提示。

Properties

属性

Property	Type	Default	Description
`Enable`	`bool`	false	Enable/disable tooltips
`Header`	`string`	null	Custom tooltip header
`Format`	`string`	null	Tooltip text format
`Template`	`string`	null	HTML template for tooltips
`Fill`	`string`	null	Tooltip background color
`Border`	`object`	null	Tooltip border configuration
`TextStyle`	`object`	null	Tooltip text styling
`Location`	`object`	null	Fixed tooltip position (x, y)
`Opacity`	`double`	1	Tooltip opacity
`Shared`	`bool`	false	Show shared tooltip

属性	类型	默认值	描述
`Enable`	`bool`	false	启用/禁用工具提示
`Header`	`string`	null	自定义工具提示头部
`Format`	`string`	null	工具提示文本格式
`Template`	`string`	null	工具提示的HTML模板
`Fill`	`string`	null	工具提示背景颜色
`Border`	`object`	null	工具提示边框配置
`TextStyle`	`object`	null	工具提示文本样式
`Location`	`object`	null	固定工具提示位置（x、y坐标）
`Opacity`	`double`	1	工具提示透明度
`Shared`	`bool`	false	展示共享工具提示

Available Enumerations

可用枚举

Enum	Values	Description
`AccumulationTheme`	Fabric, FabricDark, Bootstrap4, Bootstrap, BootstrapDark, HighContrastLight, HighContrast, Tailwind, TailwindDark, Bootstrap5, Bootstrap5Dark, Fluent, FluentDark, Fluent2, Fluent2Dark, Fluent2HighContrast, Material3, Material3Dark, Material, MaterialDark	Chart theme options
`AccumulationHighlightMode`	None, Point	Highlight behavior
`AccumulationSelectionMode`	None, Point	Selection behavior
`SelectionPattern`	None, Chessboard, Dots, DiagonalForward, Crosshatch, Pacman, DiagonalBackward, Grid, Turquoise, Star, Triangle, Circle, Tile, HorizontalDash, VerticalDash, Rectangle, Box, VerticalStripe, HorizontalStripe, Bubble	Pattern options for highlighting/selection
`LegendShape`	Circle, Rectangle, Triangle, Diamond, Cross, HorizontalLine, VerticalLine, Pentagon, InvertedTriangle, SeriesType	Legend icon shapes

枚举	取值	描述
`AccumulationTheme`	Fabric, FabricDark, Bootstrap4, Bootstrap, BootstrapDark, HighContrastLight, HighContrast, Tailwind, TailwindDark, Bootstrap5, Bootstrap5Dark, Fluent, FluentDark, Fluent2, Fluent2Dark, Fluent2HighContrast, Material3, Material3Dark, Material, MaterialDark	图表主题选项
`AccumulationHighlightMode`	None, Point	高亮行为
`AccumulationSelectionMode`	None, Point	选择行为
`SelectionPattern`	None, Chessboard, Dots, DiagonalForward, Crosshatch, Pacman, DiagonalBackward, Grid, Turquoise, Star, Triangle, Circle, Tile, HorizontalDash, VerticalDash, Rectangle, Box, VerticalStripe, HorizontalStripe, Bubble	高亮/选择的图案选项
`LegendShape`	Circle, Rectangle, Triangle, Diamond, Cross, HorizontalLine, VerticalLine, Pentagon, InvertedTriangle, SeriesType	图例图标形状

Class	Namespace	Description	API Reference
`AccumulationChartBorder`	Syncfusion.EJ2.Charts	Border configuration	AccumulationChartBorder
`AccumulationChartCenter`	Syncfusion.EJ2.Charts	Center position	AccumulationChartCenter
`AccumulationChartMargin`	Syncfusion.EJ2.Charts	Margin configuration	AccumulationChartMargin
`AccumulationChartConnector`	Syncfusion.EJ2.Charts	Connector line styling	AccumulationChartConnector
`AccumulationChartEmptyPointSettings`	Syncfusion.EJ2.Charts	Empty point handling	AccumulationChartEmptyPointSettings
`AccumulationAnnotationSettings`	Syncfusion.EJ2.Charts	Annotation configuration	AccumulationAnnotationSettings
`AccumulationAccessibility`	Syncfusion.EJ2.Charts	Accessibility options	AccumulationAccessibility

类	命名空间	描述	API参考
`AccumulationChartBorder`	Syncfusion.EJ2.Charts	边框配置	AccumulationChartBorder
`AccumulationChartCenter`	Syncfusion.EJ2.Charts	中心位置配置	AccumulationChartCenter
`AccumulationChartMargin`	Syncfusion.EJ2.Charts	边距配置	AccumulationChartMargin
`AccumulationChartConnector`	Syncfusion.EJ2.Charts	连接线样式配置	AccumulationChartConnector
`AccumulationChartEmptyPointSettings`	Syncfusion.EJ2.Charts	空数据点处理配置	AccumulationChartEmptyPointSettings
`AccumulationAnnotationSettings`	Syncfusion.EJ2.Charts	注释配置	AccumulationAnnotationSettings
`AccumulationAccessibility`	Syncfusion.EJ2.Charts	无障碍功能选项	AccumulationAccessibility

Key Properties

核心属性

AccumulationChart Properties

AccumulationChart属性

Property	Type	Description	Example
`enableSmartLabels`	boolean	Auto-arrange labels to prevent overlap	`true`
`center`	object	Position of chart center (x, y percentages)	`{x: "50%", y: "50%"}`
`legendSettings`	object	Legend configuration (position, alignment)	`{visible: true, position: 'Right'}`
`tooltipSettings`	object	Tooltip configuration and templates	`{enable: true, format: '${point.x}: ${point.y}'}`
`title`	string	Chart title text	`"Browser Market Share"`
`height`	string	Chart height	`"450px"`
`width`	string	Chart width	`"100%"`
`theme`	string	Visual theme	`"Material"`
`background`	string	Background color	`"#ffffff"`

属性	类型	描述	示例
`enableSmartLabels`	boolean	自动排列标签避免重叠	`true`
`center`	object	图表中心位置（x、y百分比）	`{x: "50%", y: "50%"}`
`legendSettings`	object	图例配置（位置、对齐方式）	`{visible: true, position: 'Right'}`
`tooltipSettings`	object	工具提示配置与模板	`{enable: true, format: '${point.x}: ${point.y}'}`
`title`	string	图表标题文本	`"Browser Market Share"`
`height`	string	图表高度	`"450px"`
`width`	string	图表宽度	`"100%"`
`theme`	string	视觉主题	`"Material"`
`background`	string	背景颜色	`"#ffffff"`

AccumulationSeries Properties

AccumulationSeries属性

Property	Type	Description	Example
`type`	string	Chart type: Pie, Pyramid, Funnel (Doughnut = Pie + innerRadius)	`"Pie"`
`dataSource`	object[]	Data collection	`@chartData`
`xName`	string	Field for category labels	`"xValue"`
`yName`	string	Field for values	`"yValue"`
`radius`	string	Chart radius (percentage or pixel)	`"80%"`
`innerRadius`	string	Inner radius for doughnut (percentage)	`"40%"`
`startAngle`	number	Start angle in degrees	`0`
`endAngle`	number	End angle in degrees	`360`
`explode`	boolean	Enable slice explosion on click	`true`
`explodeIndex`	number	Index of pre-exploded slice	`2`
`explodeOffset`	string	Explode distance	`"10%"`
`groupTo`	string	Threshold for grouping	`"11"`
`groupMode`	string	Group by: Point, Value	`"Value"`

属性	类型	描述	示例
`type`	string	图表类型：Pie、Pyramid、Funnel（Doughnut = Pie + innerRadius）	`"Pie"`
`dataSource`	object[]	数据集	`@chartData`
`xName`	string	分类标签对应的字段	`"xValue"`
`yName`	string	数值对应的字段	`"yValue"`
`radius`	string	图表半径（百分比或像素）	`"80%"`
`innerRadius`	string	环形图内半径（百分比）	`"40%"`
`startAngle`	number	起始角度（度）	`0`
`endAngle`	number	结束角度（度）	`360`
`explode`	boolean	启用点击弹出切片功能	`true`
`explodeIndex`	number	预弹出切片的索引	`2`
`explodeOffset`	string	弹出距离	`"10%"`
`groupTo`	string	分组阈值	`"11"`
`groupMode`	string	分组依据：Point、Value	`"Value"`

DataLabel Properties

DataLabel属性

Property	Type	Description	Example
`visible`	boolean	Show/hide data labels	`true`
`position`	string	Inside or Outside	`"Outside"`
`name`	string	Field name for label text	`"text"`
`template`	string	Custom HTML template	`"<div>${point.x}: ${point.y}%</div>"`
`connectorStyle`	string	Line or Curve	`"Curve"`
`font`	object	Font customization	`{size: '12px', color: '#000'}`

属性	类型	描述	示例
`visible`	boolean	显示/隐藏数据标签	`true`
`position`	string	内部或外部	`"Outside"`
`name`	string	标签文本对应的字段名	`"text"`
`template`	string	自定义HTML模板	`"<div>${point.x}: ${point.y}%</div>"`
`connectorStyle`	string	直线或曲线	`"Curve"`
`font`	object	字体自定义	`{size: '12px', color: '#000'}`

Common Use Cases

常见使用场景

1. Market Share Analysis

1. 市场份额分析

Display product/service market distribution with pie charts showing competitor percentages.

用饼图展示竞品占比，呈现产品/服务的市场分布情况。

2. Budget Allocation

2. 预算分配

Visualize department spending or resource allocation with doughnut charts and center totals.

用环形图和中心总数值可视化部门支出或资源分配情况。

3. Survey Results

3. 调查结果

Present poll or survey responses with grouped categories for small values.

用分组分类展示投票或调查的反馈结果，合并小占比选项。

4. Sales Funnel Tracking

4. 销售漏斗追踪

Monitor conversion stages from leads to customers using funnel charts.

用漏斗图监控从线索到客户的转化阶段。

5. Organizational Hierarchy

5. 组织架构

Display team size distribution or role distribution with pyramid charts.

用金字塔图展示团队规模分布或角色分布。

6. Mobile Dashboards

6. 移动端仪表盘

Create responsive data visualizations optimized for touch interactions and small screens.

创建适配触摸交互和小屏幕的响应式数据可视化图表。

7. Report Generation

7. 报告生成

Export charts as images or PDFs for automated reporting systems.

将图表导出为图片或PDF，用于自动化报告系统。

8. Real-Time Monitoring

8. 实时监控

Update charts dynamically to show live statistics (server status, user activity).

动态更新图表展示实时统计数据（服务器状态、用户活跃度）。

Related Components

Browser Support

浏览器支持

Chrome (latest)
Firefox (latest)
Safari (latest)
Edge (latest)
Opera (latest)

Chrome（最新版）
Firefox（最新版）
Safari（最新版）
Edge（最新版）
Opera（最新版）

Additional Resources

额外资源

Next Steps:

Read getting-started.md for detailed installation
Explore chart-types.md for type-specific features
Review data-visualization.md for styling
Check accessibility.md for compliance requirements

后续步骤：

阅读 getting-started.md 了解详细安装流程
查看 chart-types.md 了解不同图表类型的特性
参考 data-visualization.md 学习样式自定义
查阅 accessibility.md 满足合规要求

syncfusion-aspnetcore-accumulation-chart

Original

Translation

Implementing Syncfusion ASP.NET Core Accumulation Charts

实现Syncfusion ASP.NET Core Accumulation Charts

When to Use This Skill

何时使用本技能

Component Overview

组件概述

Documentation and Navigation Guide

文档与导航指南

Getting Started

入门指南

Chart Types and Variants

图表类型与变体

Data Visualization Features

数据可视化功能

Data Handling

数据处理

Advanced Features

高级功能

Accessibility

无障碍功能

Quick Start Example

快速入门示例

1. Install Package

1. 安装包

2. Register Tag Helper (~/Pages/_ViewImports.cshtml)

2. 注册Tag Helper (~/Pages/_ViewImports.cshtml)

3. Add Scripts (~/Pages/Shared/_Layout.cshtml)

3. 添加脚本 (~/Pages/Shared/_Layout.cshtml)

4. Create Pie Chart (~/Pages/Index.cshtml)

4. 创建饼图 (~/Pages/Index.cshtml)

5. Define Data Model (~/Pages/Index.cshtml.cs or separate class)

5. 定义数据模型 (~/Pages/Index.cshtml.cs 或独立类)

Common Patterns

常用实现模式

Pattern 1: Doughnut Chart with Center Label

模式1：带中心标签的环形图

Pattern 2: Pie Chart with Smart Labels and Tooltips

模式2：带智能标签和工具提示的饼图

Pattern 3: Grouped Data with Small Values

模式3：小数值分组数据

Pattern 4: Funnel Chart with Export

模式4：带导出功能的漏斗图

API Reference

API参考

AccumulationChart Class

AccumulationChart类

Constructor

构造函数

Core Properties

核心属性

Event Properties

事件属性

AccumulationSeries Class

AccumulationSeries类

Properties

属性

AccumulationDataLabelSettings Class

AccumulationDataLabelSettings类

Properties

属性

AccumulationChartLegendSettings Class

AccumulationChartLegendSettings类

Properties

属性

AccumulationChartTooltipSettings Class

AccumulationChartTooltipSettings类

Properties

属性

Available Enumerations

可用枚举

Related Classes

相关类

Key Properties

核心属性

AccumulationChart Properties

AccumulationChart属性

AccumulationSeries Properties