roll imag

在Rmarkdown生成的html中以滚动的方式显示外源图片, 有以下两种方法

1.直接在文本中写入html语句

<div style="white-space: nowrap; overflow-x: auto; width: 100%;">
  <img src="../picture/bases.content.png" style="display: inline-block; height: 300px;" />
  <img src="../picture/bases.quality.png" style="display: inline-block; height: 300px;" />
  <img src="../picture/gc.distribution.png" style="display: inline-block; height: 300px;"/>
</div>

效果如下：

2.在代码块中定义函数

library(htmltools)
roll_imag <- function(pattern,path,text_tag,height = 300){
    imags_path <- list.files(
        path = path,pattern = pattern,
        full.names = TRUE
    )
    
    imags_tag <- lapply(imags_path,function(x){
            tags$img(
                src = x,
                style = paste0("display: inline-block; height: ",height,"px;")
            )   
        } 
    )
    
    html <- tags$div(
        tags$div(
            imags_tag,
            style = "white-space: nowrap; overflow-x: auto; width: 100%;"
        ),
        tags$div(
            tags$p(text_tag),
            style = paste("text-align: center; margin-top: 10px; font-size:", 
                                        "18px", ";")
        )
    )
    return(browsable(html))
}
roll_imag(pattern = ".png$",path = "../picture/",text_tag = "example text")

example text