Xaringan png 与 svg 图像质量

Question

我发现 Xaringan (xaringan::moon_reader()) html 幻灯片中的 PNG/JPEG 图像与 SVG 相比在视觉上柔和且模糊。请参阅下面的示例屏幕截图。

相比之下，这三种格式在标准 html 报告 (rmarkdown::html_document()) 中在视觉上具有可比性。请参阅下面的屏幕截图。

显而易见的解决方案是使用 SVG。但是，对于复杂图形，SVG 的大小呈爆炸式增长。因此，在模板中用作默认值有点冒险。

例如，下图为 7MB 的 SVG，而相应的 PNG 为 50kB。拥有许多这样的 SVG 图形可能会导致最终文档的大小达到数百 MB。

使用在线工具 (https://vecta.io/nano)，我能够将 7MB 的 SVG 缩小到 1.6MB（缩小 >75%）。尺寸差异巨大，质量没有明显的视觉变化。与 PNG 尺寸相去甚远。

所以，我的一些问题是：

为什么 xaringan 中的 PNG 质量不好？可以做些什么来改善它？
R 中是否有 tools/devices 可以减小 SVG 大小？（simplify/flatten 路径？）

其他thoughts/suggestions?

## DON'T CLICK "RUN CODE SNIPPET" AS IT RUNS AS JAVASCRIPT
## THIS IS ONLY TO COLLAPSE CODE

---
title: "Image quality"
output:
  xaringan::moon_reader
---

## dev="svg",fig.height=5,fig.width=5

```{r,dev="svg",fig.height=4.8,fig.width=4.8}
plot(1:5,1:5)
```

---

## dev="png",fig.height=6,fig.width=6

```{r,dev="png",fig.height=6,fig.width=6}
plot(1:5,1:5)
```

---

## dev="jpeg",fig.height=6,fig.width=6

```{r,dev="jpeg",fig.height=6,fig.width=6}
plot(1:5,1:5)
```

# R version 4.1.0 (2021-05-18)
# Platform: x86_64-conda-linux-gnu (64-bit)
# Running under: Ubuntu 20.04.3 LTS
# 
# rmarkdown_2.10
# xaringan_0.22

Answer 1

如果我在浏览器中检查图像（右键单击其中一个并选择“检查”），我会看到 PNG 和 JPEG 被绘制为 432x432 像素图像，即对于请求的 6 英寸图像，假设为 72 dpi。我目前的显示器是 96 dpi 视网膜，所以看起来有点模糊。

我可以添加块选项fig.retina = 2，它看起来更清晰。这将以 144 dpi 的分辨率绘制，然后将其缩小到要求的大小。可能一些更大的数字看起来更好，但它确实增加了输出的大小。

Xaringan png 与 svg 图像质量

Xaringan png vs svg image quality

r

r-markdown

xaringan