support for click events to generate subgraphs with mermaid

[h-astephan]

Is it possible to make nodes in a diagram clickable with shinyjs? More specifically, I would like to be able to click on a node in a graph and yield a subgraph.

For the sake of simplicity, I have included a very basic example. The main diagram is denoted as "diagram2" and the subgraph as "subdiagram" in the server section. Ideally, I would like to click on the node A to result in the graph made up of the nodes (A, B, D). Furthermore, I hope that once node A is clicked, the output of the subgraph replaces the original graph displayed.

library(shiny)
library(DiagrammeR)


ui = shinyUI(fluidPage(
titlePanel("Mermaid on Shiny"),



fluidRow(
    column(12,
           DiagrammeROutput('diagram2', width = "50%")
           )
    )
    )
           )
server = function(input, output){

    output$diagram2 <- renderDiagrammeR({
        mermaid("graph LR;
A-->B;
A-->D;
B-->C;
C-->B;
")
    })
    
  output$subdiagram <- renderDiagrammeR({
        mermaid("graph LR;
A-->B;
A-->D;
")
    })
}

shinyApp(ui = ui, server = server)

There is support for click events in Mermaid; see this discussion for an interactive example. Is it possible to use these ideas in Shiny? Seems like it could be manageable with shinyjs coupled with an onclick function, but I'm struggling to get it to work. Thanks~

[Junwen Zhou]

Is it possible to make nodes in a diagram clickable with shinyjs? More specifically, I would like to be able to click on a node in a graph and yield a subgraph.

For the sake of simplicity, I have included a very basic example. The main diagram is denoted as "diagram2" and the subgraph as "subdiagram" in the server section. Ideally, I would like to click on the node A to result in the graph made up of the nodes (A, B, D). Furthermore, I hope that once node A is clicked, the output of the subgraph replaces the original graph displayed.

library(shiny)
library(DiagrammeR)


ui = shinyUI(fluidPage(
titlePanel("Mermaid on Shiny"),



fluidRow(
    column(12,
           DiagrammeROutput('diagram2', width = "50%")
           )
    )
    )
           )
server = function(input, output){

    output$diagram2 <- renderDiagrammeR({
        mermaid("graph LR;
A-->B;
A-->D;
B-->C;
C-->B;
")
    })
    
  output$subdiagram <- renderDiagrammeR({
        mermaid("graph LR;
A-->B;
A-->D;
")
    })
}

shinyApp(ui = ui, server = server)

There is support for click events in Mermaid; see this discussion for an interactive example. Is it possible to use these ideas in Shiny? Seems like it could be manageable with shinyjs coupled with an onclick function, but I'm struggling to get it to work. Thanks~

I am also interested in this. Have you found the solution?