Question

http://jsbin.com/nadozi/edit?html,js,output

这是我的JSBin。

我正在尝试使用value = 0初始化圆圈，但它会将Dot显示为起始点。仅在lineCap 回合时才会发生。如何隐藏它并在开始新圆圈时以空白灰色圆圈开始？

这是我正在尝试使用的库： https://github.com/kottenator/jquery-circle-progress

Answer 1

这样的东西？我使用了更多示例链接到此页面http://kottenator.github.io/jquery-circle-progress/

$('.circle').circleProgress({
value: 1.0,
fill: { color: '#ffa500' }
}).on('circle-animation-progress', function(event, progress) {
$(this).find('strong').html(parseInt(100 * progress) + '<i>%</i>');
});

Answer 2

此问题已在此处确认并确认 - GitHub - Issue #108

当值为0时绕过绘图的解决方法也有效：

drawArc: function(v) {
  // introduced this value check so that arc is rendered only when value is > 0
  if (this.getValue() > 0) {
    var ctx = this.ctx,
        r = this.radius,
        t = this.getThickness(),
        a = this.startAngle;

    ctx.save();
    ctx.beginPath();

    if (!this.reverse) {
      ctx.arc(r, r, r - t / 2, a, a + Math.PI * 2 * v);
    } else {
      ctx.arc(r, r, r - t / 2, a - Math.PI * 2 * v, a);
    }

    ctx.lineWidth = t;
    ctx.lineCap = this.lineCap;
    ctx.strokeStyle = this.arcFill;
    ctx.stroke();
    ctx.restore();
  }
}

jQuery Circle Progressbar开始0值显示不正确

2 个答案: