easy-pie-chartゼロパーセントはドットとしてレンダリングされますか？

Question

0％で簡単な円グラフを使用しようとすると、上部/ 12時の位置に小さなドットが表示されています。

スクリーンショットを参照してください。下のHTML/JS/CSSをご覧ください。

私が間違っていることを知っていますか？

rendering of 0% HTML：

<span class="chart" data-percent="25"> 
<span class="percent">25</span> 
</span> 

JS：

$('.chart').easyPieChart({ 
    animate: 2000, 
    scaleColor: false, 
    lineWidth: 12, 
    lineCap: 'square', 
    size: 100, 
    trackColor: '#e5e5e5', 
    barColor: '#00FF00', 
    onStep: function(from, to, percent) { 
     $(this.el).find('.percent').text(Math.round(percent)); 
    } 
}); 

CSS：あなたは間違って何もしていない

.chart { 
    position: relative; 
    display: inline-block; 
    width: 110px; 
    height: 110px; 
    margin-top: 50px; 
    margin-bottom: 50px; 
    text-align: center; 
} 

.chart canvas { 
    position: absolute; 
    top: 0; 
    left: 0; 
} 

.percent { 
    display: inline-block; 
    line-height: 110px; 
    z-index: 2; 
} 
.percent:after { 
    content: '%'; 
    margin-left: 0.1em; 
    font-size: .8em; 
} 

Answer 1

。あなたのものがあなたのものかどうかはわかりませんが、いくつかのものがありますsimilar issues on plugin's GitHub page。

プラグインによって線が描画されます。この場合、0で始まり、0で終了し、3px太いストロークを丸いエンドキャップで適用して、開始点に小さな点を作成します。

あなたのコードでは、値が0より大きいかどうかをチェックして、それをまったく表示しないか、GHでチャイムして修正を待つだけです。

Answer 2

あなたはbarColor = trackColorを設定することができます。

$(document).ready(function(){ 
     var charts = $('.percentage'); 
     charts.easyPieChart({ 
     animate: 1000, 
     onStep: function(value) { 
      this.$el.find('span').text(~~value); 

      if(this.percentage == 0) 
      this.options.barColor = this.options.trackColor; 
     }, 

     }); 
}); 

DEMO