javascript - Protovis Jquery 工具提示问题

Question

我想在我的 Web 应用程序中使用 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!

希望得到任何意见。谢谢!

Answer 1

这里的问题是，您试图在 Protovis 对象(本例中为 pv.Bar)上链接 jQuery 函数 .tooltip()。那是行不通的。有几个选项:

• 如果您愿意更改 jQuery 插件，您可以按照 this example 进行操作。 ，它使用 Tipsy .

• 您可以调整 pv.Behavior.tipsy 代码 shown here使用 tooltip() 代替。看起来你可以很容易地做到这一点，只需编辑第 33 行和第 64 行以使用不同的插件 - 这段代码中的困难工作是创建一个 div 元素来附加工具提示，这就是两个插件都是一样的。