Google visualization 在google scatter上的特定区域显示数据_Google Visualization

Google visualization 在google scatter上的特定区域显示数据

google-visualization

Google visualization 在google scatter上的特定区域显示数据,google-visualization,Google Visualization,我有一个像这样的谷歌散点图： <html> <head> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("visualization", "1", {packages:["corechart"]});

我有一个像这样的谷歌散点图：

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Age', 'Weight'],
          [ 8,      12],
          [ 4,      5.5],
          [ 11,     14],
          [ 4,      5],
          [ 3,      3.5],
          [ 6.5,    7]
        ]);

        var options = {
          title: 'Age vs. Weight comparison',
          hAxis: {title: 'Age', minValue: 0, maxValue: 15},
          vAxis: {title: 'Weight', minValue: 0, maxValue: 15},
          legend: 'none'
        };

        var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>


load（“可视化”、“1”、{packages:[“corechart”]}）；
setOnLoadCallback（drawChart）；
函数绘图图（）{
var data=google.visualization.arrayToDataTable([
[‘年龄’、‘体重’]，
[ 8,      12],
[ 4,      5.5],
[ 11,     14],
[ 4,      5],
[ 3,      3.5],
[ 6.5,    7]
]);
变量选项={
标题：“年龄与体重对比”，
hAxis:{title:'Age'，minValue:0，maxValue:15}，
变量：{title:'Weight'，minValue:0，maxValue:15}，
图例：“无”
};
var chart=new google.visualization.ScatterChart（document.getElementById（'chart_div'））；
图表绘制（数据、选项）；
}

我想当点击一个圆时，只显示那些在半径x范围内的循环。有什么想法吗？？

谢谢大家!

您需要过滤数据表，以获得选定点给定半径内的所有点。以下是一些可以为您实现此目的的代码：

google.visualization.events.addListener(chart, 'select', function () {
    var selection = chart.getSelection();
    if (selection.length > 0) {
        // get all data points within radius r of the selected point
        var r, x, y;
        r = <the radius to use>;
        x = data.getValue(selection[0].row, 0);
        y = data.getValue(selection[0].row, 1);

        var rows = [];
        for (var i = 0, count = data.getNumberOfRows(), dx, dy; i < count; i++) {
            dx = data.getValue(i, 0) - x;
            dy = data.getValue(i, 1) - y;
            if (Math.sqrt(dx * dx + dy * dy) <= r) {
                rows.push(i);
            }
        }
        // do something with filtered rows
    }
});

google.visualization.events.addListener（图表，'select'，函数（）{
var selection=chart.getSelection（）；
如果（selection.length>0）{
//获取选定点半径r内的所有数据点
var r，x，y；
r=；
x=data.getValue（选择[0]。行，0）；
y=data.getValue（选择[0]。行，1）；
var行=[]；
对于（var i=0，count=data.getNumberOfRows（），dx，dy；i