syncfusion-winui-cartesian-charts

用途

Syncfusion WinUI Cartesian Charts 提供 SfCartesianChart 控件，用于在 WinUI 应用中通过二维坐标系统进行数据可视化。当需要创建柱状图、折线图、面积图、条形图、散点图、气泡图、金融图或堆叠图，并配置坐标轴、实现高性能大数据渲染、添加交互探索功能或自定义图表外观时，可使用此技能。适合时间序列分析、跨类别比较、趋势分析、金融数据（OHLC）展示和科学绘图等矩形坐标系场景。

主要能力

系列类型

基础系列：Column、Bar、Line、Area
专用系列：Scatter、Bubble、Candle、OHLC
堆叠系列：Stacked Column/Bar/Line/Area、Stacked100
快速系列：FastLine、FastLineBitmap、FastColumn、FastScatter、FastStepLine（针对百万级数据点优化）

坐标轴

类型：NumericalAxis、CategoryAxis、DateTimeAxis、LogarithmicAxis
支持多轴、自定义间隔、范围自定义、反转与对侧定位
标签、标题、网格线、刻度线、填充、自动滚动等自定义

交互功能

缩放与平移（触摸/鼠标）
工具提示（支持自定义模板）
轨迹球（多系列跟踪）
十字准线（精确读数）
数据段与系列选择

自定义

图例（定位与模板）
数据标签（定位与格式化）
图表标题与页眉
ChartArea、PlotArea 样式、调色板与主题

数据与性能

支持绑定 ObservableCollection、List 或任意 IEnumerable 并自动更新
支持实时数据动态更新
快速系列可处理百万级数据点
支持触摸与鼠标完整手势（捏合缩放、平移、悬停工具提示）
适配 WinUI 无障碍标准（键盘导航、屏幕阅读器）
响应容器尺寸变化并自动优化轴标签

使用方式

通过 NuGet 安装 Syncfusion.Chart.WinUI 包，导入命名空间并初始化控件，创建带数据绑定的 ViewModel，配置 XAxes 与 YAxes，然后添加系列。技能文档中包含可直接使用的 XAML 与 C# 示例，涵盖 ColumnSeries 基础示例、多系列对比、带缩放的时间序列折线图、堆叠图、大数据量快速系列、金融多轴图等模式。常用属性包括：SfCartesianChart 的 Header、XAxes、YAxes、Series、Legend、ZoomPanBehavior、PaletteBrushes；ChartSeries 基类的 ItemsSource、XBindingPath、YBindingPath、Label、ShowDataLabels、EnableTooltip、EnableAnimation、XAxisName、YAxisName；Axis 基类的 Header、Interval、Minimum、Maximum、LabelRotation、LabelStyle、ShowMajorGridLines、IsInversed、OpposedPosition。

适用场景

类别对比（柱状图、条形图）
趋势与时间序列（折线图、日期时间轴）
部分与整体分析（堆叠系列、Stacked100）
相关性分析（散点图、气泡图）
金融数据（K线、OHLC）
大规模数据实时仪表盘与监控
多坐标系混合展示（如价格与成交量分轴）

限制与替代

快速系列交互能力有限：不支持数据段选择，工具提示自定义受限
数据集超过 10,000 点时建议改用快速系列；超过 100,000 点时建议使用 FastLineBitmap、FastColumnBitmap 或 FastScatterBitmap
环形关系应使用 SfCircularChart（饼图、圆环图、径向条形图）
层次数据应使用 SfPyramidChart 或 SfFunnelChart
方向性数据应使用 SfPolarChart

快速示例

<Window xmlns:chart="using:Syncfusion.UI.Xaml.Charts">
    <chart:SfCartesianChart Header="Sales Comparison">
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis Header="Products"/>
        </chart:SfCartesianChart.XAxes>
        <chart:SfCartesianChart.YAxes>
            <chart:NumericalAxis Header="Sales ($)"/>
        </chart:SfCartesianChart.YAxes>
        <chart:ColumnSeries ItemsSource="{Binding SalesData}"
                            XBindingPath="Product" YBindingPath="Amount"
                            Label="Q1 Sales" ShowDataLabels="True"/>
    </chart:SfCartesianChart>
</Window>

public class SalesData
{
    public string Product { get; set; }
    public double Amount { get; set; }
}

public class ViewModel
{
    public List<SalesData> SalesData { get; set; } = new()
    {
        new() { Product = "Product A", Amount = 25000 },
        new() { Product = "Product B", Amount = 38000 },
        new() { Product = "Product C", Amount = 17000 }
    };
}

文档结构

入门：references/getting-started.md
坐标轴：references/axis-types.md、axis-customization.md、multiple-axes.md
系列：references/basic-series.md、specialized-series.md、stacked-series.md、fast-series.md
交互：references/tooltip-trackball-crosshair.md、selection.md、zooming-panning.md
自定义：references/data-labels.md、legend.md、multiple-series.md、appearance-customization.md