datastorm-open / visNetwork

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

Specifying Order of Points in visNetwork #454

Open swaheera opened 1 year ago

swaheera commented 1 year ago

I am working with the R programming language.

I have the following dataset:

library(igraph)
library(visNetwork)library(igraph)
library(visNetwork)

nodes_df = structure(list(id = c("Boss", "TeamA", "TeamB", "SubteamA1", 
"SubteamA2", "SubteamA3", "SubteamB1", "SubteamB2", "SubteamB3", 
"employee1", "employee2", "employee3", "employee4", "employee5", 
"employee6", "employee7", "employee8", "employee9", "employee10", 
"employee11", "employee12", "employee13", "employee14", "employee15", 
"employee16", "employee17", "employee18"), label = c("Boss", 
"TeamA", "TeamB", "SubteamA1", "SubteamA2", "SubteamA3", "SubteamB1", 
"SubteamB2", "SubteamB3", "employee1", "employee2", "employee3", 
"employee4", "employee5", "employee6", "employee7", "employee8", 
"employee9", "employee10", "employee11", "employee12", "employee13", 
"employee14", "employee15", "employee16", "employee17", "employee18"
), group = c("yellow", "red", "red", "green", "green", "green", 
"green", "green", "green", "purple", "purple", "purple", "purple", 
"purple", "purple", "purple", "purple", "purple", "purple", "purple", 
"purple", "purple", "purple", "purple", "purple", "purple", "purple"
)), row.names = c(NA, -27L), class = "data.frame")

edges_df = structure(list(from = c("Boss", "TeamA", "TeamA", "TeamA", "SubteamA1", 
"SubteamA1", "SubteamA1", "SubteamA2", "SubteamA2", "SubteamA2", 
"SubteamA3", "SubteamA3", "SubteamA3", "Boss", "TeamB", "TeamB", 
"TeamB", "SubteamB1", "SubteamB1", "SubteamB1", "SubteamB2", 
"SubteamB2", "SubteamB2", "SubteamB3", "SubteamB3", "SubteamB3"
), to = c("TeamA", "SubteamA1", "SubteamA2", "SubteamA3", "employee1", 
"employee2", "employee3", "employee4", "employee5", "employee6", 
"employee7", "employee8", "employee9", "TeamB", "SubteamB1", 
"SubteamB2", "SubteamB3", "employee10", "employee11", "employee12", 
"employee13", "employee14", "employee15", "employee16", "employee17", 
"employee18")), row.names = c(NA, -26L), class = "data.frame")

#I made the following graph network from this data:

 # Create the visNetwork object
    visNetwork(nodes_df, edges_df) %>%   visHierarchicalLayout(direction = "UD") %>%
        visOptions(highlightNearest = TRUE, nodesIdSelection = TRUE) %>%
        visInteraction(navigation = "zoom") %>%
        visInteraction(navigation = "drag")

nodes_df = structure(list(id = c("Boss", "TeamA", "TeamB", "SubteamA1", 
"SubteamA2", "SubteamA3", "SubteamB1", "SubteamB2", "SubteamB3", 
"employee1", "employee2", "employee3", "employee4", "employee5", 
"employee6", "employee7", "employee8", "employee9", "employee10", 
"employee11", "employee12", "employee13", "employee14", "employee15", 
"employee16", "employee17", "employee18"), label = c("Boss", 
"TeamA", "TeamB", "SubteamA1", "SubteamA2", "SubteamA3", "SubteamB1", 
"SubteamB2", "SubteamB3", "employee1", "employee2", "employee3", 
"employee4", "employee5", "employee6", "employee7", "employee8", 
"employee9", "employee10", "employee11", "employee12", "employee13", 
"employee14", "employee15", "employee16", "employee17", "employee18"
), group = c("yellow", "red", "red", "green", "green", "green", 
"green", "green", "green", "purple", "purple", "purple", "purple", 
"purple", "purple", "purple", "purple", "purple", "purple", "purple", 
"purple", "purple", "purple", "purple", "purple", "purple", "purple"
)), row.names = c(NA, -27L), class = "data.frame")

edges_df = structure(list(from = c("Boss", "TeamA", "TeamA", "TeamA", "SubteamA1", 
"SubteamA1", "SubteamA1", "SubteamA2", "SubteamA2", "SubteamA2", 
"SubteamA3", "SubteamA3", "SubteamA3", "Boss", "TeamB", "TeamB", 
"TeamB", "SubteamB1", "SubteamB1", "SubteamB1", "SubteamB2", 
"SubteamB2", "SubteamB2", "SubteamB3", "SubteamB3", "SubteamB3"
), to = c("TeamA", "SubteamA1", "SubteamA2", "SubteamA3", "employee1", 
"employee2", "employee3", "employee4", "employee5", "employee6", 
"employee7", "employee8", "employee9", "TeamB", "SubteamB1", 
"SubteamB2", "SubteamB3", "employee10", "employee11", "employee12", 
"employee13", "employee14", "employee15", "employee16", "employee17", 
"employee18")), row.names = c(NA, -26L), class = "data.frame")
I made the following graph network from this data:

 # Create the visNetwork object
    visNetwork(nodes_df, edges_df) %>%   visHierarchicalLayout(direction = "UD") %>%
        visOptions(highlightNearest = TRUE, nodesIdSelection = TRUE) %>%
        visInteraction(navigation = "zoom") %>%
        visInteraction(navigation = "drag")

My Question: Is there anything I can do to have this graph network better reflect the "hierarchies" in my data? For example - I would like "boss" to appear at the top, "teams" to appear after, "subteams" to be after and "employees" to be after.

I tried to do this with thevisHierarchicalLayout(direction = "UD") option and I can't seem to get this hierarchical order to be reflected in the visualization. Does anyone know what I might be able to do to fix this?

Thanks!