網頁畫圖的相關技術

【前言】
目前常見的是 Flash，還有最近新起的 Silverlight，至於其他技術都已經有點歷史了。

個人比較推薦 Silverlight 其次是 Flash，主因是 SL 它可跨瀏覽器、系統平台，加上鄙人使用 ASP.NET 來寫網頁，整合到 M$ 的相關技術產品比較不會有問題。若想將 Silverlight 用在其他作業系統平台、網頁技術，可以找找 Moonlight 的討論。

除了下列技術之外，倘若是要繪製特定圖表、曲線等等，亦可找找別人已經設計好的 Javascript 物件直接套用，只是要注意授權問題。



【Flash】
這是大家所常見又熟知的網頁動畫技術，附加第三方程式(如 Adobe Flash Player)後即可在瀏覽器上瀏覽，現為阿土伯(Adobe)公司所擁有。
畫2D動畫、影音播放等都有相當多的應用，較進階的技巧則需要學習 ActionScript 語言。至於3D繪製可能還要等一陣子。



【Silverlight，銀光】
它是最近微軟發展出來的技術，主要使用 XML 格式的語言描述向量圖，目前最新版為 3.0。
效能聽說比其他技術還要好，但其他技術敝人沒能力去撰寫，無從考察比較。
其中 Silverlight 1.0 版只能使用 Javascript 撰寫，且有中文字體授權問題(聽說 M$ 已經在修改相關授權內容)。
其 2.0 後版本使用 C#、VB.NET 語法撰寫時，需要搭配 Visual Studio 2008。



【VML，Vector Markup Language 向量標記語言】
據說是微軟、Macromedia 等公司提出的標準，它是一種能在 IE 瀏覽器 5.0 後版本上動態繪製向量圖的技術，使用 XML 格式所撰寫。
其中，Macromedia 就是發展 Flash 的原著公司(有點納悶的是為什麼有 VML 後,卻自行發展 Flash)，只是被阿土伯收購了(「吞很大」唷…)。
自從 M$ 推出 Silverlight 後，似乎沒有打算再維護 VML 了。而且，其他家的瀏覽器也不能用…。



【SVG，Scalable Vector Graphics 可縮放向量圖形】
它也是使用 XML 語言來描述二維向量圖形的規格。若在該檔案內加入ECMAScript(如 Javascript)可用來控制動畫。
也是要附加第三方程式(如 Adobe SVG Viewer)才能在瀏覽器上瀏覽。



【結語】
以上敝人僅知道的相關技術，在學習過程中，還發現居然有人用表格的方式來畫圖，同學可能不太清楚其意思吧！？
就是表格背景色來「拼圖」這令我蠻傻眼的…但也佩服他的精神！(他可能是 Designer 高手兼瘋子吧…)
另外，我有使用了一下對岸大大自己建立的繪圖物件(javascript所撰寫)，透過修改 Style 樣式做到基本畫圖，只是每畫一次線條，瀏覽器就會停滯更久，幾乎是畫前面一條線的兩倍時間…(原因不明,該不會扯上時間複雜度了吧…)。

為了在網頁上畫心電圖並且呈現出來，花了相當多的時間在尋找技術、答案。
當初還傻傻的以為 Javascript 可以直接畫圖，結果才知道是要自己設計物件…。
憑著 JS 新人的知識，就想直接跳進去設計物件實在是自不量力，翻閱很多相關書籍都沒有講到真正的「畫圖」感到很無助。

聽過可以用 CGI 去做，但是安全可能堪慮吧？且現在相關技術支援…。

後來自己擬定在網頁呈現心電圖方法…每次畫一張圖片然後定時更新到網頁上來呈現(使用ASP.NET、GDI+)。
雖然網頁更新可以使用 AJAX 去改善，但是私底下還是非同步不斷向網頁伺服器請求回應心電圖，要是人多的時候，可能會導致伺服器當機吧？

因此，又改想把心電的數據直接傳給客戶端網頁，然後讓 Client 端的技術依照數據去畫圖，來迴避對網頁伺服器的長期網頁要求。

最後，接觸了這些的相關技術，並列舉出來，給大家一個方向去學習。