Search code examples
javascriptjquerytooltipflotjquery-ui-tooltip

How to add a tooltip to a FLOT graph


This is the full code that I am trying to use. It works without the tooltip functions but not when including them

The code produces a graph with 2 lines and bars. How do I add a tooltip without it messing up my graph and actually add some interactivity?


Solution

  • There were a number of different errors in your fiddle:

    • The grid options were missing the necessary hoverable: true

    • Another missing # before placeholder in in $("placeholder").bind("plothover", ...

    • } else( should be } else { (from empiric's comment)

    • A superfluous var in var y = item.datapoint[1].toFixed(0); (or replace the , with a ; between the two var statements)

    • Change position: 'abolute' to position: 'absolute' in the CSS of the tooltip

    Some of the errors are found when looking at the console of your browser.

    Updated working fiddle: https://jsfiddle.net/L9gaupcu/