如何在Quarto演示中用r-stack布局展示ggplotly交互式图表？

核心问题原因 #

直接嵌入R代码生成ggplotly图表时r-stack布局失效，是因为ggplotly输出的是HTML交互式部件，默认代码块的输出容器层级无法被r-stack正确识别，导致堆叠逻辑不生效。

可行实现方案 #

通过htmltools手动构建包含r-stack类的HTML容器，将静态ggplot图和交互式ggplotly图包裹在其中，确保Reveal.js能识别堆叠布局：

## 堆叠图表演示
```{r, echo=FALSE, results='asis'}
library(ggplot2)
library(plotly)
library(htmltools)

# 生成基础ggplot图表
p_ggplot <- ggplot(mtcars, aes(wt, mpg)) + 
  geom_point(color = "darkblue") +
  labs(title = "静态ggplot图表")

# 转换为ggplotly交互式图表
p_plotly <- ggplotly(p_ggplot) %>% 
  layout(title = list(text = "交互式ggplotly图表"))

# 构建r-stack布局容器
div(
  class = "r-stack",
  # 第一层：静态ggplot图
  as.tags(p_ggplot),
  # 第二层：交互式ggplotly图
  as.tags(p_plotly)
)

### 关键设置说明
- `results='asis'`：让R代码直接输出HTML内容，而非默认的代码块包裹格式
- `htmltools::div(class = "r-stack")`：手动创建Reveal.js认可的堆叠容器
- `as.tags()`：将ggplot对象和ggplotly对象转换为HTML标签，确保能嵌入到div容器中

### 使用效果
渲染幻灯片后，该页面默认显示静态ggplot图表，点击幻灯片区域或按键盘按键，会切换显示交互式ggplotly图表，实现`r-stack`的堆叠切换效果。

内容的提问来源于stack exchange，提问作者Quinten