ajax从选项选择调用谷歌图表

Question

用户能够搜索基因数据库中的基因。然后数据库返回该基因的亚型。然后将子类型动态加载到选项选择中。 当用户从选项选项中单击子类型时，图表必须绘制。但我无法弄清楚它为什么没有。猜测我的ajax呼叫没有正常完成，但我找不到问题。

数据在警报中显示。然而，谷歌图表没有绘制:(

代码

<script src="jquery-3.2.1.js"></script> 
<script type="text/javascript">

  $(document).ready(function(){ 
    $("#selectinput").change(function(){ 
      var input = $(this).val(); 
      var dataString = "selectinput="+input;
      google.charts.load('current', {'packages':['corechart']});
      google.charts.setOnLoadCallback(drawchart);

      function drawchart(){
      $.ajax({ 
        type: "POST", 
        url: "get-data.php", 
        data: dataString, 
        success: function(result){ 
          var res = result.slice(2, -2);
          var str = res.replace(/["]/g, "");
          alert(str); //alert the right data!
          var data = new google.visualization.arrayToDataTable([str]);
          //apparently this doesn't work

        var options = {
        title: 'Transcriptome',
        hAxis: { ticks: [1, {v:2, f:'Layer 2/3'}, {v:3, f:'Layer 4'}, 4] },
        vAxis: {title: 'MEAN'},
        bubble: {textStyle: {fontSize: 11}},
        sizeAxis: {maxSize: 30, minSize: 15},
        bubble: {textStyle: {color: 'none'}}

      };

        var chart = new google.visualization.BubbleChart(document.getElementById('serieschart'));
      chart.draw(data, options);


        }
      });
      }

    });
  });
</script>

<div id="serieschart" style="width: 900px; height: 500px;"></div>

非常感谢！ 编辑：我不是在谈论已经绘制的图表。 它必须在选项选择下面绘制一个新的，它现在不会。

Answer 1

您是否尝试添加ajax请求：

dataType:'json'

成功改为：

var data = google.visualization.arrayToDataTable(result);