category tooltips and selection show wrong category when column chart is scrolled

22 views
Skip to first unread message

Suzanne Paley

unread,
Oct 27, 2016, 3:33:30 PM10/27/16
to Google Visualization API
This is a bug report (btw, am I better off reporting this here in the forum, or on the github site, or does it not make a difference?).  I have a column chart inside a div with overflow:auto.  Thus, when the specified width exceeds the width of the div, the chart is scrollable.  So far so good.  However, when I scroll to the right and mouse over one of the categories, the tooltip that shows up and the category that gets highlighted is the one that would have been under the mouse had I not scrolled, i.e. it's the wrong category.  Clicking also selects the wrong category.  This seems like a fairly serious bug.

I modified one of your example fiddles to demonstrate the problem: https://jsfiddle.net/nemefev8/

BTW, in this example, notice also that the x-axis category labels are almost all replaced with "...".  Is there any way to stop it from doing that?

Thanks,
Suzanne

Daniel LaLiberte

unread,
Oct 27, 2016, 4:00:50 PM10/27/16
to Google Visualization API
Hi Suzanne,

Posting questions about an issue in the forum first is a good idea.  When you are sure you have found a bug, then posting on the GitHub issues list is fine.

For your issue, this is a known problem area, which should be better documented at least.  If your chart container element is positioned, or scrollable, or has padding, then the sensitivity of where the mouse appears to be will be offset from where it actually is.  I'm not sure we can deal with this properly inside of the charts code, though it would seem we should be able to.  It has been a long-standing issue that we haven't tried to deal with, mostly because there is a workaround.

You can work around these kinds of problems by simply wrapping your chart container with another div where you do the positioning, scrolling, or padding.  Like this:   https://jsfiddle.net/dlaliberte/nemefev8/2/

I also set the height option, and the chartArea height and bottom to enable the full display of the tick labels.


--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/2f08d729-d5c8-485e-9a85-3e5accae4347%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.



--

Suzanne Paley

unread,
Oct 27, 2016, 4:47:38 PM10/27/16
to Google Visualization API
Thanks, that helped.
Suzanne
Reply all
Reply to author
Forward
0 new messages