jQuery/Flot: How do you get the coordinates of a datapoint?

Question

I'm currently looking at the example at http://people.iola.dk/olau/flot/examples/interacting.html but I can't figure out, how to get the coordinates of a datapoint. I won't be clicking on the Plot so I can't make use of the event plotclick. Now my question: is there another way to get the x and y coordinates of a datapoint, without clicking? I will be using the jQuery slider to highlight different points on a graph and would like to have a tooltip next to the datapoints.

Thanks in advance :)

Answer 1

Theoretically getting x,y coordinates inside a container is as follows:

$(function () {
        $('#container').mousemove(function (e) {
            $('.xPos').text(e.clientX - $('#container').offset().left);
            $('.yPos').text(e.clientY - $('#container').offset().top);
        });
    });

Answer 2

From the flot API:

Various things are stuffed inside an axis object, e.g. you could use getAxes().xaxis.ticks to find out what the ticks are for the xaxis. Two other useful attributes are p2c and c2p, functions for transforming from data point space to the canvas plot space and back. Both returns values that are offset with the plot offset.

Combined with plot.offset() (the offset of the grid area relative to the document), you should have all the tools you need to figure out the rest. plot.pointOffset() is also useful. It returns the position of a point relative to the containing div.