* 1.canvas元素是HTML5元素ie9+支持
* 2.使用canvas绘图需要指定绘图区域大小,canvas有width和height属性,
* 不要使用css来指定大小
* 3.绘图操作方案:
* 1.获取canvas元素:var draw=document.getElementById("drawingArea");
* 2.获取2d上下文:var context=draw.getContext("2d");
* 3.开始绘图
* 4.canvas可以导出图像:
* var imgUrl=draw.toDataUrl("image/png") (参数是图像的MIME类型)
* 使用图像:
* var img=document.createElement("img");
* img.src=imgUrl;
* 将img添加到文档流
* 5.绘图函数:
* 1.设置画笔颜色:
* context.fillStyle="red":填充的时候的画笔颜色
* context.strokeStyle="red":描边的时候画笔颜色
* 2.绘制图形:
* (在使用描边的方法stroke类的方法的时候可以设置线条的宽度,末端形状,线条相交方式
* lineWidth:设置线条宽度
* lineCap:设置末端形状("butt:平头","round:圆头","square:方头")),只有在画线的时候能看出来
* lineJoin:设置线条相交方式("round:圆交","bevel:斜交","miter:斜接")(我没看出什么区别)
* 1.
js中canvas操作
最新推荐文章于 2024-05-10 21:17:55 发布
* 1.canvas元素是HTML5元素ie9+支持* 2.使用canvas绘图需要指定绘图区域大小,canvas有width和height属性,* 不要使用css来指定大小* 3.绘图操作方案:* 1.获取canvas元素:var draw=document.getElementById("drawingArea");* 2.获取2d上下文:var context=
摘要由CSDN通过智能技术生成