canvas图形不显示需先检查getcontext('2d')是否成功获取,确保dom加载完成、canvas设width/height属性而非仅css,并判空ctx;坐标系原点在左上角;stroke()/fill()需配合路径api使用;高分屏需用devicepixelratio缩放处理。

Canvas 画布没显示图形?先检查 getContext('2d') 是否调用成功
很多新手写完 drawRect() 或 fillRect() 却看不到东西,根本原因常是上下文获取失败——比如 DOM 还没加载完就操作了 canvas 元素,或元素本身没设宽高(CSS 设置的宽高不作用于绘图坐标系)。
- 务必在
DOMContentLoaded后获取canvas,或把脚本放











