christophergandrud / networkD3

D3 JavaScript Network Graphs from R
http://christophergandrud.github.io/networkD3
649 stars 270 forks source link

Center network in rmarkdown slides #278

Closed neobernad closed 3 years ago

neobernad commented 3 years ago

Hi,

I'm using rmarkdown with revealjs to create HTML slides. When I run the following code:

testNet <- forceNetwork(Links = MisLinks, Nodes = MisNodes, Source = "source",
             Target = "target", Value = "value", NodeID = "name",
             Group = "group", opacity = 0.4, arrows = TRUE)
onRender(testNet , customJS)

The method customJS comes from this answer, which basically shows the label of the connected nodes when hovering the mouse on them (this does not affect my issue, just wanted to clarify what the code does).

The issue is that the graph shows on the left corner of the slide: before

But when I refresh with F5 the slide of the graph, then it is rendered properly: after

Is there anyway to force-refresh the network, force the starting (X,Y) node position or add some margins so that the graph shows up in the center?

Best, José Antonio

cjyetman commented 3 years ago

I definitely need a minimal reproducible example if you want me to look into this.

cjyetman commented 3 years ago

also, please do not include custom stuff that does not affect your issue in the minimal reproducible example

neobernad commented 3 years ago

Hello,

Thanks for your fast response. I kept doing some search about how to fix this issue, it seems to be an issue with revealjs and htmlwidget instead of with networkD3, sorry for opening up the issue on your side.

Solution: I fixed it by saving the widget with saveWidget method and then using an HTML <iframe> to embed the graph. Source: https://github.com/rstudio/revealjs/issues/11

Thanks anyway for your help!