資訊專欄INFORMATION COLUMN
摘要：是出現(xiàn)的新標(biāo)簽，主要用來畫圖，看見網(wǎng)上能用來實(shí)現(xiàn)各種圖形，所以感覺很好玩，就學(xué)習(xí)了一下。
canvas是html5出現(xiàn)的新標(biāo)簽，主要用來畫圖，看見網(wǎng)上能用來實(shí)現(xiàn)各種圖形，所以感覺很好玩，就學(xué)習(xí)了一下。
canvas繪制圖形有兩種方法：
context.fill() //填充
context.stroke() //繪制邊框
在繪制圖形前要設(shè)置好圖形樣式，也有兩種方法：
context.fillStyle() //填充的樣式
context.strokeStyle() //邊框樣式
下面就開始繪制各種圖形
繪制矩形
context.fillRect(x,y,width,height)
context.fillRect(x,y,width,height)
x : 矩形的起點(diǎn)橫坐標(biāo)
y : 矩形的起點(diǎn)縱坐標(biāo)
width : 矩形的寬度
function draw(){
var canvas = document.getElementById("chen"),
context = canvas.getContext("2d");
canvas.width = 100;
canvas.height = 100;
context.fillStyle = "red"; //發(fā)現(xiàn)要先設(shè)置填充顏色
context.fillRect(0, 0, 100 ,100);
context.strokeRect(0, 100, 100 ,100);
}
draw();
圓
context.arc(x,y,radius,starAngle,endAngle, anticlockwose)
radius : 半徑
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/79904.html
摘要：是新加的標(biāo)簽，主要有和，的應(yīng)用是動畫和圖像，的應(yīng)用是游戲渲染。 HTML5 Canvas canvas是html5新加的標(biāo)簽，主要有2D和3D，2D的應(yīng)用是動畫和圖像，3D的應(yīng)用是游戲渲染。 1. 2D基礎(chǔ) 1.1繪制線 canvas window.onload = function(){ ...
摘要：是出現(xiàn)的新標(biāo)簽，主要用來畫圖，看見網(wǎng)上能用來實(shí)現(xiàn)各種圖形，所以感覺很好玩，就學(xué)習(xí)了一下。 canvas是html5出現(xiàn)的新標(biāo)簽，主要用來畫圖，看見網(wǎng)上能用來實(shí)現(xiàn)各種圖形，所以感覺很好玩，就學(xué)習(xí)了一下。canvas繪制圖形有兩種方法： context.fill() //填充 context.stroke() //繪制邊框 在繪制圖形...
閱讀 3350·2021-11-10 11:36
閱讀 3247·2021-10-08 10:21
閱讀 2843·2021-09-29 09:35
閱讀 2424·2021-09-22 16:06
閱讀 3975·2021-09-09 09:33
閱讀 1334·2019-08-30 15:44
閱讀 3175·2019-08-30 10:59
閱讀 2988·2019-08-29 15:32
