Please note, this is a STATIC archive of website developer.mozilla.org from November 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

This document is in progress to be translated. That's why it still contains text in another language.
Feel free to register and to help translate MDN!

<canvas>HTML5 的新元素,可透過 Script(通常是 JavaScript)繪製圖形。例如,可以用來繪圖、合成圖照片、建立動畫、甚至處理即時的影片播放。

Mozilla 應用程式從 Gecko 1.8(也就是 Firefox 1.5)起開始支援 <canvas>。這個元素最初由蘋果 OS X Dashboard 和 Safari 引入。Internet Explorer 9 以上版本也有支援 <canvas>,但較舊的 IE 版本則須嵌入 Google Explorer Canvas 專案中的程式腳本,才能得到有效的支援。Opera 9 也支援 <canvas>

文件

規格
<canvas> 元素屬於 WhatWG Web applications 1.0 規範,這個規範又稱為 HTML 5。
使用 Canvas 繪製圖形
一頁簡介 <canvas>.
Canvas 教學
涵蓋 <canvas> 基本用法和進階特性的全面性教學。
代碼片斷:Canvas
以開發者為導向的代碼片斷,包括 <canvas>
Canvas 範例
一些 <canvas> 演示。
在 canvas 裡繪製文字
從 Firefox 3 開始支援的 <canvas> 新特性的文件
Canvas 圖表

檢視全部...

社群

* 查閱 Mozilla 討論區...

Resources

Libraries

  • libCanvas 是一個強大且輕量化的 canvas 框架
  • Processing.js 是視覺化程式語言 Processing 的移植版
  • EaselJS 是一個擁有類似 Flash API 的函式庫
  • PlotKit 是一個製作圖表和圖形的函式庫
  • Rekapi 是一個用來控制動畫影格的 Canvas API
  • PhiloGL 是一個可應用在資料視覺化、遊戲開發的 WebGL 框架
  • JavaScript InfoVis Toolkit 可在網頁上建立 2D 的互動式 Canvas 視覺化資料

HTMLJavaScriptCSSAJAXDOMSVG

文件標籤與貢獻者

 此頁面的貢獻者: fscholz, teoli, elin, ethertank, dextra, Kennyluck, happysadman
 最近更新: teoli,