在本地 HTML 文件中嵌入 Google 趋势图时遇到问题
Posted
技术标签:
【中文标题】在本地 HTML 文件中嵌入 Google 趋势图时遇到问题【英文标题】：Trouble Embedding Google Trends Chart in Local HTML File 【发布时间】：2021-06-17 03:11:54 【问题描述】：我正在尝试创建一个本地仪表板，其中包含各种主题的嵌入式谷歌趋势图表。当我创建一个标准的 html 文件并粘贴来自 Google 趋势的代码 sn-p 时，图表变为全宽，但在大约 300 像素处被截断：Original Code Output
我环顾四周并尝试了一个 iframe 解决方案（正如人们在此处的其他帖子中所建议的那样），但我在实施它时遇到了麻烦。我对使用 iframe 和高级元素/标签非常陌生。
这是我根据我在这里看到的其他示例自定义的代码的链接：https://drive.google.com/file/d/1w6Dnyk0h4ktJ7KaRz-yrpqVhlHmhWVp-/view?usp=sharing
当我在浏览器中本地打开文件时，呈现的代码如下所示： Unexpected Results from Code
这可能是一个愚蠢的问题，但即便如此，我还是很想得到一些帮助！谢谢！
【问题讨论】：
【参考方案1】：请在下面找到代码 sn-p，我试图解决您在第一段中遇到的问题，希望此解决方案对您有用
<!DOCTYPE html>
<html>
<head>
<style>
.myDiv
border: 1px outset lightblue;
background-color: lightgray;
text-align: left;
</style>
</head>
<body>
<h1>Data Tracking</h1>
<h2>COVID-19 Data</h2>
<script type="text/javascript" src="https://ssl.gstatic.com/trends_nrtr/2431_RC04/embed_loader.js"></script>
<script type="text/javascript"> trends.embed.renderExploreWidget("TIMESERIES", "comparisonItem":["keyword":"/m/03376x","geo":"GB","time":"today 5-y"],"category":0,"property":"", "exploreQuery":"date=today%205-y&geo=GB&q=%2Fm%2F03376x","guestPath":"https://trends.google.com:443/trends/embed/");
</script>
<script type="text/javascript">
document.getElementsByTagName("iframe")[0].addEventListener( "load", function(e)
this.setAttribute('height','450px')
);
</script>
</body>
</html>
【讨论】：
以上是关于在本地 HTML 文件中嵌入 Google 趋势图时遇到问题的主要内容，如果未能解决你的问题，请参考以下文章
如何在 DiscordJS 嵌入消息中使用本地文件作为缩略图？
如何在 Discord JDA 嵌入式消息中使用本地文件作为缩略图？
我可以将 Google 图片搜索嵌入到我的 html5 网页中吗
R语言可视化虚线线图并在线图上方嵌入标签文本使用geomtextpath包的geom_textline函数沿着虚线线图的趋势在指定位置添加文本标签
R语言可视化虚线线图并在线图上方嵌入标签文本使用geomtextpath包的geom_textline函数沿着虚线线图的趋势在指定位置添加文本标签