Charts 如何显示工具提示,其中包含谷歌图表上具有相同x和y的多个数据点的信息
所以基本上我有这样的数据Charts 如何显示工具提示,其中包含谷歌图表上具有相同x和y的多个数据点的信息,charts,google-visualization,Charts,Google Visualization,所以基本上我有这样的数据 ['x', 'y', 'name'] 我在散点图上显示的 我希望在悬停数据点时,名称显示在工具提示中,因此我所做的是 data.addColumn('number', 'x'); data.addColumn('number', 'y'); data.addColumn({type: 'string', role: 'tooltip'}); 然后 data.addRows([x, y, name]) 我的问题是,我的数据可能有几个条目具有相同的x和y。发生这种情况
['x', 'y', 'name']
我在散点图上显示的
我希望在悬停数据点时,名称显示在工具提示中,因此我所做的是
data.addColumn('number', 'x');
data.addColumn('number', 'y');
data.addColumn({type: 'string', role: 'tooltip'});
然后
data.addRows([x, y, name])
我的问题是,我的数据可能有几个条目具有相同的x和y。发生这种情况时,图形上会显示一个数据点,并在行中显示姓氏的工具提示。我希望它是几个名字的串联
有没有办法调整选项来实现这一点?还是我注定要建立自己的逻辑来处理它?干杯尝试以下选项
aggregationTarget: 'category'
aggregationTarget
-'category'
:按x值对所选数据进行分组
编辑 另一个选项是为工具提示角色使用具有计算列的数据视图 计算列具有针对每行运行的
calc
函数。在这里,找到当前行的x,y值,
然后检查数据表中是否有与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);
//创建数据表
var data=new google.visualization.DataTable();
data.addColumn('number','x');
data.addColumn('number','y');
addColumn({type:'string',role:'tooltip'});
//添加行
data.addRows([[x,y,name]]);
//创建数据视图
var view=newgoogle.visualization.DataView(数据);
//在数据视图上设置列
view.setColumns([0,1,1{
计算:函数(dt,行){
//获取当前行的x,y
var x=dt.getValue(行,0);
变量y=dt.getValue(第1行);
变量名=“”;
//查找具有匹配x,y的行
对于(var i=0;i
不确定该选项是否适用于自定义工具提示列,请参见上面的“编辑”…这很有效!谢谢mate:)小问题-创建数据表然后将其转换为数据视图背后的原因是什么?创建数据视图是拥有计算列的唯一方法,我们必须有一个数据表才能从中创建数据视图。。。