2017-12-08 6 views
1

私はそれは少し奇妙に聞こえる知っているが、私はここにコードの一部を得た:Google Chartsの描画が終了した後の値の割り当て方法は?

let globalResult = []; 
let defaultData = ["None", 1200, 1200, 1200, 1200, 1200, 1200, 1200, 
1200, 1200, 1200, 1200]; 
$(document).ready(() => { 
    // set a listener on the textbox 
    $('#input').on("change", (evt) => { 
     let text = $('#input').val(); 
     // the {text: text} sends a parameter named text with the 
     // value of what was typed in the textbox 
     $.get("/display", {text: text}) 
      .done((data) => { 
       globalResult = data['result']; 
       $('#input').val(''); // reset the textbox 
       //Draw Graph 
       google.charts.load('current', {'packages':['corechart']}); 
       google.charts.setOnLoadCallback(drawChart); 

       function drawChart() { 
        //Chart stuff.... Doesn't matter 
        //It's programmed to Draw Line with defaultData and globalResult 
        }; 

        var chart = new google.visualization.LineChart(document.getElementById('curve_chart')); 

        chart.draw(data, options); 
        //Swap Value here: 
        defaultData = globalResult; 
       } 

      }) 

私はチャートが描画された後defaultDataglobalResultを交換しようとしましたが、スワップとき、いくつかの方法、それは常に新しいグラフを描きますそれによって、グラフ上で中断が発生します(図面の中央でちょうど死んだ別の線のように、線の半分がそこにぶら下がっています)。 function drawChartの外側にこれらを配置しようとすると、2つの同じ行が描画され、もう一方は真ん中に描画されます。私はまた、$.get()スコープの外側に配置することができないため、チャートが描画されません。どうすれば修正できますか? >$(document).ready

負荷グーグル - など、不要のためとして

答えて

0

LOAD文(google.charts.load)は、文書の準備ができるまで、コールバックを実行する前に
を待つか、またはそれが返す約束します...
最初の約束を使用して、
は、
はあなたが

はfollに類似のセットアップをお勧めします任意のデータを同じチャートを描くことを可能にするであろう、グラフを作成し、後で使用するための参照を保存しますお待ちしております...

let globalResult = []; 
let defaultData = ["None", 1200, 1200, 1200, 1200, 1200, 1200, 1200, 1200, 1200, 1200, 1200]; 

google.charts.load('current', { 
    packages: ['corechart'] 
}).then(() => { 
    // save reference to chart here 
    var chart = new google.visualization.LineChart(document.getElementById('curve_chart')); 

    $('#input').on("change", (evt) => { 
     let text = $('#input').val(); 
     // the {text: text} sends a parameter named text with the 
     // value of what was typed in the textbox 
     $.get("/display", {text: text}) 
      .done((data) => { 
       globalResult = data['result']; 
       $('#input').val(''); // reset the textbox 

       //Chart stuff.... 
       chart.draw(data, options); 

       //Swap Value here: 
       defaultData = globalResult; 
      }); 

    }); 
}); 
+0

これは役に立ちます... – WhiteHat

関連する問題