How to add a tooltip to a FLOT graph

Question

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?

Answer 1

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/