admin管理员组

文章数量:1422461

I saw a site that embedded an interactive Google trend chart on the page:

When I inspected the element, the chart was embedded with the code:

<script type="text/javascript" src=".js?hl=en-US&amp;q=danbo%20robot,danbo%20amazon,danbo%20yotsuba&amp;content=1&amp;cid=TIMESERIES_GRAPH_0&amp;export=5&amp;w=600&amp;h=350"></script>

I checked the top of the html for google related script and I found these:

<script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics/analytics.js','ga'); ga('create', 'UA-15176568-9'); ga('send', 'pageview'); </script>

<script type="text/javascript"> var googletag = googletag || {}; googletag.cmd = googletag.cmd || []; (function() { var gads = document.createElement('script'); gads.async = true; gads.type = 'text/javascript'; gads.src = '.js'; var node = document.getElementsByTagName('script')[0]; node.parentNode.insertBefore(gads, node); })(); googletag.cmd.push(function() { googletag.pubads().setTargeting('site', 'kym'); googletag.pubads().setTargeting('page', '_memes_danbo'); }); </script>

But when i created an html file as such:

<html>

<script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics/analytics.js','ga'); ga('create', 'UA-15176568-9'); ga('send', 'pageview'); </script>

<script type="text/javascript"> var googletag = googletag || {}; googletag.cmd = googletag.cmd || []; (function() { var gads = document.createElement('script'); gads.async = true; gads.type = 'text/javascript'; gads.src = '.js'; var node = document.getElementsByTagName('script')[0]; node.parentNode.insertBefore(gads, node); })(); googletag.cmd.push(function() { googletag.pubads().setTargeting('site', 'kym'); googletag.pubads().setTargeting('page', '_memes_danbo'); }); </script>

<script type="text/javascript" src=".js?hl=en-US&amp;q=danbo%20robot,danbo%20amazon,danbo%20yotsuba&amp;content=1&amp;cid=TIMESERIES_GRAPH_0&amp;export=5&amp;w=600&amp;h=350"></script>

</html>

I did not have the Google trend chart but I didn't get the chart and had this:

When you go to the Google trend site, e.g. #q=danbo+robot,danbo+amazon,danbo+yotsuba , there are embedded scripts that one can copy and paste into the html but when i put it in my own html it didn't work too.

How do I embed an interactive Google trend chart like at the end of this webpage ?

I saw a site that embedded an interactive Google trend chart on the page: http://knowyourmeme./memes/danbo

When I inspected the element, the chart was embedded with the code:

<script type="text/javascript" src="http://www.google./trends/embed.js?hl=en-US&amp;q=danbo%20robot,danbo%20amazon,danbo%20yotsuba&amp;content=1&amp;cid=TIMESERIES_GRAPH_0&amp;export=5&amp;w=600&amp;h=350"></script>

I checked the top of the html for google related script and I found these:

<script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics./analytics.js','ga'); ga('create', 'UA-15176568-9'); ga('send', 'pageview'); </script>

<script type="text/javascript"> var googletag = googletag || {}; googletag.cmd = googletag.cmd || []; (function() { var gads = document.createElement('script'); gads.async = true; gads.type = 'text/javascript'; gads.src = 'http://www.googletagservices./tag/js/gpt.js'; var node = document.getElementsByTagName('script')[0]; node.parentNode.insertBefore(gads, node); })(); googletag.cmd.push(function() { googletag.pubads().setTargeting('site', 'kym'); googletag.pubads().setTargeting('page', '_memes_danbo'); }); </script>

But when i created an html file as such:

<html>

<script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics./analytics.js','ga'); ga('create', 'UA-15176568-9'); ga('send', 'pageview'); </script>

<script type="text/javascript"> var googletag = googletag || {}; googletag.cmd = googletag.cmd || []; (function() { var gads = document.createElement('script'); gads.async = true; gads.type = 'text/javascript'; gads.src = 'http://www.googletagservices./tag/js/gpt.js'; var node = document.getElementsByTagName('script')[0]; node.parentNode.insertBefore(gads, node); })(); googletag.cmd.push(function() { googletag.pubads().setTargeting('site', 'kym'); googletag.pubads().setTargeting('page', '_memes_danbo'); }); </script>

<script type="text/javascript" src="http://www.google./trends/embed.js?hl=en-US&amp;q=danbo%20robot,danbo%20amazon,danbo%20yotsuba&amp;content=1&amp;cid=TIMESERIES_GRAPH_0&amp;export=5&amp;w=600&amp;h=350"></script>

</html>

I did not have the Google trend chart but I didn't get the chart and had this:

When you go to the Google trend site, e.g. http://www.google./trends/explore?hl=en-US#q=danbo+robot,danbo+amazon,danbo+yotsuba , there are embedded scripts that one can copy and paste into the html but when i put it in my own html it didn't work too.

How do I embed an interactive Google trend chart like at the end of this webpage http://knowyourmeme./memes/danbo ?

Share Improve this question asked Nov 19, 2014 at 22:17 alvasalvas 123k116 gold badges499 silver badges799 bronze badges 3
  • Actually, it works. Did you put your code directly in <html> tag? It's better to obey structure html > head + body. – Tommi Commented Nov 19, 2014 at 22:26
  • When i ran open the html file locally with internet conenction, i get The file or directory could not be found.instead of the chart. – alvas Commented Nov 19, 2014 at 22:36
  • 2 Problem is inside code which script downloads from google server: document.write('<iframe width="600" height="350" src="//www.google./trends/fetchComponent?hl\75en-US\46q\75danbo%20robot,danbo%20amazon,danbo%20yotsuba\46content\0751\46cid\75TIMESERIES_GRAPH_0\46export\0755\46w\075600\46h\075350" style="border: none;"></iframe>'); This part: src="// tell browser to open iframe via same protocol that main page uses. This protocol is file: in your case, and obviously you don't have such path on your HDD. You should use local server to serve your page via http: – Tommi Commented Nov 19, 2014 at 22:45
Add a ment  | 

1 Answer 1

Reset to default 2

Include the Google trend result in an iframe and you are done.

<iframe scrolling="no" style="border:none;" width="640" height="330" src="http://www.google./trends/fetchComponent?hl=en-US&q=danbo+robot,danbo+amazon,danbo+yotsuba &cmpt=q&content=1&cid=TIMESERIES_GRAPH_0&export=5&w=640&h=330"></iframe>

See Demo

本文标签: javascriptHow to embed google trend chart in htmlStack Overflow