Question

我正在使用Google PieChart并显示来自我的数据库的数据。一旦用户点击Slice，我想读取数据并将其传递给DB以获取少量数据。点击活动后，我无法从谷歌图表中获取数据。

请找到目前正在使用的代码，

var piechartdata = new google.visualization.DataTable(jsonPieChartData);

// Instantiate and draw our pie chart, passing in some options.
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));


chart.draw(piechartdata, {
  width: 700,
  height: 200,
  is3D: true,
  chartArea: { left:"5%",top:"5%",width:"90%",height:"90%" }

  var chart = new google.visualization.PieChart(document.getElementById('chart_div'));

    function selectHandler() {
      var selectedItem = chart.getSelection()[0];
      if (selectedItem) {
        var topping = data.getValue(selectedItem.row, 0);
        alert('The user selected ' + topping);
      }
    }

    google.visualization.events.addListener(chart, 'select', selectHandler);    
    chart.draw(data, options);
}

请帮助解决这个问题。

Answer 1

代码放错位置，应该是options

chart.draw未正确关闭

并建议您查看length的{{1}} 在访问数组元素之前

请参阅以下摘录...

chart.getSelection()

google.charts.load('current', {
  callback: function () {
    var piechartdata = google.visualization.arrayToDataTable([
      ['Task', 'Hours per Day'],
      ['Work',     11],
      ['Eat',      2],
      ['Commute',  2],
      ['Watch TV', 2],
      ['Sleep',    7]
    ]);

    var chart = new google.visualization.PieChart(document.getElementById('chart_div'));

    google.visualization.events.addListener(chart, 'select', selectHandler);

    var options = {
      width: 700,
      height: 200,
      is3D: true,
      chartArea: { left:"5%",top:"5%",width:"90%",height:"90%" }
    };

    chart.draw(piechartdata, options);

    function selectHandler() {
      var selectedItem = chart.getSelection();
      if (selectedItem.length > 0) {
        var topping = piechartdata.getValue(selectedItem[0].row, 0);
        console.log('The user selected ' + topping);
      }
    }
  },
  packages: ['corechart']
});

使用php和ajax在谷歌饼图中的事件处理

1 个答案: