html5 canvas 繪製橫線豎線時不清晰的解決辦法

在繪製一個Tip模樣的圖案時遇到了令人鬱悶的事情：當lineHeight為1時，斜線都很清晰，唯獨橫線和豎線不清晰，目測佔了兩個像素，而且透明度都被減半；

，後來經過查資料，終於知道，畫布上的座標並未對應網頁裡的像素，假如我們要在10,10這個點畫橫線到100,10，在canvas繪製這個1px的橫線，它會把這個1px劈成兩半，一半放在x,9上，一半放在x,10上，然後顯示器根據你傳來的東西會顯示成圖片上看到的結果。

解決辦法：

           如果橫線，那就在y值上加個0.5，如上面的，用10，10.5 到100,10.5就可以了。

          如果豎線，那就在x值上加個0.5，。。。。其他就不多說了，下面是成果圖：

that's all ,thanks..