谷歌图表显示数据后，我刷新浏览器

我写了一个代码来调用服务器的数据，并使用谷歌图表以图表的形式显示数据。我面临的问题是，图表填充后，我点击刷新按钮，但第一次图表结构显示，但数据不可见。谷歌图表显示数据后，我刷新浏览器

我使用下面的代码 UNITY //警报（ “这里”）;

    //google.load("visualization", "1", {packages:["corechart"]}); 
        //google.setOnLoadCallback(drawChart); 

        var optionsx = {packages: ['corechart'], callback : drawChart}; 
        google.load('visualization', '1', optionsx); 

      var queryObject=""; 
      var queryObjectLen=""; 

      var queryObject1=""; 
      var queryObjectLen1=""; 
      $.ajax({ 
       type : 'POST', 
       url : 'chart.jsp', 
       dataType:'json', 


       //async : false 

      success : function(data) { 

       queryObject = eval('(' + JSON.stringify(data) + ')'); 
       queryObjectLen = queryObject.empdetails.length; 
       // document.getElementById("demo").innerHTML = queryObject.empdetails[1].CI + " " + queryObject.empdetails[1].TR; 


       //System.out.println(+queryObjectLen); 
       console.log(+ queryObject); 
       console.log('lenth :' +queryObjectLen); 
       alert('success') 
      }, 
       error : function(xhr, type) { 
       alert('server error occured') 
      } 
     }); 


      function drawChart() { 

     var data = new google.visualization.DataTable(); 

      data.addColumn('string', 'CI'); 
      data.addColumn('number', 'Tickets Raised'); 
      for(var i=0;i<queryObjectLen;i++) 
      { 

       var name = queryObject.empdetails[i].CI; 
       var NOR = queryObject.empdetails[i].TR; 
       data.addRows([ 
        [name,parseInt(NOR)] 
       ]); 
      } 
      var options = { 
       title: 'Number Of Unity Tickets in a week', 
       'width' : 500, 
       'height' : 300 
      };

变种图表=新google.visualization.BarChart（的document.getElementById（ 'chart_div'））;

chart.draw（data，options）;

</script> 
    </head> 
    <body> 
      <div id="chart_div" ></div> 
      <div class = "center" id="chart_div1" ></div> 
      <div class = "right" id="chart_div2" ></div> 
      <p id="demo"></p> 
    </body> 
    </html>

来源

2016-01-05 Kalpana Razdan

您是否为此包含一个外部Google Charts javascript库？

如果在第一次加载之前执行ajax请求之前脚本可能未加载，则随后的刷新将会工作，因为此脚本已被缓存。

要解决这个问题，您应该首先使用JavaScript加载Google图表库，并在加载后执行ajax调用。

看到它看起来像你已经使用jQuery，你可以使用jQuery.getScript()：

$.getScript("http://www.google.com/path_to_the_charts_script.js", function(){ 
    //put your ajax call in here 
});

来源

2016-01-05 11:40:39 bbeckford

谷歌图表显示数据后，我刷新浏览器

回答

相关问题