2016-12-28 11 views
4

次のjquery circle-progressを使用していますが、最近値0.29の問題が発生しています。 29%が表示されますが、代わりに28%が表示されます。jquery circleの進行状況が正しくない%

https://github.com/kottenator/

$(document).ready(function($) { 
 
$('.progressbar').each(function() { 
 
    var elementPos = $(this).offset().top; 
 
    var topOfWindow = $(window).scrollTop(); 
 
    var percent = $('input[id$=hdProfitPerc]').val(); //$(this).find('.circle').attr('data-percent'); 
 
    var percentage = parseInt(percent, 10)/parseInt(100, 10); 
 
    var animate = $(this).data('animate'); 
 
    var Profit = $('input[id$=hdProfit]').val(); 
 
    //alert($('input[id$=hdProfitPerc]').val()); 
 

 
    var clr 
 

 
    if (percent < 0) { 
 
     clr = 'red' 
 
    } 
 
    else { 
 
     clr = 'green' 
 
    } 
 

 
    if (elementPos < topOfWindow + $(window).height() - 30 && !animate) { 
 
     $(this).data('animate', true); 
 
     $(this).find('.small-circle').circleProgress({ 
 
      startAngle: -Math.PI/2, 
 
      value: 0.29, //percentage, 
 
      thickness: 8, 
 
      fill: { 
 
       color: clr 
 
      } 
 
     }).on('circle-animation-progress', function (event, progress, stepValue) { 
 
      //$(this).find('div').text(String(stepValue.toFixed(2)).substr(2) + '%'); 
 
      $(this).find('div').text(parseInt(stepValue * 100) + '%'); 
 
     }).stop() 
 
     .on('circle-animation-end', function (event) { 
 
      $(this).find('#GP').html(Profit); 
 
     }) 
 
    } 
 
}); 
 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.rawgit.com/kottenator/jquery-circle-progress/1.2.0/dist/circle-progress.js"></script> 
 
<div id="div_progressbar" runat="server"> 
 
    <div class="progressbar" style="padding-left: 80px;"> 
 
    <div class="small-circle"> 
 
     <div></div> 
 
     <span id="GP" style="color: black"></span> 
 
    </div> 
 
    </div> 
 
</div>

私は0.29から0.291に値を変更した場合、それは動作します。

+0

これは動作します$(this).find( 'div')text(String(stepValue.toFixed(2))。substr(2)+ '%' );代わりに100%で動作しません00%を示します – user1263981

答えて

0

これは修正です:

$(this).find('div').text(Math.round(parseFloat(stepValue * 100)) + '%'); 

それとも、単に:$(this).find('div').text(Math.round(stepValue * 100) + '%');

デモ:テスト後

https://jsfiddle.net/tq4jok5r/2/

、私は、この特定の番号(28、気づきました999999xxxx)はより小さい整数に丸められます... PSより多くの異なる値でうまく動作し、いくつかのテストでは正常に動作します...

+0

0.28、その表示29% – user1263981

+0

@ user1263981、うまく... Math.roundが動作するはずです:)その後、編集を確認してください。 – sinisake

+0

これはうまく動作します:)私は、parseFloatの必要はないと思います。 – user1263981

関連する問題