心智图状布局（网络可视化使用vis.js JavaScript库）

Question

是否有可能调整visNetwork的选项（例如visLayout，visOptions或visPhysics），以获得一个网络的可视化，类似于一个心智图？

我想获得这样的事：

而这里使用visNetwork得出相同的数据在R我重复的例子：

nodes <- structure(list(id = 1:22, label = structure(c(14L, 20L, 19L, 
                 16L, 12L, 18L, 2L, 17L, 22L, 8L, 13L, 3L, 4L, 5L, 6L, 7L, 21L, 
                 15L, 9L, 1L, 10L, 11L), .Label = c("A seemengly impossible mission\n", 
                         "Another \n", "Detail 1\n", "Detail 2\n", "Detail 3\n", "Detail 4\n", 
                         "Detail 5\n", "Do you know where is Dover?\n", "Dover Castle\n", 
                         "Finally, I'm the fifth\n", "I'm alone", "I'm relatively short\n", 
                         "Let's say there is a third one\n", "Main topic\n", "Operation Dynamo\n", 
                         "or, I'm even longer and perhaps I need some more space\n", "Running out of imagination\n", 
                         "Shorter\n", "Some longer text goes here\n", "Thing 1\n", "Thing number 4\n", 
                         "What can happen?\n"), class = "factor"), shape = structure(c(1L, 
                                        1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 
                                        1L, 1L, 1L, 1L, 1L), class = "factor", .Label = "box")), .Names = c("id", 
                                                        "label", "shape"), row.names = c(NA, -22L), class = "data.frame") 

edges <- structure(list(from = c(1L, 2L, 2L, 2L, 2L, 1L, 7L, 7L, 7L, 1L, 
           11L, 11L, 11L, 11L, 11L, 1L, 17L, 17L, 17L, 1L, 21L), to = 2:22, 
         arrows = structure(c(1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 
              1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L), .Label = "to", class = "factor")), .Names = c("from", 
                                      "to", "arrows"), row.names = c(NA, 21L), class = "data.frame") 
library(visNetwork) 
visNetwork(nodes, edges) %>% 
    visOptions(highlightNearest = TRUE, nodesIdSelection = TRUE) %>% 
    visLayout(randomSeed = 1) 

这段代码产生这样的可视化：

所以你可以看到第一个数字更清晰，更易于阅读和使用。是否可以调整visNetwork参数（vis.js参数）以使结果与此处的第一个数字相似？

基本上它是像具有中央主主题，然后围绕主主题径向布置下一级的主题，并且在彼此（种类列表）放样了进一步的水平。

Answer 1

你可以做到这一点通过坐标节点data.frame，然后禁用物理。

你可以把你想要的节点，并用闪亮的应用程序找回坐标，然后使用这个网络中，像这样的例子：

mynetwork <- visNetwork(nodes, edges) %>% 
    visOptions(highlightNearest = TRUE, nodesIdSelection = TRUE) %>% 
    visLayout(randomSeed = 1) %>% 
    visPhysics(enabled = FALSE) # disable physics to move nodes 

require(shiny) 
server <- function(input, output) { 
    output$network <- renderVisNetwork({ 
    mynetwork 
    }) 

    vals <- reactiveValues(coords=NULL) 

    output$view <- renderPrint({ 
    write.table(vals$coords, file = "save_coordinates.csv", sep = ";") 
    vals$coords 
    }) 

    observe({ 
    input$getcoord 
    visNetworkProxy("network") %>% visGetPositions() 
    vals$coords <- if (!is.null(input$network_positions)) 
     do.call(rbind, input$network_positions) 
    }) 
} 

ui <- fluidPage(
    visNetworkOutput("network", height = "800px"), 
    actionButton("getcoord", "View & Save Coordinates"), 
    verbatimTextOutput("view") 
) 

shinyApp(ui = ui, server = server) 


# and after, put coordinnates into nodes data.frame and use visNodes(fixed = TRUE) 
# if you want 

coord <- read.csv("save_coordinates.csv", sep = ";") 
nodes <- cbind(nodes, coord) 

visNetwork(nodes, edges) %>% 
    visNodes(fixed = T) %>% 
    visOptions(highlightNearest = TRUE, nodesIdSelection = TRUE) %>% 
    visLayout(randomSeed = 1) %>% 
    visPhysics(enabled = FALSE) 

您还可以level和visHierarchicalLayout玩：

nodes <- data.frame(id = 1:9, level = c(1,1,2,3,3, 4, 4, 4, 4)) 
edges <- data.frame(from = c(3, 3, 3, 3, 4, 4, 5, 5), 
        to = c(1, 2, 4, 5, 6, 7, 8, 9)) 


visNetwork(nodes, edges) %>% 
    visHierarchicalLayout(direction = "LR")