将R创建的传单地图嵌入github

时间:2015-07-14 23:29:04

标签: r github embed leaflet

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

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

  1. 当我上传然后从github打开时,it gives raw HTML code, not the interactive map

  2. 我甚至不确定如何嵌入interactive map in ReadMe.md。当我将链接放到html并单击它时,我得到相同的原始地图。

  3. 帮助!

    更新

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

2 个答案:

答案 0 :(得分:2)

答案 1 :(得分:0)

以防万一有人还在寻找解决方案,我写了一篇说明如何做到这一点的文章,假设您使用Jekyll来构建托管在GitHub上的网站。

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

简而言之,您必须执行几个步骤:

在GitHub / Jekyll上

  1. 标识您需要包含的代码。我已经为您See on my GitHub

  2. 将其复制/粘贴到构建<head>的代码中。这将取决于您的Jekyll实现。完成此操作后,每次Jekyll构建网站时都会加载所需的库。

在Rstudio上

  1. 使用leaflet创建地图并将其编织到github_document。在最前面使用always_allow_html: yes进行编织很重要。

降价促销

  1. 检查每个leaflet映射是否在html文件中产生了.md代码。像这样:
<!--html_preserve-->

  <script type="application/json" data-for="htmlwidget-SOMEIDNUMBER">
    {"x":{"options": ...
<!--more funky code here-->
  1. 将此块粘贴到<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步中介绍的块。