canvas通过js的style设置宽高会变形

canvas跟其他标签一样，也可以通过css来定义样式。但这里需要注意的是：canvas的默认宽高为300px * 150px,在css中为canvas定义宽高，实际上把宽高为300px * 150px的画布进行了拉伸，如果在这样的情况下进行canvas绘图，你得到的图形可能就是变形的效果。所以，在canvas绘图时，应该在canvas标签里直接定义宽高。如下

<canvas id="myCanvas" width="500" height="500"  style="border:1px solid #d3d3d3;">canvas</canvas>

或者通过js应该直接调用对象宽高
 var canvas = document.getElementById("myCanvas");
 canvas.width=1000;
 canvas.height=1000;

记住不需要带单位哦