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

Using street map and street view side by side in a xaringan slide

我从 Google 了解到 this example,它展示了我们如何并排放置街道地图和街景视图。但我不知道如何在 xaringan 幻灯片中创建这样的视图。

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

(Cross posted from RStudio Community)

我终于明白了!这是我们需要做的:

  1. 转到this link打开街景视图Side-By-Side示例
  2. 转到全部 选项卡并单击将代码示例复制到剪贴板 菜单
  3. 打开任何文本编辑器(例如记事本++),粘贴代码示例并使用 .html 扩展名
  4. 保存文件
  5. 转到 this link 并按照 获取 API 密钥 部分给出的说明获取 API 密钥
  6. 将代码示例第 7 行的文本 YOUR_API_KEY 替换为从 Google 通过步骤 4
  7. 获得的 API 密钥
src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initialize&libraries=&v=weekly"
  1. initialize() 函数的定义中,将 fenway 替换为所需的位置名称,并更改关联的 lat & lng
  2. 将以下代码添加到 xaringan 的源 Rmd 文件中,以创建以 side-by-side 方式显示卫星视图和街道视图的幻灯片
# Adjust width & height to suit your needs
htmltools::tags$iframe(
  src = "path/to/street-view-side-by-side.html", 
  width = 800, 
  height = 450
)