我想在我的网络应用程序中使用Jquery工具提示显示数据。
我已按照此网站http://flowplayer.org/tools/demos/tooltip/index.html上的示例操作,并设法在我的应用程序的图片上显示工具提示。
但是,我现在正在使用Protovis生成一些子弹图,并且当我将鼠标悬停在子弹图上时想要显示数据。
我想知道如何编辑以显示工具提示?目前我可以使用html标签显示,但我真正想要的是使用javascript代码显示工具提示。
在我的子弹图表代码下面:
var vis = new pv.Panel()
.data(patientData)
.width(140)
.height(20)
.right(10)
.bottom(20)
.left(5);
var bullet = vis.add(pv.Layout.Bullet)
.orient("left")
.ranges(function(d) d.ranges)
.measures(function(d) d.measures)
.markers(function(d) d.markers);
bullet.range.add(pv.Bar);
bullet.measure.add(pv.Bar)
.fillStyle("black")
.text(function(d) "Current Month: "+ d.toFixed(1)+"%")
.tooltip(); -->This give me an error!
非常感谢任何投入。谢谢!
答案 0 :(得分:2)
这里的问题是你试图在Protovis对象上链接一个jQuery函数.tooltip()
,在本例中是pv.Bar
。那不行。有两种选择:
如果您愿意更改自己的jQuery插件,可以关注使用this example的Tipsy。
您可以调整pv.Behavior.tipsy
代码shown here来改为使用工具提示()。看起来你可以很容易地做到这一点,只需编辑第33和第64行来使用不同的插件 - 这段代码中的艰苦工作是创建一个div
元素来附加工具提示,这两者都是相同的插件。