• R语言已解决
  • 使用 DiagrammeR 包中的 mermaid 函数绘图时碰到一个错误

我想试着在用 mermaid 函数绘制流程图时引入 markdown,但是没鼓捣出来,然后发现其实可以引入 HTML 和 CSS 来实现,然鹅又碰到一个奇怪的错误。如下,我先定义了一个样式D,然后在定义节点时D[<D>改变字号</D>]这样来引入自定义样式,问题是随后 knit 生成的 html 文档里面,虽然也确实把图画出来了,可是居然顺道把mermaid(diagram = "")里面的代码也打印出来了。如果把自定义样式去掉,执行后就会正常只出图。本菜鸟暂时没搞明白问题出在哪?

```{css}
D {
color:red;
font-size:18px;
}
```

```{r}
library(DiagrammeR)
mermaid(
  diagram = "
  graph LR
  A[节点1] 
  B[第一行<br>第二行</br>第三行]
  C[<b>加粗</b> <i>斜体</i>]
  D[<D>改变字号</D>]
  A --> B
  B --> C
  B --> D
  style A fill:pink, stroke:black, stroke-width:4px
  style B fill:lightgreen, stroke:red, stroke-width:2px, stroke-dasharray: 5 5
  style C fill:lightblue
  style D 
  ", width = 600, height = 200)
```
> sessionInfo()
R version 4.2.0 (2022-04-22 ucrt)
Platform: x86_64-w64-mingw32/x64 (64-bit)
Running under: Windows 10 x64 (build 19044)

Matrix products: default

locale:
[1] LC_COLLATE=Chinese (Simplified)_China.utf8  LC_CTYPE=C                                  LC_MONETARY=Chinese (Simplified)_China.utf8
[4] LC_NUMERIC=C                                LC_TIME=Chinese (Simplified)_China.utf8    

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods   base     

other attached packages:
[1] DiagrammeR_1.0.10

loaded via a namespace (and not attached):
 [1] visNetwork_2.1.0   digest_0.6.28      R6_2.5.1           jsonlite_1.7.3     magrittr_2.0.1     evaluate_0.14      rlang_1.1.1       
 [8] cli_3.1.0          fontawesome_0.2.2  rstudioapi_0.13    jquerylib_0.1.4    bslib_0.3.0        DT_0.27            rmarkdown_2.13    
[15] RColorBrewer_1.1-2 tools_4.2.0        glue_1.6.2         htmlwidgets_1.5.4  crosstalk_1.2.0    rsconnect_0.8.29   xfun_0.36         
[22] yaml_2.2.1         fastmap_1.1.0      compiler_4.2.0     htmltools_0.5.2    knitr_1.35         sass_0.4.0   

删掉这一行就不会出现那些代码。

  style D 

原来 HTML 可以创建自定义标签,长见识了。

    CyrusYip

    嗯,这样做确实就正常了。不过我还是好奇这个问题出现和消失的原因,难道是只写style D而没有写具体样式的定义,是打开了某种开关却没有关上么

    我试着用 ggflowchart 重现楼主的结果,可是总是差点意思。

    library(ggflowchart)
    library(ggplot2)
    data = data.frame(
      from = c("A", "B", "B"),
      to = c("B", "C", "D")
    )
    
    node_data = data.frame(
      name = c("A", "B", "C", "D"),
      label = c(
        "节点1", 
        "第一行\n第二行\n第三行", 
        "改变字号",
        "加粗 斜体"
      ),
      type = c("A", "B", "C", "D")
    )
    
    ggflowchart(
      data = data, 
      node_data = node_data,
      fill = type,
      color = c(
        "#ffc0cb", 
        "#90ee90", 
        "#ececff",
        "#add8e6"
      ),
      text_size = c(4, 4, 3, 4),
      x_nudge = 0.1,
      y_nudge = 0.2,
      horizontal = TRUE
    ) +
    theme(legend.position = "none")

      chuxinyuan
      mermaid 函数支持在流程图节点内容上引入 HTML 标签和 CSS,这点有点绝。同样是 DiagrammeR 这个包,另一个函数 grViz 也可以用来画流程图,但是不支持引入 HTML 标签,也没法复现。

      另,mermaid、grViz 这两个 R 里面的函数,本质是把 mermaid.js 和 viz.js 挪到 R 里面用,节点边框的大小是根据图形宽度、高度还有文本内容自适应的。