Javascript 向google可视化条形图添加工具提示

我正试图在谷歌条形图中添加自定义工具提示，但我不知道该怎么做。 谷歌提供了一个不错的教程（at），但它只讨论柱形图，而不是条形图

我的代码是这样的：

google.load（“可视化”、“1.1”、{packages:[“bar”]}）；
setOnLoadCallback（drawStuff0）；
函数drawStuff0（）{
var data=new google.visualization.arrayToDataTable（[$data]）；
变量选项={
标题：“类别”，
宽度：900，
图例：{位置：'无'}，
图表：{title:'受欢迎程度（按查询数量）'，
副标题：“查询类别的次数”}，
条形图：“水平”，//物料条形图为必填项。
轴线：{
x:{
0:{side:'top'，label:'查询类别的次数'}//top x轴。
}
},
条：{groupWidth:“90%”
};
var chart=new google.charts.Bar（document.getElementById（'top_x_div0'）；
//将经典选项转换为材质选项。
绘制（数据，google.charts.Bar.convertOptions（选项））；
};

$data

只是一个包含图表行的PHP变量

有人能解释一下如何在这个图表中添加自定义工具提示吗？

---

我在网上到处寻找解决方案，但没有找到…

使用角色

工具提示向DataTable对象添加一个新列：

data.addColumn（{type:'string'，role:'tooltip'}）；

然后循环查看
数据
，并为每行添加所需的工具提示（下面单列条形图中的示例）：

用于（变量i=0；i

我无法更准确地指导您，因为我们不知道您的PHP
$data
是什么，也不知道您的图表是什么样子的。但在所有情况下，当您想要动态地向图表添加自定义工具提示时，基本上都应该这样做


更新-设置工具提示的样式

至于“有没有办法让工具提示显示为矩形，而不是语音模糊”，请在选项中将
tooltip
设置为
isHtml
：

var选项={
工具提示：{isHtml:true}
}

然后，工具提示显示为矩形，类似于普通HTML元素工具提示。您还可以指定要在工具提示本身内使用HTML：

data.addColumn（{type:'string'，role:'tooltip'，p:{'html'：true}}）；

例如，要使用普通工具提示的颜色显示工具提示，但要使用较大的字体大小和特定字体，请执行以下操作：

div.tooltip{
背景色：#ffffca；
颜色：#000023；
填充：10px；
字体大小：20px；
字体系列：“arial”；
}

将工具提示设置为原始答案：

data.setValue（i，2，“工具提示”#“+i+”）；

演示->
非常感谢您提供的示例，它非常有用！下面是我想要的图表外观的图片：。您知道如何保留该图表的“外观”（字体、大小等），在添加您提供的代码时？还有，是否有办法使工具提示显示为矩形，而不是语音模糊？@JMS，您的文档中没有图像link@JMS，这可能是imageserver上的缓存问题。我无法通过查看图像来判断字体、大小、颜色等。它看起来对我来说完全是标准的，h顺便说一句，与工具提示没有太大关系：）但我可以告诉你如何通过谷歌可视化获得矩形工具提示，以及如何设置它们的样式，请参阅更新。回答得很好，我真的很感激