動態更新在水泡js

在下面的代碼中第一次如果我（任何更高的價值）給出值= 29圖表增加，第二次如果我給的價值小於29它不起作用，水平仍然停留在29但內部數據已更改，但未在圖表中表示。我在控制檯中交叉檢查。在水泡圖中按價值增加，但不是按值減少。一旦較高的值被賦予它不減少到較低的值在圖表動態更新在水泡js

function s(){ 
 
var waterFill = document.getElementById("db01").value; 
 
    var fraction = waterFill/100; 
 
    $('#demo-1').waterbubble({ 
 
    txt: ('' + waterFill).slice(-3).toString() + " %", 
 
    data: fraction, 
 
    animation: true 
 
    }); 
 
console.log(waterFill);} 
 
setInterval(function(){ s();// this will run after every 10 seconds 
 
}, 10000);

<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script> 
 
<script src="http://www.jqueryscript.net/demo/Customizable-Liquid-Bubble-Chart-With-jQuery-Canvas/waterbubble.js"></script> 
 

 
<input id="db01" onkeyup="s()"> 
 
<div class=" col-lg-4"> 
 
<canvas id="demo-1"></canvas> 
 
</div>

來源

2016-11-26 mahesh

使用[newer chart code]（https://github.com/fiona23/water-bubble-chart）作者的github回購。 – Annarfych

@Annarfych我試過它仍然是一樣的 – mahesh

我解決它通過在函數的NewValue（）改變，

function NewValue(){ 
 
var data = document.getElementById("db01").value; 
 
     if(data > .5){ 
 
      return Math.round(data*100); 
 
     } else { 
 
      return (data*100).toFixed(1); 
 
     } 
 
    }

來源

2016-11-29 03:10:16 mahesh

動態更新在水泡js

回答

相關問題