問題：有時用canvas作圖時發現圖像會出現模糊不清晰的問題，甚至做出來的圖呈現出的效果與我們給的數值所應該呈現出的效果不一致
原因：當你在支持html5 canvas的瀏覽器下查看頁面的時候，canvas畫布的默認大小是300*150，相當於一張圖片，當在css設置畫布大小時比如350*350實際是將原畫布（300*150）進行了拉伸，所以會導致圖像變形，至於模糊的問題與瀏覽器處理 canvas 的方式有關
圖像變形解決方法：將想要設置的畫布大小直接設置在canvas標簽上
<canvas id="mycanvas" width="350px" height="350px"></canvas>
圖像模糊的解決方法：將canvas的繪制過程放大兩倍（也可以根據自己需求放大其他倍數，我在項目中放大了四倍才感覺舒服些，根據項目需求），然后將canvas的父元素縮小兩倍（根據繪制過程中放大的倍數確定了，當打幾倍父元素就縮小幾倍）就可以解決canvas圖像模糊問題，
.box{zoom:0.5;}
<div class="box">
<canvas id="mycanvas" width="700px" height="700px"></canvas>
</div>
因為canvas放大了兩倍，所以繪制時，參數都要放大兩倍（比如半徑），這樣就完美的解決了canvas圖像模糊的問題