canvas

最新推荐文章于 2023-10-30 23:25:34 发布

li921228527

最新推荐文章于 2023-10-30 23:25:34 发布

阅读量87

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/li921228527/article/details/114084363

版权

7 篇文章 0 订阅

订阅专栏

canvas的宽高
canvas的宽高分为画布和画板的宽和高.通过<canvas width='500' height='500'></canvas>以及通过jsdom.width = 500这两种方式设定的都是画布的宽高.而通过css设定以及js的dom.style.width='500px'设定的是画板的宽高,也就是渲染到浏览器canvas标签所占的宽高.当画布的宽高和画板的宽高不一致时,就会导致画布压缩或者拉伸和画板大小一致,造成比例失调.
beginPath()的问题
beginPath()是开启一条路径,在进行绘制的时候,是从上一个的beginPath()开始,会认为从上一个beginPath()到这里是同一个路径.
beginpath讲解()
roatete()问题
画布进行旋转的时候,默认是以画布的左上角(0,0)为圆心进行旋转,为了从中心进行旋转,可以使用context.translate(x,y)更改坐标位置进行旋转,不过旋转前要使用context.save()保存当前画布状态,使用完成后调用context.restore()恢复刚才的画布状态,否则会造成画布位置错乱的问题.

关注