收藏
回答

canvas arc 方法在android 中显示不正常的bug

问题模块
客户端
let cxt_arc = wx.createCanvasContext('core-usage');//创建并返回绘图上下文context对象。
cxt_arc.setLineWidth(15);
cxt_arc.setStrokeStyle('#142948');
cxt_arc.setLineCap('round')
cxt_arc.beginPath();//开始一个新的路径
cxt_arc.arc(100, 100, 90, 0.75 * Math.PI, 0.25 * Math.PI, false);


<canvas class="usage_percent" canvas-id="core-usage" binderror="canvas_err"></canvas>


.usage_percent{
position: absolute;
 width: 260px;
 height: 260px;
 z-index: 1;
}



模拟器上的显示:正常

iOS 上显示:正常

android上显示:不正常 下面是android 上的显示:


Android 设备信息:

微信版本:6.5.16

sdk 版本:1.6.4

华为荣耀 PRA-AL00

系统版本:7.0 EMui 5.0


请问这是什么问题?

最后一次编辑于  2017-11-03  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

2 个回答

  • Jason
    Jason
    2017-11-03

    这个问题,我自己算是解决了;

    cxt_arc.arc(100, 100, 90, 0.75 * Math.PI, 0.25 * Math.PI, false);

    我猜测,这里iOS 会按顺时针,逆时针,从开始到结束去渲染,但是android 只会按从小弧度,到大弧度,再根据顺时、逆针 去渲染;

    解决方案就是:

    给大弧度的第二个参数加上2pi 吧。。。

    cxt_arc.arc(100, 100, 90, 0.75 * Math.PI, 2.25 * Math.PI, false);


    2017-11-03
    赞同
    回复
  • nomore
    nomore
    2017-11-03

    我们看看

    2017-11-03
    赞同
    回复