HTML5Canvas让开发人员用简单的工具HTML.pdfVIP

前言 HTML5 Canvas讓開發人員用簡單的工具：HTML及JavaScript就可以在既有的瀏覽器上產 生動畫。Canvas是HTML5最常見到的功能之一。它提供了豐富的互動性視覺感受，以及 極大的彈性，無論你想在瀏覽器上做什麼都可以。但是與使用典型的JavaScript 開發（以 及Flash和Silverlight ）有點不太一樣，它需要更仔細的研究。【xv 】 執行本書的程式範例 關於編寫HTML5 Canvas最棒的一件事就是進入的門檻很低－你只需要一個當今的瀏覽器 與文字編輯器即可。就相容性而言，我們建議您使用以下這幾種最新版本的瀏覽器： 1. Chrome 2. Safari 3. Opera 4. Firefox 5. Internet Explorer （第9版，或更新的版本） 本書中的每一個範例都在Google Chrome 、Safari ，以及Opera 中測試過。最近開發的範例 程式在Firefox上測試會有一些問題。然而我們還是盡最大可能讓這些範例可以在各個不同 的瀏覽器上執行，在Canvas 尚未改善這些問題之前，我們建議您使用Google Chrome ，或 者是Safari才會有較好的執行結果。 xvi　　前言 請注意，如果您是使用本書的.pdf版本來做剪貼與複製程式碼以產生範例的話，在.pdf 上的減號（- ）會被其他的字元所取代，例如連字符號，此時你就需將該字元換回減號 （- ），好讓程式可以正確地執行。 如果您是購買本書的電子版，我們建議您使用書商提供您下載的程式碼，而印刷本裡的程 式範例做為指南即可。除了程式碼之外，您也要將其他的圖片、函式庫及必要的資訊都一 併取得，這樣所有的範例才可在瀏覽器上執行。 【xvi 】 您需要知道的一些事 理論上，您在這個領域撰寫程式應該知道還有其他種程式語言，例如C 、C++ 、C# 、 ActionScript 2 、ActionScrip 3 、Java及JavaScript 。如果您剛接觸這個領域，就某種程度而 言我們所介紹的Canvas ，是您必須對撰寫網頁程式有一定程度的熟悉。對於以HTML及 JavaScript開發網站的人員來說，應該是很容易就可以上手的。 如果您是Flash 開發者，JavaScript和ActionScript 1在本質上就是相同的語言。如同Adobe提 供了ActionScript 2一些函式庫一樣，您應該也會對JavaScript有一定程度的瞭解。如果您 只對ActionScript 3有經驗而已，JavaScript可能會讓您覺得更簡單不過了。 如果您是Silverlight或C#的程式開發者，請大口的深呼吸一下並想想在ASP.NET/C#那時候 您用VBScript 開發網站應用程式的情形；它們其實是很相似的。 本書的架構 本書總共有11章。前四章會先帶領您用範例的方式大略的看過HTML Canvas API 。主題含 蓋了文字、圖片與繪圖。這幾章也包含了一些用Canvas API設計而成的應用程式。接下來 的六個章節，透過更長的應用程式範例以增進您對Canvas API的熟軔度。在這幾章裡，我 們會討論到數學與物理運算程式、video 、audio 、games及mobile 。而最後一章是在介紹兩 個還在實驗階段的領域：3D與multiplayer 。 在本書內並沒有提供已經發佈於W3C的Canvas API之簡要說明部份；我們會對一些不適用 於遊戲的API做更詳細的說明。此外，您也可以在這個網站上閱讀相關的使用說明： /html5/2dcontext 我們的目標是運用Canvas特有的功能在網站上開發動畫、遊戲與娛樂的應用程式。 第一章 HTML5 Canvas簡介 HTML5是時下最夯的HTML （ ）。HTML在1993年首次被標準化之 超連結文件標示語言 後，從那刻起即點燃了網際網路的戰火。HTML是由一些在 裡的標記（tags ）來定義 網頁內容的一種方式。 【1】 HTML5 Canvas可以和JavaScript