Angularjs 如何在谷歌图表的工具提示中添加行数

我用谷歌图表在屏幕上显示我的数据。使用如下所示的列之一聚合数据

 var dataGroup = google.visualization.data.group(
             data, // data table
             [0], // group by column
             [
                 { // aggregation column
                     column: 1,
                     type: 'number',
                     aggregation: google.visualization.data.avg
                 }
             ]
         );
        chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
        chart.draw(dataGroup, $scope.getOptionsForChart());

现在我要做的是在工具提示中添加行数

---

提前感谢。

在工具提示中添加信息时没有标准选项，
您必须用自己的自定义工具提示替换整个工具提示

要使用自定义html工具提示，必须有两件事

1） 必须使用以下图表选项

  tooltip: {
    isHtml: true
  }

2） 工具提示列必须具有以下属性

  p: {html: true}

---

请参阅以下工作片段

将为计数添加一个聚合列

然后使用

DataView

将计数列转换为工具提示列

但是，在使用

DataView

时，由于某些原因，

html

列属性被忽略

因此，绘制图表时，将

数据视图

转换回

数据表

 chart.draw(view.toDataTable(), ...

这将允许图表识别列属性

  p: {html: true}

google.charts.load（'current'{
回调：函数（）{
var datastring={“PerformanceData”：[{“ReportName”：“ABC”，“ReportTime”：“48”}，{“ReportName”：“ABC”，“ReportTime”：“48”}，{“ReportName”：“XYZ”，“ReportTime”：“50”}，{“ReportName”：“ABC”，“ReportTime”：“48”}，{“ReportName”：“XYZ”，“ReportTime”：“50”}，{“ReportName”：“ABC”，“ReportTime”：“48”}，{“ReportName”：“XYZ”，“ReportTime”：“50”}；
var jsonData=JSON.parse（datastring）；
var chartData=[]；
//负荷图数据
jsonData.PerformanceData.forEach（函数（行，行索引）{
//列标题
var columns=Object.keys（行）；
如果（行索引===0）{
chartData.push（列）；
}
//行值
var chartRow=[]；
columns.forEach（函数（column，colIndex）{
var chartCell=行[列]；
如果（colIndex>0）{
chartCell=parseFloat（chartCell）；
}
chartRow.push（chartCell）；
});
chartData.push（chartRow）；
});
var data=google.visualization.arrayToDataTable（chartData）；
//组数据
var dataGroup=google.visualization.data.group(
data，//数据表
[0]，//按列分组
[
{//平均值
专栏：1，
键入：“编号”，
聚合：google.visualization.data.avg，
标签：data.getColumnLabel（1）
},
{//count
专栏：1，
键入：“编号”，
聚合：google.visualization.data.count
}
]
);
var view=newgoogle.visualization.DataView（数据组）；
view.setColumns（[0,1,1{
键入：“字符串”，
角色：“工具提示”，
计算：函数（dt，行）{
返回“”+
''+dt.getValue（行，0）+''+
''+dt.getColumnLabel（1）+'（平均值）：'+dt.getValue（行，1）+''+
'行计数：'+dt.getValue（行，2）+''+
'';
},
p:{html:true}
}]);
var chart=new google.visualization.ColumnChart（document.getElementById（'chart_div'））；
//使用组数据绘制图表
chart.draw（view.todata（）{
工具提示：{
isHtml：是的
}
});
},
软件包：['corechart']
});
。工具提示{
字号：12号；
填充：8px；
}
.工具提示分区{
填充：4px；
}
.工具提示范围{
字体大小：粗体；
}