自己使用canvas画图是碰到的问题，在这里记录一下。我把lineWidth设置为1，但是很粗，而且发虚。代码如下：
1 <script type="text/javascript"> 2 3 $(function () { 4 draw(); 5 }) 6 7 function draw(){ 8 var fdCanvas = document.getElementById("frequencyDomainChart"); 9 var ctx = fdCanvas.getContext("2d"); 10 11 ctx.lineWidth = 1; 12 ctx.beginPath(); 13 ctx.moveTo(0,0); 14 ctx.lineTo(500,500); 15 ctx.stroke(); 16 } 17 18 </script> 19 20 <style type="text/css"> 21 #frequencyDomainChart{ 22 height: 600px; 23 width: 800px; 24 border: 1px solid #000000; 25 } 26 </style> 27 28 <body> 29 <canvas id="frequencyDomainChart"></canvas> 30 </body> 31 </html>
显示出来之后发虚，然后网上各种找结果，最后发现是由于canvas没有设置height与width，css中设置的height与weight对canvas不管用。
1 <style type="text/css"> 2 #frequencyDomainChart{ 3 border: 1px solid #000000; 4 } 5 </style> 6 7 <body> 8 <canvas id="frequencyDomainChart" height="600px" width="800px"></canvas> 9 </body> 10 </html>
线条终于不发虚了！！！！！！！！！