本站于2023年9月4日。收到“大连君*****咨询有限公司”通知
说我们IIS7站长博客，有一篇博文用了他们的图片。
要求我们给他们一张图片6000元。要不然法院告我们
为避免不必要的麻烦，IIS7站长博客，全站内容图片下架、并积极应诉
博文内容全部不再显示，请需要相关资讯的站长朋友到必应搜索。谢谢！
另祝：版权碰瓷诈骗团伙，早日弃暗投明。
相关新闻：借版权之名、行诈骗之实，周某因犯诈骗罪被判处有期徒刑十一年六个月
叹！百花齐放的时代,渐行渐远!
1.Canvas绘制步骤
在html5页面中添加canvas元素，定义id属性值以便后面调用：
<canvas id="myCanvas" width="500" height="200"></canvas>
使用id寻找页面中的canvas元素：
var c=document.getElementById("myCanvas");
通过canvas元素的getContext方法来获取其上下文（Context），即创建context对象，以获取允许绘制的2D环境：
var context=c.getContext("2d");
使用javascript脚本来进行绘制：
context.fillStyle="#ff0000";
context.fillRect(50,25,100,50);
运行结果：
2.绘制直线相关方法及属性
方法：
beginPath()：定义绘制动作的开始。
moveTo()：绘制图形的起点位置。
lineTo()：绘制图形的重点位置。
stroke()：为所画的线赋予颜色，如没有指定，默认为黑色。
属性：
lineWidth：直线的宽度。
strokeStvle：直线的颜色。
直线端点样式：用lineCap属性设定，包括三种样式，分别为butt，round，square。
3.绘制弧线和曲线
arcTo(x1,y1,x2,y2,radius) ;包含五个参数，（x1,y1）是端点1，（x2,y2）是端点2，radius是绘制的弧线的半径，此方法就是利用第一条线的终点、端点1、端点2组成的夹角，与夹角两边相切并以radius为半径画弧线，详情实例见下面代码。
arcTo()：创建介于两个切线之间的弧/曲线。
quadraticCurveTo()：绘制二次曲线，每条二次曲线由上下文点、一个控制点和一个终止点来定义。
bezierCurveTo()：绘制贝塞尔曲线，每条贝塞尔曲线由上下文点、两个控制点和一个终止点来确定。
原文链接：https://blog.csdn.net/qq_36747861/article/details/84342132
