如何显示工具提示，其中包含 google 图表上具有相同 x 和 y 的多个数据点的信息

Question

所以基本上我的数据看起来像

['x', 'y', 'name']

我在散点图上显示的。

我希望在悬停数据点时名称出现在工具提示中，所以我所做的是

data.addColumn('number', 'x');
data.addColumn('number', 'y');
data.addColumn({type: 'string', role: 'tooltip'});

然后

data.addRows([x, y, name])

我的问题是我的数据可能有多个条目具有相同的 x 和 y。当发生这种情况时，单个数据点将显示在图表上，并在行中显示姓氏的工具提示。我希望它是几个名字的串联。

有什么方法可以调整选项来实现这一点？还是我注定要建立自己的逻辑来处理它？干杯

Answer 1

尝试以下选项...

aggregationTarget: 'category'

aggregationTarget - 'category': Group selected data by x-value.

编辑

另一种选择是使用带有工具提示角色计算列的数据视图。

计算列有一个针对每一行运行的 calc 函数。
在这里，找到当前行的 x、y 值，
然后检查数据 table 是否具有匹配的 x、y 值的其他行，
并连接名称。

请参阅以下代码片段...

// create data table
var data = new google.visualization.DataTable();
data.addColumn('number', 'x');
data.addColumn('number', 'y');
data.addColumn({type: 'string', role: 'tooltip'});

// add rows
data.addRows([[x, y, name]]);

// create data view
var view = new google.visualization.DataView(data);

// set columns on data view
view.setColumns([0, 1, {
  calc: function (dt, row) {
    // get x, y for current row
    var x = dt.getValue(row, 0);
    var y = dt.getValue(row, 1);
    var name = '';

    // find rows with matching x, y
    for (var i = 0; i < dt.getNumberOfRows(); i++) {
      var testX = dt.getValue(i, 0);
      var testY = dt.getValue(i, 1);
      if ((x === testX) && (y === testY)) {
        // concat name
        if (name !== '') {
          name += ', ';
        }
        name += dt.getValue(i, 2);
      }
    }

    return name;
  },
  role: 'tooltip',
  type: 'string'
}]);

// draw chart with view
chart.draw(view, options);

如何显示工具提示，其中包含 google 图表上具有相同 x 和 y 的多个数据点的信息

How to show a tooltip with info from several data points that have the same x and y on google charts

charts

google-visualization