欣設計,網頁設計,RWD網頁設計,網頁設計公司  有感諮詢 02-8221-2516

<canvas>

&lt;canvas&gt;通過JavaScript動態繪製圖形。而&lt;canvas&gt;元素只是用於圖形的容器。通過&lt;canvas&gt;可以在網頁上製作許多動態圖形。

先簡單舉個例子

<canvas id="testCanvas" width="200" height="100" style="border:1px solid #000000;">
</canvas>


var canvas = document.getElementById("testCanvas");
var ctx = canvas.getContext("2d");
ctx.moveTo(2000); //定義線的起點
ctx.lineTo(0100); //定義線的終點
ctx.stroke(); //使用stroke()方法實際繪製線條

畫出來的樣子

可以畫文字

var c = document.getElementById("testCanvas");
var ctx = c.getContext("2d");
ctx.font = "30px Arial";
ctx.fillText("Hello World"1050);

 

空心字

var c = document.getElementById("testCanvas");
var ctx = c.getContext("2d");
ctx.font = "30px Arial";
ctx.strokeText("Hello World"1050);

回上頁

15年服務 有感諮詢

非常歡迎您洽詢,您將可以感受到我們的熱心.誠懇與專業!
洽詢時間:週一至週五10:00~17:00

02-8221-2516

或是

按此加入我們的LINE@
ID : @b2005

或是

按此
填寫聯繫表單,由我們連繫您