為什么要用visifire?

其實(shí)在微軟的silverlight toolkit中已經(jīng)有了圖表組件，但是筆者認(rèn)為其效果不如visifire的效果好，而且visifire中的每個(gè)數(shù)據(jù)點(diǎn)datapoint都可以被點(diǎn)擊到，這個(gè)在做BI相關(guān)項(xiàng)目的時(shí)候很重要，因?yàn)轭愃芼rill down/up和drill throught to detail的操作都得依賴這個(gè)來實(shí)現(xiàn)。

建立Silverlight項(xiàng)目：

打開Visual Studio 2008，選擇文件，新建Silverlight項(xiàng)目。新建項(xiàng)目的同時(shí)會(huì)提示是使用asp.net web項(xiàng)目來寄宿silverlight項(xiàng)目還是只使用一個(gè)簡(jiǎn)單的測(cè)試頁來寄宿silverlight項(xiàng)目。這里選擇asp.net web application項(xiàng)目。

Silverlight本身作為瀏覽器的插件是沒有System.Data 這樣的命名空間的，所以需要從數(shù)據(jù)庫(kù)或其它數(shù)據(jù)源獲取數(shù)據(jù)的話就需要通過webservice以及類似的方式，所以，為silverlight提供數(shù)據(jù)的webservice相關(guān)資源我們會(huì)建立在剛才的寄宿silverlight的asp.net web applition項(xiàng)目中。

添加Visifire到頁面中：

首先需要添加visifire引用到項(xiàng)目中。這里我們只需添加一個(gè)dll文件即可

其中WPFVisifire.Chart.dll是在WPF Application下使用的，SLVisifire.Charts.dll是在silverlight項(xiàng)目下使用的。

這里我們?cè)趧偛沤⒌膕ilverlight項(xiàng)目下右鍵單擊References，選擇Add References…，在彈出的Add Reference窗體下選擇Browse選項(xiàng)卡，定位到visifire下載目錄，找到SLVisifire.Charts.dll，然后單擊OK。

由于visual studio本身是不支持silverlight控件的設(shè)計(jì)時(shí)拖拽支持的，所以這里需要用到Blend2。右鍵單擊Page.xaml文件，選擇Open in Expression Blend…。只要正確安裝了Blend2+SP1，那么這個(gè)選項(xiàng)就會(huì)出現(xiàn)。

在Blend中，找到我們添加的visifire chart控件放到Page.xaml中，具體方法如下：

如上圖，在Blend的工具欄中找到>>這樣的按鈕，單擊它，會(huì)出現(xiàn)Asset Library對(duì)話框，選擇Custom Controls，然后單擊Chart。這個(gè)Chart就是我們要添加的Visifire chart?，F(xiàn)在鼠標(biāo)變成了一個(gè)十字型，在面板上勾畫一個(gè)矩形區(qū)域，至此visifire chart添加完畢。

Visifire 2以后的版本都帶了Blend設(shè)計(jì)時(shí)支持，所以在Blend里可以看到其占位符。此外，我們還需要給這個(gè)chart取一個(gè)名字（默認(rèn)是沒有名字的），好以后在c#文件里可以引用到它：

我們也可以在代碼中創(chuàng)建chart到面板中，visifire的document中有很多示例代碼，在此不作過多描述。

建立WebService服務(wù)：

回到visual studio中。由于數(shù)據(jù)來自于多維數(shù)據(jù)集，所以需要添加ADOMD.Net的引用。右鍵asp.net web application項(xiàng)目，選擇Add Reference…，找到Microsoft.AnalysisServices.AdomdClient，選擇10版本的，如下圖：

接下來添加服務(wù)文件，同樣右鍵asp.net web application項(xiàng)目，選擇Add-New Item…，在彈出的對(duì)話框中選擇Web Service，添加一個(gè)web服務(wù)到項(xiàng)目中。

打開這個(gè)服務(wù)文件，在頂部添加如下引用：

using Microsoft.AnalysisServices.AdomdClient;

Visual Studio會(huì)為我們默認(rèn)添加一個(gè)Hello World方法，刪除它，然后加入如下代碼：

[WebMethod]

public List<ChartItem> GetResult()

{

List<ChartItem> result = new List<ChartItem>();

AdomdConnection conn = new AdomdConnection();

conn.ConnectionString = "provider=msolap ;Integrated Security =SSPI ;Data Source= localhost ;Catalog = Adventure Works DW 2008 ;";

conn.Open();

AdomdCommand comm = new AdomdCommand();

comm.Connection = conn;

comm.CommandText = "select [Measures].[Reseller Order Count] on 0,[Product].[Category].[Category].members on 1 from [Sales Targets]";

AdomdDataReader dr = comm.ExecuteReader();

while (dr.Read())

{

ChartItem ci = new ChartItem();

ci.Title = dr[0].ToString();

ci.Value = double.Parse(dr[1].ToString());

result.Add(ci);

}

return result;

}

返回類型是List<ChartItem>，其中ChartItem是自定義的一個(gè)類，代碼如下：

public class ChartItem

{

public string Title { get; set; }

public double Value { get; set; }

}

數(shù)據(jù)的查詢過程和查詢數(shù)據(jù)庫(kù)的大同小異，只不過是針對(duì)多維數(shù)據(jù)集有專門的AdomdConnection和AdomdCommand等對(duì)象。接受結(jié)果用CellSet是比較多的，但是這里由于只用了一維的數(shù)列，結(jié)構(gòu)相對(duì)比較簡(jiǎn)單，所以用AdomdDataReader來接收就足夠了。然后dr.Read()循環(huán)創(chuàng)建ChartItem對(duì)象添加到類型為L(zhǎng)ist<ChartItem>的結(jié)果result中。