HTML5 Canvas 是用於繪製圖形於網頁上
必須使用 Javascript 來繪製
一個 Canvas 即為一個矩形區域，你可以控制它的每一個像素(Pixel)。
Canvas 提供了幾種方法來繪製各種圖形，或是增加圖片。
以下為 Canvas 宣告方式 指定 id、width、height
<canvas id="myCanvas" width="200" height="100"></canvas>
Canvas 並無屬性可以用來繪製，所有的動作必須使用 Javascript 來操作，以下範例。
<script type="text/javascript">
// 取得 Canvas 元素
var c=document.getElementById("myCanvas");
// 建立繪製物件
var ctx=c.getContext("2d");
// 設定顏色
ctx.fillStyle="#FF0000";
// 設定範圍 參數分別為 shape, position, size
ctx.fillRect(0,0,150,75);
</script>
結果如下圖
文章標籤
全站熱搜
Technology (30)