html5 canvas

Canvas用在网页上画图,使用javascript实现。Canvas是一个矩形,可以按要求控制上面的像素。可以画线、矩形、圆或者图像。

getContext(“2d”)是html5的一个内建对象,可以用来画图。

画图的思路:

获取到指定要画图元素;

获取context对象;

画矩形:

设置矩形的开始点和长宽;

设计矩形颜色;

填充矩形;

画线:

moveTo();//定义路径

lineTo();//定义路径

stroke();//描边,描绘路径

画圆:

beginPath();//画布开始

arc()设置原点、半径、转动角度和方向

closePath()结束画布

fill()填充圆

渐变:

CreateLinearGradient()创建渐变区域,渐变的起点和终点

addColorStop(0,)将渐变的起点和终点看做0到1,设置渐变区域

addColorStop(0,)将渐变的起点和终点看做0到1,设置渐变区域

fillStyle//设置填充类型

fillRect()填充区域。

画图:

image=new image();//新建图象

image.src="";//图象的路径

drawImage();//画图

http://jingpin.jikexueyuan.com/article/7728.html

https://blog.csdn.net/dotnet25/article/details/42492379

原文地址:https://www.cnblogs.com/Zhengxiaoxiao/p/10504590.html