Interaction between html widgets in R shiny

问题

I am developing an R shiny application that uses several html widgets, notably networkD3, d3heatmap and chorddiag.

These widgets work fine separately. However, using them in the same page leave a blank space where they are supposed to be.

Here is a reproducible code that shows the bug. Comment plots line in the UI and you will see plots appearing and disappearing..

I thank you very much for your help!

# libraries
library(shiny)
library(d3heatmap)
library(chorddiag)
library(networkD3)

# Server
server <- function(input, output) {

  # create heatmap
  output$heatmap <- renderD3heatmap({
    d3heatmap(mtcars, scale = "column", colors = "Spectral")
  })

  # create chord diagram
  output$chord <- renderChorddiag({
    m <- matrix(c(11975,  5871, 8916, 2868,1951, 10048, 2060, 6171, 8010, 16145, 8090, 8045,1013,   990,  940, 6907),
    byrow = TRUE, nrow = 4, ncol = 4)
    haircolors <- c("black", "blonde", "brown", "red")
    dimnames(m) <- list(have = haircolors, prefer = haircolors)
    groupColors <- c("#000000", "#FFDD89", "#957244", "#F26223")
    chorddiag(m, groupColors = groupColors, groupnamePadding = 20)
  })

  # create sankey
  output$sankey <- renderSankeyNetwork({
    nodes=data.frame(ID=c("A","B","C","D","E"))
    links=data.frame(source=c(1,2,3), target=c(3,4,4), value=c(12,15,29))
    sankeyNetwork(Links = links, Nodes = nodes, Source = "source", Target = "target", Value = "value", NodeID = "ID")
  })

}



# Ui
ui <- fluidPage(
  sidebarLayout(
    sidebarPanel("shiny shines"),
    mainPanel(
        # Comment these lines and you will see charts appear / disappear.
        d3heatmapOutput("heatmap"),
        chorddiagOutput("chord"),
        sankeyNetworkOutput("sankey")
    )
  )
)

shinyApp(ui = ui, server = server)

回答1:

networkD3 was updated to D3v4 in version 0.3 in. Feb. 2017, which is not compatible with v3 versions of D3, which is what chorddiag and d3heatmap appear to use. htmlwidgets, which is the underlying package that drives the above packages, only uses the most recent version of a dependency, so htmlwidgets that use conflicting versions of the same library can not both work. Check here for a starting point of discussion about this problem.

You have a few possible options, though none of them are great...

revert networkD3 to a version < 0.3 so that it also uses D3v3
lobby for the chorddiag developers and the d3heatmap developers to upgrade to D3v4
lobby for the htmlwidgets developers to come up with a robust way of dealing with conflicting JavaScript dependencies

回答2:

@CJYetman gave 3 options for dealing with this. Here's one more, which might be less work, though it's still unappealing: Rename the library used in chorddiag and d3heatmap from d3 to something else, so that both version 3 of D3 (used by those two) and version 4 (used by networkD3) can coexist on the same page.

A first pass at doing this for chorddiag is here: https://github.com/dmurdoch/chorddiag. It renames the library to d3_3. This same change also appears to work for d3heatmap; see https://github.com/dmurdoch/d3heatmap.

来源：https://stackoverflow.com/questions/46270473/interaction-between-html-widgets-in-r-shiny

标签

Shiny

htmlwidgets

networkd3

d3heatmap