open flash chart2 php,open flash chart--2

安裝 OFC2：這個部分有點麻煩，第一個原因是該網頁中含有多個版本，至於哪個版本比較好也沒有清楚的說明；第二個原因是OFC2 開發的時間是 2009 年，似乎舊了一些。最近找到了另一個新版本，目前從測試的結果來看，似乎網頁上的範例都 OK，至於新版本有沒有提供新的功能，我需要找時間再試試看。以下針對我測試過的兩個版本進行說明：

Version 2 Lug Wyrm Charmer (28th, July 2009)：

請到 OFC2 下載網頁 下載 Version 2 Lug Wyrm Charmer (28th, July 2009)，檔案名稱為 open-flash-chart-2-Lug-Wyrm-Charmer.zip。

請將該壓縮檔進行解壓縮。

解壓縮之後，它包含有 12 個目錄(如 js, php-ofc-library, php5-ofc-library 等)以及兩個檔案(分別是 README.txt 和 open-flash-chart.swf)；請將 open-flash-chart.swf 以及 js 目錄分別複製於 tomcat/webapps/test。

OFC2 Community Release：這個版本是在 OFC2 討論區 中看到的。從討論區的字裡行間看出，似乎 OFC2 原作者已經不再進行更新了，因此 OFC2 社群中有人跳出來進行持續更新。

請到 OFC2 Community Release 下載網頁 下載最新版本，我們正在測試 open-flash-chart-2-community-0.25.zip。

請將該壓縮檔進行解壓縮。

解壓縮之後，請將 open-flash-chart.swf 以及 js 目錄分別複製於 tomcat/webapps/test。

從第一個範例中，我們可以知道目前介紹的 open-flash-chart.swf 是無法讓 Y 軸上的標籤出現中文的(例如，將 data.json 中的 "Open Flash Chart" 改成 "次數"， open-flash-chart.swf 是不會呈現任何結果的)。如果讀者一定需要在 Y 軸出現中文，甚至希望在 X 軸上的中文可以轉動某個角度，那麼可以 下載 這個版本；該版本的修改範圍如 說明。請注意： 下載檔是一個 zip 檔，解壓縮之後的檔案為 open_flash_chart.swf(是底線)，而該檔案的大小大約 7 個 MB，與原先不到 300 多 KB 的檔案比起來，明顯大很多，使用時要注意頻寬的問題。

安裝 OFC2 的 Java 套件：

解壓縮該 ZIP 檔之後，請將 jofc2-1.0-0.jar 以及 xstream-1.3.1.jar(在解壓縮後的 lib 目錄內)複製到 tomcat\common\lib 或者 tomcat\shared\lib 內。

由於 JOFC2 的測試需要寫程式，所以這部份的測試留到開始介紹 JSP 程式時才說明，我們先測試 OFC2 的安裝是否正確。請將下列資料檔案，命名為 data.json 並將其放置於 tomcat/webapps/test。請注意： 當你編輯 data.json 的時候，由於 OFC2 只能正確的解讀 UTF-8 的資料，所以在資料中包含有中文的資料時，請以 UTF-8 的編碼方式儲存；以"記事本"為例，在儲存檔案時，請在"編碼"的地方，選擇 UTF-8。

{

"title":{

"text": "測試資料",

"style": "{font-size: 20px; color:#0000ff; font-family: Verdana; text-align: center;}"

},

"y_legend":{

"text": "Open Flash Chart",

"style": "{color: #736AFF; font-size: 12px;}"

},

"elements":[

{

"type": "bar",

"alpha": 0.5,

"colour": "#9933CC",

"text": "Page views",

"font-size": 10,

"values" : [9,6,7,9,5,7,6,9,7]

},

{

"type": "bar",

"alpha": 0.5,

"colour": "#CC9933",

"text": "Page views 2",

"font-size": 10,

"values" : [6,7,9,5,7,6,9,7,3]

}

],

"x_axis":{

"stroke":1,

"tick_height":10,

"colour":"#d000d0",

"grid_colour":"#00ff00",

"labels": {

"labels": ["一月","二月","March","April","May","June","July","August","Spetember"]

}

},

"y_axis":{

"stroke": 4,

"tick_length": 3,

"colour": "#d000d0",

"grid_colour": "#00ff00",

"offset": 0,

"max": 20

}

} 請利用編輯器將下列 HTML 檔存成 ofc0.html 檔：

swfobject.embedSWF("open-flash-chart.swf", "my_chart", "500", "250", "9.0.0");

第一個範例：使用 SWFObject.js

最後，請在瀏覽器的 URL 欄輸入 http://localhost:8080/test/ofc0.html?ofc=data.json，你應該會看到類似之前的圖表；你也可以點一下 測試頁 來看一下結果。

在測試 OFC2 的過程中，我試圖將圖表中 Y 軸的標籤進行更改；例如我希望將範例圖表中的 "Open Flash Chart" 換成 "次數"，但是"次數"無法顯示出來，似乎 OFC2 無法將中文顯示在 Y 軸的標籤。練習題： 請試著將 data.json 中 y_legend 後的 Open Flash Chart 換成 次數，並將 data.json 轉存成 wdata.json，然後輸入 http://localhost:8080/test/ofc0.html?ofc=wdata.json 試試看！