Studio for WPF:定制 C1WPFChart 标记

在本篇文章中，我们将阐述如何定制 C1WPFChart 数据点的标记。

下面分步讲解实现：

1.定制自定义样式：

  1: <Window.Resources>

  2:     <Style x:Key="happy" TargetType="{x:Type c1:PlotElement}">

  3:         <Setter Property="Stroke" Value="Transparent"/>

  4:         <Setter Property="Fill">

  5:             <Setter.Value>

  6:                 <ImageBrush>

  7:                     <ImageBrush.ImageSource>

  8:                         <BitmapImage UriSource=

"pack://application:,,,/Images/happy.jpg"/>

  9:                     </ImageBrush.ImageSource>

 10:                 </ImageBrush>

 11:             </Setter.Value>

 12:         </Setter>

 13:     </Style>

 14: </Window.Resources>

2.现在，我们可以指定自定义的 SymbolStyle 到 C1WPFChart 。

3.通过 XAML 加载样式：

  1: <c1:DataSeries Label="Growth" SymbolStyle="{StaticResource happy}" SymbolMarker="Box"  

SymbolSize="30,30" RenderMode="Default" Values="20 45 19 24 25 5 15 30 12 40" />

4.通过 http://helpcentral.componentone.com/nethelp/c1wpfchart/#!XMLDocuments/WPFChartRef/html/E_C1_WPF_C1Chart_DataSeries_PlotElementLoaded.htm 事件加载。

  1: private void DataSeries_PlotElementLoaded(object sender, EventArgs e)

  2: {

  3:     PlotElement pe = (PlotElement)sender;

  4:   

  5:     if (!(pe is Lines)) // skip lines

  6:     {

  7:         DataPoint dp = pe.DataPoint;

  8:         pe.Fill = new ImageBrush(new 

BitmapImage(new Uri("pack://application:,,,/Images/happy.jpg")));

  9:     }

 10: }

同时，通过后台代码进行不同图表数据标记的定制：

  1: private void DataSeries_PlotElementLoaded(object sender, EventArgs e)

  2: {

  3:     PlotElement pe = (PlotElement)sender;

  4:   

  5:     if (!(pe is Lines)) // skip lines

  6:     {

  7:         DataPoint dp = pe.DataPoint;

  8:         pe.Stroke = Brushes.Transparent;

  9:         if (dp.Value <= 20)

 10:         {

 11:             pe.Fill = new ImageBrush(new 

BitmapImage(new Uri("pack://application:,,,/Images/sad.jpg")));

 12:         }

 13:         else if (dp.Value > 20)

 14:         {

 15:             pe.Fill = new ImageBrush(new 

BitmapImage(new Uri("pack://application:,,,/Images/happy.jpg")));

 16:         }

 17:     }

 18: }

效果图：

Demo 下载：