Html5中Canvas画线有毛边应该怎么解决

Html5 Canvas 所有的画线指令画出来的线条都有毛边（比如 lineTo，arcTo，strokeRect），这是因为在Canvas中整数坐标值对应的位置恰巧是屏幕象素点中间的夹缝，那么当按这样的坐标进行线条渲染时所要用到的就是夹缝两边的象素点，这样即便设置了lineWidth为1也将看到两个象素效果的线条，解决方法原象素点+0.5进行偏移。

成都创新互联是创新、创意、研发型一体的综合型网站建设公司，自成立以来公司不断探索创新，始终坚持为客户提供满意周到的服务，在本地打下了良好的口碑，在过去的十余年时间我们累计服务了上千家以及全国政企客户，如玻璃钢雕塑等企业单位，完善的项目管理流程，严格把控项目进度与质量监控加上过硬的技术实力获得客户的一致表扬。

下面是处理前后的效果比较：

  
  
  
      
      
      
      
  
  
↓ 处理的　　↓ 普通的　　↓ +0.5偏移的
  
  

以上就是Html5中Canvas画线有毛边应该怎么解决的详细内容，更多请关注创新互联其它相关文章！

本文标题：Html5中Canvas画线有毛边应该怎么解决
文章源于：http://cdxtjz.com/article/gcoidi.html