canvas学习笔记之2d画布基础的实现

2020-04-21 07:21:47易采站长站整理

ctx.fillRect(10, 10, 100, 100);

宽高示例

为什么样式设置了同样大小,显示却截然不同的情况呢?

canvas本身有两套大小:一个是元素本身大小,一个是绘图表面(drawing surface)的大小
如果通过width,height属性来设置,是同时修改了元素本身和绘图表面大小,
如果canvas元素的大小不符合绘图表面大小时,则会对绘图表面进行缩放,使之符合元素本身大小,
无特殊需求,建议直接使用canvas的width和height就好