datastorm-open / visNetwork

R package, using vis.js library for network visualization
Other
544 stars 126 forks source link

A single Zoom and Navigation Option for multiple graphs #437

Open swaheera opened 2 years ago

swaheera commented 2 years ago

I made the following 25 network graphs (all copies for simplicity):

library(tidyverse)
library(igraph)

set.seed(123)
n=15
data = data.frame(tibble(d = paste(1:n)))

relations = data.frame(tibble(
  from = sample(data$d),
  to = lead(from, default=from[1]),
))

data$name = c("new york", "chicago", "los angeles", "orlando", "houston", "seattle", "washington", "baltimore", "atlanta", "las vegas", "oakland", "phoenix", "kansas", "miami", "newark" )

graph = graph_from_data_frame(relations, directed=T, vertices = data) 

V(graph)$color <- ifelse(data$d == relations$from[1], "red", "orange")

plot(graph, layout=layout.circle, edge.arrow.size = 0.2, main = "my_graph")

library(visNetwork)

    a = visIgraph(graph)  

y = x = w = v = u = t = s = r = q  = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a

I would like to "tile" them as 5 x 5 : Since these are interactive html plots - I used the following command:

library(manipulateWidget)
library(htmltools)

ff = combineWidgets(y , x , w , v , u , t , s , r , q  , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)

htmltools::save_html(html = ff, file = "widgets.html")

I found out how to add a zoom option for each individual graph:

a = visIgraph(graph)  %>% 
    visInteraction(navigationButtons = TRUE)

y = x = w = v = u = t = s = r = q  = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a

ff = combineWidgets(y , x , w , v , u , t , s , r , q  , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)

htmltools::save_html(html = ff, file = "widgets.html")

image

But now the "zoom" options have "cluttered" all the graphs!

I was thinking it might be better to "stack" all these graphs on top of each other and save each graph as a "group type" - and then hide/unhide as we please:

visNetwork(data, relations) %>% 
 visOptions(selectedBy = "group")

Can someone please recommend a way of addressing this clutter problem?

In the end - perhaps something like this could work, where a single navigation/zoom option works for all graphs: image

Thank you!