在js中设置canvas的宽高时，如果用css()函数设置，或者在css样式中设置时，在绘制图像时就会出现拉伸变形的情况。这是
因为canvas的默认宽高为300px*150px，在css中设置canvas的宽高，实际上是把canvas在300px*150px的基础上进行了拉伸。所
以绘制出来的图像会发生变形。
因此，如果要动态改变canvas的大小，用以下的方式可以使其不变形的同时放大缩小：
document.getElementById("canvas").width = 100;
document.getElementById("canvas").height =100;