<ComponentOne Studio for WPF下載>

在上文中，我們?yōu)榇蠹?介紹了C1Chart的類型。C1Chart圖表是如何展示數(shù)據(jù)的呢？下面就和小編一起來(lái)了解圖表的核心：數(shù)據(jù)。

C1Chart可以綁定到任何一個(gè)繼承了System.Collections.IEnumerable接口的對(duì)象（比如XmlDataProvider, DataSet, DataView等）。通過(guò)設(shè)置ItemsSource屬性，就可以將C1Chart控件綁定到datatable。下面介紹將數(shù)據(jù)傳遞到C1Chart控件的不同的數(shù)據(jù)綁定方法。

值集合

其中一種傳遞數(shù)據(jù)到圖表的方法，就是使用ValueSource屬性綁定到值集合。任何支持IEnumerable接口的數(shù)字集合都可以設(shè)置為data series的數(shù)據(jù)源。在上一節(jié)我們提到了data series類型，不同的data series類都有數(shù)據(jù)綁定的相應(yīng)屬性。比如，DataSeries類使用ValuesSource屬性做數(shù)據(jù)綁定。如下面例子所示，綁定的數(shù)據(jù)源為double類型的數(shù)據(jù)集合，首先我們需要定義數(shù)據(jù)源，然后將數(shù)據(jù)源綁定到C1Chart的DataSeries。分別用C#代碼和XAML代碼演示。

XAML代碼：

<!--Binding Source-->

<x:Array x:Key="array" Type="System:Double">

<System:Double>1</System:Double>

<System:Double>4</System:Double>

<System:Double>9</System:Double>

<System:Double>16</System:Double>

</x:Array>

<!--Binding Target -->

<c1:C1Chart Name="chart" ChartType="Column" >

<c1:C1Chart.Data>

<c1:ChartData>

<c1:DataSeries Label="s1" ValuesSource="{Binding Source={StaticResource array}}"/>

</c1:ChartData>

</c1:C1Chart.Data>

<c1:Legend></c1:Legend>

</c1:C1Chart>

如果不使用數(shù)據(jù)綁定，也可以用Values屬性很容易的實(shí)現(xiàn)，只要將值之間用空格分開(kāi)，具體的代碼如下：

<c1:DataSeries Values="1 2 9 16"/>

這樣的一句代碼就可以替換之前的設(shè)置數(shù)據(jù)源以及數(shù)據(jù)綁定的操作。另外在cs文件里也可以很容易的實(shí)現(xiàn)綁定。

C#代碼：

// Clear previous data
chart.Data.Children.Clear();
double[] values = { 1, 4, 9, 16 };
// Create column series
chart.Data.Children.Add(new DataSeries()
{
ValuesSource = values
});

以上代碼的具體示例可以參考如下Demo：

對(duì)象集合

如果您有一個(gè)對(duì)象集合包含數(shù)字屬性，就可以使用數(shù)據(jù)綁定。這時(shí)涉及到至少兩個(gè)屬性：

• ItemsSource屬性：分配對(duì)象的集合。
• ValueBinding屬性：獲取或設(shè)置圖表data series的值綁定。指定對(duì)象屬性提供數(shù)據(jù)值。

我們假定有一個(gè)序列點(diǎn)集，然后圖表展示它的數(shù)據(jù)。那么XAML代碼和C#代碼分別如下所示：

XAML代碼：

<x:Array x:Key="points" Type="Point">

<Point>0,0</Point>

<Point>10,0</Point>

<Point>10,10</Point>

<Point>0,10</Point>

<Point>5,5</Point>

</x:Array>

</Window.Resources>

<!--Binding Target -->

<c1:C1Chart Name="chart" ChartType="Column" >

<c1:C1Chart.Data>

<c1:ChartData ItemsSource="{Binding Source={StaticResource points}}">

<c1:DataSeries Label="s1" ValueBinding="{Binding Path=X}"/>

<c1:DataSeries Label="s2" ValueBinding="{Binding Path=Y}"/>

</c1:ChartData>

</c1:C1Chart.Data>

</c1:C1Chart>

如果使用將上述代碼在cs文件里描述，可以使用下面代碼來(lái)替換：

C#代碼：

//Clear chart data
chart.Data.Children.Clear();

//Create dummy data
points.Add(new Point(0, 20));
points.Add(new Point(1, 22));
points.Add(new Point(2, 19));
points.Add(new Point(3, 24));
points.Add(new Point(4, 29));
points.Add(new Point(5, 7));
points.Add(new Point(6, 12));
points.Add(new Point(7, 15));

//Setup C1Chart data series
XYDataSeries ds = new XYDataSeries();
ds.Label = "Series 1";
//Bind data series to collection
ds.ItemsSource = points;
//Important to set binding when using ItemsSource
ds.ValueBinding = new Binding("Y");
ds.XValueBinding = new Binding("X");
//Add data series to chart
chart.Data.Children.Add(ds);

上述代碼的示例如下所示：

在這個(gè)示例中，我們創(chuàng)建了2個(gè)data series，并且一個(gè)綁定到鼠標(biāo)的X，另一個(gè)綁定到鼠標(biāo)的Y。

PS: 關(guān)于ComponentOne，這些產(chǎn)品你可以關(guān)注>>

本文轉(zhuǎn)載自

葡萄城經(jīng)典UI產(chǎn)品惠風(fēng)迎春，驚喜折扣禮品送不停！優(yōu)惠詳情點(diǎn)擊查看>>