简体   繁体   English

如何添加链接到谷歌饼图切片

[英]how to add links to google pie chart slices

This is the code I've been working, I need to redirect to another page by clicking the slices. 这是我一直在工作的代码,我需要通过单击切片重定向到另一个页面。

<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>

  // Load the Visualization API and the piechart package.
  google.load('visualization', '1.0', {'packages':['corechart']});

  // Set a callback to run when the Google Visualization API is loaded.
  google.setOnLoadCallback(drawChart);

  // Callback that creates and populates a data table,
  // instantiates the pie chart, passes in the data and
  // draws it.
  function drawChart() {

    // Create the data table.
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Topping');    
    data.addColumn('number', 'Slices');
    data.addRows([
      ['Cleaning Completed', $co1],
  ['Denied At Client Place', $co2],
  ['Denied', $co3],
  ['Postponed', $co4],
  ['Careless Driver', $co5],
  ['Cleaning Started', $co6],
  ['Emptyspace', $co22],
  ['Assigned to Vehicle', $co23],
  ['Select', $co24],
  ['Call Not Picked', $co25],
  ['Asked to Call Back', $co26],
    ]);


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

I believe Google visualization allows you to set a click handler. 我相信Google可视化允许您设置点击处理程序。 So in your drawChart function, add this. 所以在你的drawChart函数中,添加它。 (AFTER chart.draw) (AFTER chart.draw)

google.visualization.events.addListener(chart, 'select', function() {
    var selection = chart.getSelection();
    console.log(selection);  
});

See what "selection" has in it and see if that has enough information to set where the browser should redirect to. 查看“选择”中包含的内容,看看是否有足够的信息来设置浏览器重定向到的位置。

More info: https://developers.google.com/chart/interactive/docs/reference#addlistener 更多信息: https//developers.google.com/chart/interactive/docs/reference#addlistener

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM