Javascript 如何在模式弹出窗口上每次调用Ajax后重新绘制Google图表

Javascript 如何在模式弹出窗口上每次调用Ajax后重新绘制Google图表,javascript,php,jquery,ajax,google-visualization,Javascript,Php,Jquery,Ajax,Google Visualization,当图表第一次加载初始默认Ajax应答时,它工作正常。唯一的问题是图表在第二次Ajax调用时不会再次绘制自己。我知道drawChart函数不会再次运行,我只是不知道为什么 Below is my code <script type="text/javascript"> google.charts.load("current", {packages:['corechart']}); google.charts.setOnLoadCallback(drawChart);

当图表第一次加载初始默认Ajax应答时,它工作正常。唯一的问题是图表在第二次Ajax调用时不会再次绘制自己。我知道drawChart函数不会再次运行,我只是不知道为什么

Below is my code


<script type="text/javascript">
    google.charts.load("current", {packages:['corechart']});
    google.charts.setOnLoadCallback(drawChart);
    function drawChart() {
      var data = google.visualization.arrayToDataTable([
        ["Element", "Density", { role: "style" } ],
       <?php for($i=$lastYears;$i<=$year;$i++)
        {
            //echo $leadGraph;die;
           if($leadGraph != 'leadgraph')
           {
             $users = "select * from";
           }else{
               //echo '41';die;
               //$users = $this->Report_model->count_report_users($selectType,$i);
              $users="select * from";
           }
        ?>
        ["<?php echo $i; ?>", <?php echo $users; ?>, "#DE2226"],
        <?php 
        } 
        ?>
      ]);

      var view = new google.visualization.DataView(data);
      view.setColumns([0, 1,
                       { calc: "stringify",
                         sourceColumn: 1,
                         type: "string",
                         role: "annotation" },
                       2]);
var options = {
        title: "<?php echo $graph; ?>",
        //width: 600,
        //height: 500,
        bar: {groupWidth: "95%"},
        legend: { position: "none" },
      };
      var chart = new google.visualization.ColumnChart(document.getElementById("columnchart_values"));
      chart.draw(view, options);
  }
  </script>

您不能调用
.load()
两次,因此需要创建一个更新图表数据的函数 然后设置
google.setOnLoadCallback(加载图表数据)

Error: google.charts.load() cannot be called more than once with version 45 or earlier.
function load_chart_data(){
$.ajax({
    url: 'get_data.php',
    data: {'startyear':startyear,'endyear':endyear},
    async: false,
    success: function(data){
        if(data){
            chart_data = $.parseJSON(data);
            updateChart(chart_data, "My Chart", "Data");
        }
    },
});
}
function updateChart(chart_data, chart1_main_title, chart1_vaxis_title) {
var chart1_data = new google.visualization.DataTable(chart_data);
var chart1_options = {
    title: chart1_main_title,
    vAxis: {title: chart1_vaxis_title,  titleTextStyle: {color: 'red'}}
};

var chart1_chart = new google.visualization.ColumnChart(document.getElementById('columnchart_values'));
chart1_chart.draw(chart1_data, chart1_options);
}