使用ListBox控制項來實現長條圖控制項（一）

最近在做一個WPF方面的項目，需要用到一些統計功能，需要製作一些長條圖和線狀圖。一般來說，傳統的長條圖和線狀圖的編寫方法都是：

1.       確定X軸和Y軸，把刻度分別在X軸和Y軸上畫出來。

2.       畫出X軸和Y軸，比如分別加上兩個箭頭之類的裝飾品。

3.       然後根據Y值，

a.       對於長條圖，將Y值轉換為長條圖裡面矩形的高度，根據X值確定矩形在X軸的位置。

b.      對於線狀圖，將Y值轉換為長條圖裡面點的高度，根據X值確定點在X軸的位置。

4.       如果長條圖裡面有多個資料序列的話，需要考慮使用不同的顏色來表示矩形，對於線狀圖也是一樣。

 

看起來，還是蠻麻煩的嘛。以下面的長條圖為例：

 

 

一個長條圖實際上由以下部分組成：

1.       座標軸，座標軸需要確定刻度，需要確定刻度的範圍，例如的小刻度與大刻度的寬度需要計算好。另外還需要根據座標軸表示的資料來確定大刻度代表多大的範圍，小刻度代表多大的範圍。這裡面就又涉及到，如果座標軸表示的資料是整數應該怎麼辦，資料是日期類型又應該怎麼辦，資料是字串類型又應該怎麼辦……。

座標軸除了需要考慮資料的問題以外，還需要考慮格式排版的問題，例如刻度是顯示在座標軸的下面（左邊），上面（右邊）還是直接顯示在座標軸上？座標軸的標題（Axis Title）如何顯示……

還需要考慮座標軸式樣的問題，例如有些人喜歡給座標軸添加一個小箭頭，表示資料的趨勢，因此在確定座標軸（長度或者高度）的時候，需要增加一點額外的空間（為箭頭做準備的）。

還有一些，例如如果使用者有需要，要求你的座標軸的刻度不是用字串顯示，而是用圖片顯示，你的 長條圖控制項需要能夠很方便地擴充到這種情況。

另外，座標軸的原點的位置也是可以變換的。例如，你可能需要指定X軸從Y軸的一個值穿過，而不是從0這個位置穿過，當然Y軸也可能會需要從X軸的非0值穿過。

2.       對於Y軸，還有一些特殊的需求，例如，有些時候，Y軸的值相差過大，比如說很多值可能在1以下，而又有一些值在1000以上，按照平常的10進位的刻度計量方法，不可避免地會有一些資料不能顯示，或者就是顯示的高度過大，不美觀。因此刻度的計量方法會有點變化，例如按照Log的方式來設定刻度（可以參考Office 2007裡面的長條圖設定介面來體驗這一點）……

 

3.       統計圖地區。長條圖裡面不應該只能顯示 一個系列的資料，的長條圖就可以顯示三個系列的資料（Series 1, Series 2和Series 3）。因此這就匯出了另外幾個問題：

a.       第一當然是每一個系列資料的矩形的高度應該是計算出來的，這個時候你需要確保Y軸的刻度和矩形的高度是相匹配的。

b.      如果有超過一個系列的資料的話，你需要用不同的醒目的顏色來標識不同的系列，請注意醒目的顏色就決定了我們不能使用隨機數來產生顏色，因為淺藍色和藍色之間的差別肯定沒有綠色和藍色之間的差別明顯。

c.       統計圖裡面可能要求顯示網格（寬度），這樣可以更直觀地顯示長條圖中矩形所代表的資料。

d.      使用者也可能會要求在長條圖上面顯示資料，跟我們例子裡面的長條圖的顯示方式一樣。當然，這個資料的擺放也會有講究，例如是放在矩形的上面，還是放在矩形的中間。

 

4.       統計圖的標題部分以及其他部分的布局。例如標題可以放在繪圖區域的上方，下方，左邊，右邊，或者使用者可以自己定義放在什麼地方。

 

5.       等等

 

6.       …

 

看起來，這個長條圖的確是有很多事情要做呀，路漫漫、革命尚未成功、未完待續。