【问题标题】：Embed leaflet map created by R into github将 R 创建的传单地图嵌入到 github
【发布时间】：2015-07-14 23:29:04
【问题描述】：

我正在努力将创建 R 的传单地图嵌入到 my github account

导出为单个 HTML 文件的文件，我可以在我的计算机上查看它

当我上传然后从github打开时，it gives raw HTML code, not the interactive map
我什至不知道如何嵌入这个interactive map in ReadMe.md。当我放置指向 html 的链接并单击它时，我会得到相同的原始地图。

救命！

更新

我创建了后续问题，If HTML doesn't work well in github, how can some people make it work

【问题讨论】：

标签： r github embed leaflet

【解决方案1】：

你可以在前面加上http://htmlpreview.github.io/?到您放置 html 文件的 url。在你的情况下：

http://htmlpreview.github.io/?https://github.com/Sonihal/yorbalinda_interactive_map/blob/master/web_Yorba_Linda.html

【讨论】：

这很有帮助，但是如何嵌入整个html，这样就不用点击链接了？
我认为这在 GitHub 中目前是不可能的，你可以尝试 pages.github.com 设置，但它又不像从 repo 浏览那么容易。
当我尝试创建sonihal.github.io/yorbalinda_interactive_map，并复制并粘贴源时，它没有出现。请指教。
仅供参考，我创建了后续问题，stackoverflow.com/questions/31433352/…

【解决方案2】：

以防万一有人仍在寻找解决方案，我写了一篇解释如何做到这一点的帖子，假设您使用 Jekyll 构建托管在 GitHub 上的网站。

https://dieghernan.github.io/201905_Leaflet_R_Jekyll/

简而言之，你必须执行几个步骤：

在 GitHub/Jekyll 上

确定您需要包含的代码。我已经为你做了See on my GitHub
将其复制/粘贴到构建您的<head> 的代码中。这将取决于您的 Jekyll 实现。之后，每次 Jekyll 构建网站时都会加载所需的库。

在 Rstudio 上

使用leaflet 创建一个地图并将其编织到github_document。重要的是在前面使用always_allow_html: yes 编织它。

降价

检查每个leafletmap 是否在.md文件中生成了html 代码。像这样：

<!--html_preserve-->

  <script type="application/json" data-for="htmlwidget-SOMEIDNUMBER">
    {"x":{"options": ...
<!--more funky code here-->

将此块粘贴到<script> 部分之前：

<div id="htmlwidget-SOMEIDNUMBER" style="width:100%;height:216px;" class="leaflet html-widget"></div>

所以对于每个leaflet 地图，您都会得到类似的东西：

<!--html_preserve-->
 <div id="htmlwidget-SOMEIDNUMBER" style="width:100%;height:216px;" class="leaflet html- widget"></div>

  <script type="application/json" data-for="htmlwidget-SOMEIDNUMBER">
    {"x":{"options": ...
<!--more funky code here-->

现在在 GitHub 上发布它。现在，当 Jekyll 在 GitHub 上构建您的博客/网站时，库已加载，并且传单地图正确显示。请注意，在本地或降价时，地图仍然不可见。

一旦你完成了几次，你就会看到基本上是复制/粘贴/修改我在第 5 步中提出的块。

【讨论】：