I think google chart events are broken

120 views
Skip to first unread message

Matthew Mc Allister

unread,
Nov 15, 2023, 7:48:45 AM11/15/23
to Google Visualization API
in a react project, I am making use of the react-google-charts library(yes, I know this is not maintained by google, just hear me out). It's a typescript port but it still fetches the relevant JS scripts from https://www.gstatic.com/charts/loader.js 

in order to add click events to these charts you need to wait for the "ready" event to fire and give it a callback in which you call google.visualization.events.addListener(chart,"click",()=>{});

however, the "ready" event no longer seems to be firing, and thus my click events are not being added

Daniel LaLiberte

unread,
Nov 15, 2023, 3:04:31 PM11/15/23
to google-visua...@googlegroups.com
If events are no long being fired, I would suspect that the chart is being rebuilt from scratch somehow.  I am not familiar enough with react to be able to help you figure out why that might be happening.  

By the way, you normally would not want to add a click event handler every time the chart is 'ready', since that can happen multiple times depending on other things, such as animation.  Instead, you should use the addOneTimeListener(chart, 'ready', ...) which will be called only one time, and then auto-removed.  See https://developers.google.com/chart/interactive/docs/basic_interactivity

--
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-visualizati...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/15c2ed8e-aa8c-420d-b0d5-2c386bbafb21n%40googlegroups.com.


--

Daniel LaLiberte

 • SWE

 Cambridge MA

 • dlaliberte@Google.com

Matthew Mc Allister

unread,
Nov 18, 2023, 4:12:30 AM11/18/23
to Google Visualization API
UPDATE:
it seems that react-google-charts, which is not frequently maintained, is the issue.

I was able to build my own react wrapper component, with minimal functionality for google charts, but it meets my needs so...
Reply all
Reply to author
Forward
0 new messages