代码之家 › 专栏 › 技术社区 › Maël

将绘图与Quarto revealjs中的可用列布局相匹配

reveal.js quarto sf css

Maël · 技术社区 · 1 年前

我有一个代码和一张地图,我想在旁边绘制,所以我使用 output-location: column 。然而,与代码相比,地图显得非常小。有什么办法使它适合宽度和高度吗?

我尝试过减少利润: par(mar = c(0, 0, 0, 0)) ,但它不会改变任何事情。我也试过 out-width 和 out-height 使用整数(百分比不适用 revealjs ),但这会破坏纵横比。

有什么想法吗?

---
format: revealjs
---

## A title

```{r}
#| output-location: column
#| echo: true
library(spData)
library(sf)
library(ggplot2)

#par(mar = c(0, 0, 0, 0))
ggplot() +
  geom_sf(data = nz) + 
  theme_minimal()
```

注意:这似乎是的常见问题 sf 物体: Eliminate Outer Margin (Ggplot2 / geom_sf) .

0 回复 | 直到 1 年前

Shafee ikashnitsky 1 年前

选项01

一种选择是保存地图,然后使用 knitr::plot_crop 以获取将裁剪掉多余空白的地图图像,然后使用渲染图像 magick::read_image .

我还使用了一点CSS来稍微调整地图高度,并获得良好的输出。

---
title: "Fit plot to space column layout"
format: revealjs
---

## A title

```{r}
#| output-location: column
#| echo: true
#| classes: map
library(spData)
library(sf)
library(ggplot2)
library(magick)

map <- ggplot() +
  geom_sf(data = nz) + 
  coord_sf(expand = F) +
  theme_minimal()

ggsave("map.png")
. <- knitr::plot_crop("map.png")
print(
  image_read("map.png"), 
  info = FALSE
)
```

```{css, echo=FALSE}
.reveal .map img {
  height: 80vh;
  padding-left: 2em;
}
```

选项02

你可以用编织钩 knitr::hook_pdfcrop 一次性完成选项01的所有步骤。

首先通过将其设置为启用 knit_hooks$set() 然后使用 crop: true 在代码块中。

---
title: "Fit plot to space column layout"
format: revealjs
---

## A title

```{r setup, include=FALSE}
knitr::knit_hooks$set(crop = knitr::hook_pdfcrop)
```


```{r}
#| output-location: column
#| echo: true
#| crop: true
#| classes: map
library(spData)
library(sf)
library(ggplot2)


ggplot() +
  geom_sf(data = nz) + 
  coord_sf(expand = F) +
  theme_minimal()

```


```{css, echo=FALSE}
.reveal .map img {
  height: 80vh;
  width: auto !important;
  padding-left: 2em;
}
```

Quinten 1 年前

也许你可以用 fig-asp 选项如下:

---
format: 
 revealjs
---

## A title

```{r}
#| output-location: column
#| echo: true
#| fig-asp: 1
library(spData)
library(sf)
library(ggplot2)

#par(mar = c(0, 0, 0, 0))
ggplot() +
  geom_sf(data = nz) + 
  theme_minimal()
```

输出

Julian 1 年前

你可以使用 max-width ,但我希望有更好的方法:

---
format: revealjs
---

<style>
.reveal img {
  max-width: 150%;
  overflow-x: hidden;
}
</style>

## A title

```{r}
#| output-location: column
#| echo: true

library(spData)
library(sf)
library(ggplot2)

ggplot() +
  geom_sf(data = nz) + 
  theme_minimal()
```