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..