开发者

Protovis Jquery Tooltip problem

开发者 https://www.devze.com 2023-03-21 20:51 出处:网络
I would like to display data using Jquery tooltip in my web application. I have followed the example on this website http://flowplayer.org/tools/demos/tooltip/index.html and have managed to display o

I would like to display data using Jquery tooltip in my web application.

I have followed the example on this website http://flowplayer.org/tools/demos/tooltip/index.html and have managed to display out a tooltip on a picture on my application.

However, I am generating some bulletchart using Protovis now and would like to display out the data when I mouse over on the bullet chart.

I want to know how do I edit to make the tooltip appear? Currently I am able to display using html tags, but what I really want is to display the tooltip using javascript code.

Below my codes for bullet chart:

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)+"%")
           开发者_如何学Python .tooltip(); -->This give me an error!

Would appreciate any inputs. thanks!


The problem here is that you're trying to chain a jQuery function, .tooltip(), on a Protovis object, in this case a pv.Bar. That's not going to work. A couple of options:

  • If you're willing to change your jQuery plugin, you could probably follow this example, which uses Tipsy.

  • You could adapt the pv.Behavior.tipsy code shown here to use tooltip() instead. It looks like you could do this pretty easily, just by editing lines 33 and 64 to use a different plugin - the hard work in this code is creating a div element to attach the tooltip to, and that's the same for both plugins.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号