-4

I'm using the flot library

How do I get the correct tooltips if I scale the chart with this css rule: transform: scale(0.7);

flot source uses the function findNearbyItem to find hovered items.

[FIDDLE] that demonstrates both cases - scale(1), and scale(.7)

Vickel
  • 7,879
  • 6
  • 35
  • 56
animaacija
  • 170
  • 9
  • 25
  • could you please elaborate your question a bit more, what do you mean with getting "plothover right" ? – Vickel Jun 03 '16 at 19:39

1 Answers1

1

taking your fiddle as source of the question, there is actually several problems to take care of:

  1. the tooltip doesn't work correctly, if you hover over the tooltip, it disappears (starts flickering). Check the updated fiddle, which now hides the tooltip if you move away from the bar and stays if you hover over the tooltip itself.

  2. scaling issue: just scale the canvas wrapper. 

    <div id="placeholder2" style="width:420px;height:210px;margin-top:40px;"></div>

    scales the canvas to the same size like the css transform 

    <div id="placeholder2" style="transform:scale(.7)"></div>

    but maintains the correct bar values and shows the tooltip in the correct position.

Vickel
  • 7,879
  • 6
  • 35
  • 56
  • yes, thank you, i know it works if only canvas is scaled, but the situation is specific - scaled is the whole body using css. I found the solution, and had to modify plugin source. never trust `$.offset` ^^ – animaacija Jun 08 '16 at 08:23