|
hickness="{TemplateBinding BorderThickness}"
Padding="{TemplateBinding Padding}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!--轴线 X轴 Y轴-->
<amq:ValueAxis x:Name="PART_ValueAxis" Grid.Row="0" Margin="0,0,0,-2"
Canvas.ZIndex="100"
Foreground="{TemplateBinding AxisForeground}"
HorizontalAlignment="Right"
/>
<!--轴线上的类别-->
<amq:CategoryAxis x:Name="PART_CategoryAxis" Grid.Row="1"
Foreground="{TemplateBinding AxisForeground}"
/>
<!--图表网格-->
<Border Grid.Row="0" Background="{TemplateBinding PlotAreaBackground}">
<amq:ValueGrid x:Name="PART_ValueGrid" Foreground="{TemplateBinding GridStroke}" />
</Border>
<!--图形面板-->
<Border x:Name="PART_GraphCanvasDecorator" Grid.Row="0">
<Canvas x:Name="PART_GraphCanvas" Background="Transparent" />
</Border>
<!--图例-->
<amq:Legend x:Name="PART_Legend" Grid.Row="0"
Margin="10,0,0,0"
Visibility="{TemplateBinding LegendVisibility}"
VerticalAlignment="Top" HorizontalAlignment="Left"
/>
<!--标注-->
<Canvas Grid.Row="0">
<amq:Balloon x:Name="PART_Balloon"
BorderBrush="{TemplateBinding AxisForeground}"
BorderThickness="2"
Visibility="Collapsed"
/>
</Canvas>
</Grid>
</Border>
</ControlTemplate>
从SerialChart控件的样式里面可以看到SerialChart控件是由数值轴控件/Y轴控件（ValueAxis）、类别轴控件/X轴控件（CategoryAxis）、图表网格控件（ValueGrid）、图形面板（Canvas面板上添加LineGraph、ColumnGraph和AreaGraph控件）、图例控件（Legend）和标注控件（Balloon）组成的。其中图例和标注控件在上一小节已经讲解了，下面看一下其他的控件的实现原理以及如何使用SerialChart控件。
（1）数值轴控件/Y轴控件（ValueAxis）和类别轴控件/X轴控件（CategoryAxis）
ValueAxis和CategoryAxis控件的实现原理是基本一样的，打开它们的样式文件可以看到，轴控件是由两个Canvas面板和一个Rectangle控件组成，命名为PART_ValuesPanel的Canvas面板是用于显示轴上的数字，命名为PART_TickPanel的Canvas面板是用于显示轴上的刻度（数值和轴之间的小线段），Rectangle控件则是用于表示轴线。Y轴（ValueAxis）采用Grid面板的ColumnDefinitions来排列，X轴（CategoryAxis）则是采用RowDefinition。
（2）图表网格控件（ValueGrid）
ValueGrid控件是由一个Canvas面板组成，在使用ValueGrid控件的时候需要通过SetLocations方法来把图表的坐标数值传递进来，然后ValueGrid控件再根据坐标的数值在Canvas面板上来创建Line线段绘制成网格。
（3）LineGraph、ColumnGraph和AreaGraph控件
LineGraph、ColumnGraph和AreaGraph控件是SerialChart图表里面最核心的图形，这三个控件的XAML样式文件都是只有一个Canvas面板，三个控件类都继承SerialGraph抽象类，SerialGraph类封装了三个控件共性的一些属性，如Locations（图表数据的点集合）、XStep（X轴的两个值的间距）等。LineGraph控件表示线性图，实现的原理是通过图表的数据点集合来创建一个Polyline图形添加到Canvas面板上。ColumnGraph控件则是使用Path来绘制柱形的形状。AreaGraph控件使用Polygon图形来绘制区域图。
（4）SerialChart控件
SerialChart控件把各大模块组成连续图形图表的原理和PieChart控件是一样的流程，只是在PieChart控件里面初始化的是Slice控件，而在SerialChart控件里面初始化的是LineGraph、ColumnGraph和A |