在 xaringan 幻灯片中并排使用街道地图和街景

Question

我遇到了来自 Google 的this example，它展示了我们如何以并排的方式放置街道地图和街景。但我不知道如何在xaringan 幻灯片中创建这样的视图。

我尝试复制“全部”选项卡下的代码，将内容保存为 html 文件，然后将该文件导入到 xaringan 幻灯片中。但这种方法似乎不起作用。有人能指出我正确的方向吗？

(Cross posted from RStudio Community)

Answer 1

我终于明白了！这是我们需要做的：

1. 转到 this link 打开 Street View Side-By-Side 示例
2. 转到全部标签并点击复制代码示例到剪贴板菜单
3. 打开任何文本编辑器（例如，notepad++），粘贴代码示例并使用.html 扩展名保存文件
4. 转到this link 并按照获取 API 密钥部分中的说明获取 API 密钥
5. 将代码示例第 7 行的 YOUR_API_KEY 文本替换为通过第 4 步从 Google 获得的 API 密钥

src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initialize&libraries=&v=weekly"

6. 在initialize()函数的定义中，将fenway替换为所需的位置名称，并更改关联的lat & lng
7. 将以下代码添加到xaringan 的源Rmd 文件中，以创建并排显示卫星视图和街景的幻灯片

# Adjust width & height to suit your needs
htmltools::tags$iframe(
  src = "path/to/street-view-side-by-side.html", 
  width = 800, 
  height = 450
)