讀研究所是種挑戰,因為老闆和自己總是產生匪夷所思的想法。比如說論文太空虛,就會想要多用點圖表,但用圖表又太單調的話,就想要讓圖表動起來。有這種想法的人很多,可是怎麼做呢?有些商業軟體如Swiff Chart Generator可以幫你輕易做到這些,不過這樣的軟體也所費不少。今天要介紹的,是免費的amCarts。
amCharts是免費的,在使用上也需要多幾個步驟,不過我個人認為還算容易,只要搞懂幾行程式,很容易就做到了。首先要決定想要畫哪種圖表。這次的範例用常見的Column & Bar chart,還有許多的範例可在amCharts的官方網站找到。下面是這一次的完成圖。
- 首先,到amCharts的下載區,找Column & Bar charts,下載之後解壓縮。
- 從amCharts的examples裡,複製amcolumn1.html檔案,改檔名為test.html檔,把下面這段:
so.addVariable(“settings_file”, escape(“amcolumn/amcolumn1/amcolumn_settings.xml”))改成
so.addVariable(“settings_file”, escape(“setting.xml”)); - 在同一個檔裡,把<script type=”text/javascript” src=”../amcolumn/swfobject.js”></script>
改成
<script type=”text/javascript” src=”swfobject.js”></script> - 同樣一個檔,把
var so = new SWFObject(“../amcolumn/amcolumn.swf”, “amcolumn”, “520”, “380”, “8”, “#FFFFFF”);
改成
var so = new SWFObject(“amcolumn.swf”, “amcolumn”, “520”, “380”, “8”, “#FFFFFF”); - 如果你的原始資料是excel而不是xml,把這段
so.addVariable(“data_file”, escape(“amcolumn/amcolumn1/amcolumn_data.xml”));
改成這段
so.addVariable(“data_file”, escape(“data.txt”)); - 如果要準備簡報,得另外開一個資料夾presentation,把test.html放過去。另外,amCharts下有一個amColumn資料夾,把整個資料夾複製到presentation底下。
- 剛我們改了設定檔setting.xml和資料檔data.txt。setting檔在amcolumn_1.5.2.0amcolumn底下,叫amcolumn_settings.xml,把它複製之後,改名為setting.xml,並複製到presentation這個資料夾的根目錄。amcolumn.swf與swfobject.js也同樣複製過去。
- 打開setting.xml檔,找到這一段 <data_type>xml</data_type> ,改成 <data_type>csv</data_type> 。因為現在的資料格式是csv,不是xml。
- 現在是資料的部分。這邊有點tricky,雖然它說是csv檔,但讀的是txt,而且是有固定格式的。第一個是x軸,用;分開,第二個數字是y軸,如果有多個,一樣用;分開。範例如下:
1949;2.54;20.21
1950;5.51;19.73
1951;2.53;18.43
1952;2.53;18.08
1953;2.68;19.01
1954;2.78;19.57
1955;2.77;19.58
1956;2.79;19.43
1957;3.09;40.83
1958;9.01;19.73
記得把你的資料弄好,存成data.txt,存在presentation資料夾的根目錄。
- 打開網頁,應該就可以看到會動的圖表了。據官方網站的說明,這個Flash chart是可以插入到PowerPoint的,不過我的Vista不幸功成身退(淚),等我修好了之後,再跟大家分享。