Embedding the Google visualisation API in Wordpress

[dunba...@gmail.com]

Hi, 

I'm starting this thread because I notice there has only been piecemeal discussion here about embedding the API in WordPress sites. I have a lot of experience with this - I spent the last year creating a subscription Wordpress site https://riskyfinance.com which depends heavily on Google charts. I used a plugin called Code Embed which lets me paste Javascript into my Wordpress posts and it works pretty well, however there are a couple of limitations: 

1. If I want multiple charts on a single page, I have to include google.load and google.setOnLoadCallback in each chart script, otherwise the charts won't work. 

2. If I want multiple charts, I get a red chart draw error if use the gstatic loader, hence I am forced to use jsapi (so please don't turn it off!)

I am interested in what kind of performance penalty these constraints impose on my site, and whether anyone has experience or recommendations for doing things in a better way. Changing things incurs developer costs so I want to understand the trade offs before doing that. 

I appreciate that Google Visualization staff aren't responsible for how their API works in WordPress, but I would point out that WordPress is very widely used (25% of sites worldwide use it apparently) so it might be useful for the team to look into it and provide some FAQs or recommendations. 

Regards,

Nick 

[Daniel LaLiberte]

Hi Nick,

Thanks for posting about your experiences using Google Charts with wordpress.  

I'm not sure what inherent limitations wordpress will impose on plugins, but the Code Embed plugin sounds like it is wrapping the embedded code in an iframe, which means you would then have to load the charts code in each embed since each iframe is another document.  Loading the charts code multiple times is an extra time and space overhead, but at least the browser should cache the code so it doesn't get requested across the network each time.  

It is possible for iframes to get access to the scripts in the parent page so it is conceivable that there could be some sharing, but it would be challenging to make that work, I believe, given some experiments we have done in the past.  We are closer to that goal, but there are still several hurdles. 

There may be some options with Code Embed to not wrap the embedded code in an iframe.  Check out the global embed feature.

You should try the gstatic loader with 'upcoming' since that version (45) does support multiple load calls.  If you get errors with that, I would be curious to find out why.

--
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/2e547cfb-1350-47bb-9318-3866a273cbaa%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Daniel LaLiberte

dlaliberte@Google.com   5CC, Cambridge MA

[Nick Dunbar]

Hi Dan, 

Thanks for your reply. 

My developers managed to put the JQuery API call in the parent page, but they didn't do that for Google charts. It could be because I am using a lot of different chart packages on different parts of my site and there would have been a penalty loading every package whether it was needed or not for a particular chart. 

I will try out Gstatic 45 and see how I get on. 

Regards, 

Nick 

On Thu, Aug 25, 2016 at 3:57 PM, 'Daniel LaLiberte' via Google Visualization API <google-visua...@googlegroups.com> wrote:

Hi Nick,

Thanks for posting about your experiences using Google Charts with wordpress.  

I'm not sure what inherent limitations wordpress will impose on plugins, but the Code Embed plugin sounds like it is wrapping the embedded code in an iframe, which means you would then have to load the charts code in each embed since each iframe is another document.  Loading the charts code multiple times is an extra time and space overhead, but at least the browser should cache the code so it doesn't get requested across the network each time.  

It is possible for iframes to get access to the scripts in the parent page so it is conceivable that there could be some sharing, but it would be challenging to make that work, I believe, given some experiments we have done in the past.  We are closer to that goal, but there are still several hurdles. 

There may be some options with Code Embed to not wrap the embedded code in an iframe.  Check out the global embed feature.

You should try the gstatic loader with 'upcoming' since that version (45) does support multiple load calls.  If you get errors with that, I would be curious to find out why.

On Thu, Aug 25, 2016 at 7:46 AM, <dunba...@gmail.com> wrote:

Hi, 

I'm starting this thread because I notice there has only been piecemeal discussion here about embedding the API in WordPress sites. I have a lot of experience with this - I spent the last year creating a subscription Wordpress site https://riskyfinance.com which depends heavily on Google charts. I used a plugin called Code Embed which lets me paste Javascript into my Wordpress posts and it works pretty well, however there are a couple of limitations: 

1. If I want multiple charts on a single page, I have to include google.load and google.setOnLoadCallback in each chart script, otherwise the charts won't work. 

2. If I want multiple charts, I get a red chart draw error if use the gstatic loader, hence I am forced to use jsapi (so please don't turn it off!)

I am interested in what kind of performance penalty these constraints impose on my site, and whether anyone has experience or recommendations for doing things in a better way. Changing things incurs developer costs so I want to understand the trade offs before doing that. 

I appreciate that Google Visualization staff aren't responsible for how their API works in WordPress, but I would point out that WordPress is very widely used (25% of sites worldwide use it apparently) so it might be useful for the team to look into it and provide some FAQs or recommendations. 

Regards,

Nick 

--
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+unsubscr...@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/2e547cfb-1350-47bb-9318-3866a273cbaa%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Daniel LaLiberte

dlaliberte@Google.com   5CC, Cambridge MA

--
You received this message because you are subscribed to a topic in the Google Groups "Google Visualization API" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-visualization-api/vgifxInnRGQ/unsubscribe.
To unsubscribe from this group and all its topics, 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/CAOtcSJOLSO4RLwSGyvLnAz_fBgXGCt2SDGeAfsdUc6Co6JJjmA%40mail.gmail.com.