javascript - 如何在html中嵌入谷歌趋势图?

标签 javascript html google-trends

我看到一个网站在页面上嵌入了交互式 Google 趋势图:http://knowyourmeme.com/memes/danbo

当我检查元素时,图表嵌入了代码:

<script type="text/javascript" src="http://www.google.com/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 的顶部是否有与 google 相关的脚本,我发现了这些:

<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.com/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.com/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>

但是当我这样创建一个 html 文件时:

<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.com/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.com/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.com/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>

我没有 Google 趋势图,但我没有得到图表,但有这个:

enter image description here

当您访问 Google 趋势网站时,例如http://www.google.com/trends/explore?hl=en-US#q=danbo+robot,danbo+amazon,danbo+yotsuba ,有嵌入式脚本,可以将其复制并粘贴到 html 中,但是当我将它放入我自己的 html 中时,它也不起作用。

如何像本网页末尾那样嵌入交互式 Google 趋势图 http://knowyourmeme.com/memes/danbo

最佳答案

将 Google 趋势结果包含在 iframe 中,您就完成了。

<iframe scrolling="no" style="border:none;" width="640" height="330" src="http://www.google.com/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>

参见 Demo

关于javascript - 如何在html中嵌入谷歌趋势图?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27028132/

相关文章:

Javascript 函数在传递元素 ID 与对其进行硬编码时会改变行为

用于谷歌趋势的 python : "ValueError: year is out of range" when using interest_over_time

javascript - 带有扩展元素及其周围元素的网格布局

javascript - 点击时不加载 JQuery 切换功能,仅在第 3 次点击时加载

html - 垂直居中,父级高度可调

javascript - WordPress需要JQuery下推页面内容

html - 是否可以跨多个域使用 HTML5 的 pushState()?

python-3.x - Pytrends 趋势结果与手动下载的数据不相似

javascript - 无法在 Google 趋势页面上运行 Tampermonkey 脚本

javascript - 如何将图像添加到 form.serialize()?