r - rmarkdown 中的传单热图

Question

问题

你能在 rmarkdown 文档中绘制 leaflet 热图吗？

示例工作代码

当运行直接从 R

时，此代码将生成带有热图的传单图

library(rCharts)

## data
dat <- data.frame(Longitude = c(-122.3809, -122.3269, -122.3342, -122.2984, -122.3044, -122.2754),
              Latitude = c(47.66796,47.63436,47.57665,47.71930,47.60616,47.55392),
              intensity = c(10,20,30,40,50,300))

## create JSON for heatmap
## - could also use jsonlite::toJSON
j <- paste0("[",dat[,"Latitude"], ",", dat[,"Longitude"], ",", dat[,"intensity"], "]", collapse=",")
j <- paste0("[",j,"]")

## create leaflet map
leaf_map <- Leaflet$new()
leaf_map$setView(c(47.5982623,-122.3415519), zoom=10)
leaf_map$tileLayer(provider="Acetate.terrain")

## add heatmap plugin
leaf_map$addAssets(jshead = c("http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js"))

## heatmap layer
leaf_map$setTemplate(afterScript = sprintf("
    <script> 
    var addressPoints = %s
    var heat = L.heatLayer(addressPoints).addTo(map)           
    </script>
    ", j
))

## output map
leaf_map

输出：

我有一个 example of this working in shiny too 使用 tags$ 和 HTML()。

rmarkdown 块

使用 Ramnath's example of embedding rCharts in R Markdown 我可以接近在降价文档中创建它，但是当这个运行s 它显示地图，但不显示热量。

```{r heatMapMarkdown, results='asis', comment=NA, cache=F}

## References
# - http://bl.ocks.org/ramnathv/raw/8084330/ - embedding rCharts in R Markdown

library(rCharts)

dat <- data.frame(Longitude = c(-122.3809, -122.3269, -122.3342, -122.2984, -122.3044, -122.2754),
              Latitude = c(47.66796,47.63436,47.57665,47.71930,47.60616,47.55392),
              intensity = c(10,20,30,40,50,300))


## create JSON for heatmap
## - could also use jsonlite::toJSON
j <- paste0("[",dat[,"Latitude"], ",", dat[,"Longitude"], ",", dat[,"intensity"], "]", collapse=",")
j <- paste0("[",j,"]")

leaf_map <- Leaflet$new()
leaf_map$setView(c(47.5982623,-122.3415519), zoom=10)
leaf_map$tileLayer(provider="Acetate.terrain")

## Add circle:
# leaf_map$marker(c(47.5982623, -122.3415519))

leaf_map$addAssets(jshead = c("http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js"))

leaf_map$setTemplate(afterScript = sprintf("
    <script> 
    var addressPoints = %s
    var heat = L.heatLayer(addressPoints).addTo(map)           
    </script>
    ", j
))

## shows the map, but not the heat...
leaf_map$print('iframesrc', include_assets=TRUE, cdn=TRUE)

```

是否可以让 'heat' 也显示在地图上？

Answer 1

由于问题 How to add an interactive visualisation to R Markdown

的答案，我明白了这一点

首先，我为 <head> 部分创建了一个 html 文档，以将 src 包含到热图插件中，并将其保存在与 [=49= 相同的目录中].Rmd 名称为 include_js_heatmap.html

的文件

<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
<style>
    #map { width: 800px; height: 600px; }
    body { font: 16px/1.4 "Helvetica Neue", Arial, sans-serif; }
    .ghbtns { position: relative; top: 4px; margin-left: 5px; }
    a { color: #0077ff; }
</style> 

<script src = "http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js"></script>

然后我可以include这个在.Rmd的header，然后写html生成热图直接到body文档。

为了使热交互，我可以在代码块中构建热点 JSON，然后使用 r ... 符号将其包含在文档的 body 中

---
title: heatmapRMarkdown
output:
  html_document:
    self_contained: false
    keep_md: true
    includes:
      in_header: "include_js_heatmap.html"
---

```{r}
dat <- data.frame(Longitude = c(-122.3809, -122.3269, -122.3342, -122.2984, -122.3044, -122.2754),
                  Latitude = c(47.66796,47.63436,47.57665,47.71930,47.60616,47.55392),
                  intensity = c(100,20,30,400,50,3))

j <- paste0("[",dat[,"Latitude"], ",", dat[,"Longitude"], ",", dat[,"intensity"], "]", collapse=",")
j <- paste0("[",j,"]")

```

<div id="map"></div>

<script src="http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js"></script>

<script>
var map = L.map('map').setView([47.5982623,-122.3415519], 12);

var tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
}).addTo(map);

addressPoints = `r j` ;

var heat = L.heatLayer(addressPoints).addTo(map);
</script>

更新

<div ...> 方法将在 .Rmd 文件旁边创建一个目录，其中包含各种 .html、.js、.css 文件。创建后，标准 rCharts 代码将不再需要 <div...> html 代码：

## create leaflet map
leaf_map <- Leaflet$new()
leaf_map$setView(c(47.5982623,-122.3415519), zoom=10)
leaf_map$tileLayer(provider="Acetate.terrain")

## add heatmap plugin
leaf_map$addAssets(jshead = c("http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js"))

## heatmap layer
leaf_map$setTemplate(afterScript = sprintf("
    <script> 
    var addressPoints = %s
    var heat = L.heatLayer(addressPoints).addTo(map)           
    </script>
    ", j
))

## output map
leaf_map

更新 2

一个避免include的细微变化是直接在.Rmd文档中使用所有相关的html：

```{r baseMap, results='asis', echo=FALSE, comment=NA, cache=FALSE}
library(rCharts)
dat <- data.frame(Longitude = c(-122.3809, -122.3269, -122.3342, -122.2984, -122.3044, -122.2754),
                  Latitude = c(47.66796,47.63436,47.57665,47.71930,47.60616,47.55392),
                  intensity = c(100,20,30,400,50,3))

j <- paste0("[",dat[,"Latitude"], ",", dat[,"Longitude"], ",", dat[,"intensity"], "]", collapse=",")
j <- paste0("[",j,"]")

```

<!-- add heatmap html-->
<div id="heatmap"></div>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
<style>
  #heatmap { width: 800px; height: 600px; }
  body { font: 16px/1.4 "Helvetica Neue", Arial, sans-serif; }
  .ghbtns { position: relative; top: 4px; margin-left: 5px; }
  a { color: #0077ff; }
</style> 
<script src="http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js"></script>

<script>
  var heatmap = L.map('heatmap').setView([47.5982623,-122.3415519], 12);
  var tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
    }).addTo(heatmap);
  addressPoints = `r j` ;
  var heat = L.heatLayer(addressPoints).addTo(heatmap);
</script>

r - rmarkdown 中的传单热图

r - leaflet heatmap in rmarkdown

r

r-markdown