canvas是html5尺度顶用于绘制图形的标签，当然也浏览器为了撑持这个标签，也供给了良多的js方式供利用，本文就为你介绍canvas若何绘制线条，若何设置起点坐标
需要这些哦
vscode
方式/
1打开vscode，新建一个html文件，在文件中输入一个感慨号，再按一下tab键，就能快速完当作html5规范的文档布局（利用文本文件编纂也是一样的结果）
文章插图
2在body规模内添加一个canvas标签，设置宽高与边框 。 在浏览器中运行可以看到，canvas标签中心的文字并没有显示在浏览器中，这个文字是当浏览器不撑持canvas的时辰显示的
文章插图
3在页面中添加js代码，获取页面canvas标签对象，再判定当浏览器撑持canvas标签时，获取canvas绘制2d，即平面图形的对象
文章插图
4在js中继续添加绘图代码，从canvas左上角（0，0）坐标起头，到（150，150）坐标之间的直线 。
注重：moveTo(0, 0)的意思就是设置画线的起点坐标
文章插图
5在浏览器中运行页面，就可以看到canvas规模内呈现了一条从左上角起头的直线
文章插图
6点窜moveTo(0, 0)，酿成从左上角起头(50, 50)的位置为起点坐标，其他代码都不点窜
文章插图
7【canvas绘制线条时如何设置起点坐标】再次打开浏览器，运行可以看到canvas图形中的起点，距离左上角有横标的目的50，纵标的目的50的偏移了
文章插图
以上内容就是canvas绘制线条时如何设置起点坐标的内容啦，希望对你有所帮助哦！
推荐阅读
- 餐桌平面图制作
- wps演示中如何制作直线线条纹理
- wps演示中如何制作曲线线条纹理
- wps演示中如何绘制齿轮形状
- wps演示中如何绘制雨伞形状
- Origin如何绘制二点线段图
- Origin如何绘制三点线段图
- Origin如何绘制柱状图
- 如何用AI绘制花朵呢
- ps绘制简单表情怎么制作