C1Chart for WPF多轴:不同序列分区域显示

在阅读本文之前,建议阅读C1Chart for WPF初级教程-多轴图表,了解如何给图表添加多轴。

一个图表上,可以添加多个序列,多个序列都是显示在同一个区域中。本文就来介绍如何将多个序列分别显示在不同的区域,用以区分不同的序列。

基本步骤如下:

1.添加多个区域

首先为不同的序列创建多个区域。这里要使用ChartView的PlotAreas。

通过创建多个竖直的区域,并设置背景色。通过PlotArea的Column分区。

代码参考:

<c1:ChartView.PlotAreas>
                        <c1:PlotArea Background="LightBlue" Stroke="Blue" Column="0" ></c1:PlotArea>
                        <c1:PlotArea Background="LightGreen" Stroke="Green" Column="1"></c1:PlotArea>
                        <c1:PlotArea Background="LightGray" Stroke="Gray" Column="2"></c1:PlotArea>
                    </c1:ChartView.PlotAreas>

2.添加多轴

给图表添加多轴,并且指定每个轴对应不同的分区。设置Axis轴的PlotAreaInex属性给轴指定放置的区域。

本文添加了三个X轴,并给轴指定不同的区域,代码参考:

<c1:Axis AxisType="X" Min="0" Max="10" Position="Far" x:Name="axisx1" PlotAreaIndex="0"></c1:Axis>
                    <c1:Axis AxisType="X" Min="0" Max="20" Position="Far" x:Name="axisx2" PlotAreaIndex="1"></c1:Axis>
                    <c1:Axis AxisType="X" Min="0" Max="10" Position="Far" x:Name="axisx3" PlotAreaIndex="2"></c1:Axis>

 

3.给序列指定轴

通过序列的AxisX属性给序列指定对应的轴,以便数据能够在不同的分区展示。

代码参考:

<c1:ChartData >
                    <c1:XYDataSeries Label="s1-axis1" XValues="2 4 9"  AxisX="axisx1" Values="10 20 30"/>
                    <c1:XYDataSeries Label="s2-axis2" XValues="2 10 19"  AxisX="axisx2" Values="5 25 15"/>
                    <c1:XYDataSeries Label="s3-axis3" XValues="3 6 7"  AxisX="axisx3" Values="25 10 3"/>
                </c1:ChartData>

本文的效果如下图所示:

 

示例参考:

C1Chart_PlotArea.zip (9.95 kb)


更多资源

C1Chart的在线英文产品文档地址:

http://helpcentral.componentone.com/nethelp/c1wpfchart/#!Documents/componentonechartforwpf.htm

 

如果你对C1Chart感兴趣,请到我们的官网下载最新版本:/developer/componentone-winform/controls/chart

如果你有疑问,可以到GCDN论坛获得技术支持:http://gcdn.grapecity.com.cn/showforum-68.html

 

另外,更多信息,欢迎阅读《C1Chart for WPF初级教程》系列文章

初遇。Getting Started(上)

初遇。Getting Started(下)

类型。穿Prada的女王(上)

类型。穿Prada的女王(下)

数据。和数据源相关的那些事(一)

数据。和数据源相关的那些事(二)

数据。和数据源相关的那些事(三)

数据。和数据源相关的那些事(四)

标记和标签。撕名牌大战(一)

标记和标签。撕名牌大战(二)

标记和标签。撕名牌大战(三)

导出(PDF,EXCEL) 

多轴图表 

轴的动态绑定

实现轴注释的高级自定义

颜色和大小。数据点的自定义(一)

符号。数据点的自定义(二)

基础介绍。XAML动画(一)

基础介绍。XAML动画(二)

基础介绍。XAML动画(三)

基础介绍。XAML动画(四)