2

我正在尝试在 Google 散点图上获取所选实体的工具提示。我创建我的数据表如下：

data = google.visualization.arrayToDataTable([
    ['Lines changed', 'TTL', 'Tooltip'],
    [25, 12, 'Text for first'],
    [34, 20, 'Text for second']
]);

然后我可以使用

google.visualization.events.addListener(chart, 'select', function () {
    // when a point is selected
    var selection = chart.getSelection();
    console.log(data.getValue(selection[0].row, selection[0].column)); // this gives me the Y-value for that row and index
});

有谁知道如何从该行和索引而不是 Y 值获取工具提示文本？

编辑

我确实可以通过设置列属性来使用该方法添加工具提示，例如arrayToDataTable()：

data.setColumnProperty(2, 'role', 'tooltip');

这使得第三列（索引 2）成为工具提示。只是我不能（轻松地）使用上述方法将 HTML 添加到工具提示中。我不得不恢复使用new google.visualization.DataTable()。

4

2 回答 2

8

您无法使用 向图表添加工具提示arrayToDataTable。正如文档所说：

google.visualization.arrayToDataTable(twoDArray, opt_firstRowIsData)

twoDArray :一个二维数组，其中每一行代表数据表中的一行。如果 opt_firstRowIsData 为 false（默认值），则第一行将被解释为标题标签。每列的数据类型是根据给定的数据自动解释的。如果单元格没有值，请根据需要指定 null 或空值。您不能将 Date 或 DateTime 值或 JavaScript 文字对象表示法用于单元格值。

使用addColumn/addRows代替：

function drawVisualization() {
    var dataTable = new google.visualization.DataTable();
    dataTable.addColumn('number', 'Lines changed');
    dataTable.addColumn('number', 'TTL');

    // column for tooltip content
    dataTable.addColumn({type: 'string', role: 'tooltip'});

    dataTable.addRows([
        [25, 12, 'Text for first'],
        [34, 20, 'Text for second']
    ]);

    // create and draw the visualization.
    var chart = new google.visualization.ScatterChart(document.getElementById('visualization'));
    chart.draw(dataTable);
}
google.setOnLoadCallback(drawVisualization);

上面的代码生成以下散点图：

在此处输入图像描述

更新

完全忘记了这个问题:-)这是在单击事件中提取工具提示的方法（几乎与您的代码相似，只是解决了 dataTable ）：

google.visualization.events.addListener(chart, 'select', function() {
    var selection = chart.getSelection();
    // this gives you 'Text for first' / 'Text for second' etc
    console.log(dataTable.getValue(selection[0].row, 2)); 
});
于 2013-08-15T12:48:24.567 回答
2

添加到上面 davidkonrad 的答案中，如果您有多个数据系列并且想要专门访问与所选数据点关联的工具提示字符串，那么您可以这样做：

google.visualization.events.addListener(chart, 'select', function () {
    // when a point is selected
    var selection = chart.getSelection();
    console.log(data.getValue(selection[0].row, selection[0].column + 1));
});

这假定每个数据系列都有一个关联的自定义工具提示列。

于 2013-08-15T16:16:17.493 回答