visNetwork + R:仅在select上显示节点标签

时间:2017-08-17 16:28:15

标签: javascript r visnetwork

尝试仅在已选择的节点上显示节点标签。

我发现a similar question只想在悬停时显示边缘标签。解决方案是:

nodes <- data.frame(id = 1:3, label = 1:3)
edges <- data.frame(from = c(1,2), to = c(1,3), label = "Edge label", font.size = 0)
visNetwork(nodes, edges) %>%
  visInteraction(hover = T) %>%
  visEvents(hoverEdge = "function(e){
    this.body.data.edges.update({id: e.edge, font: {size : 14}});
  }") %>%
  visEvents(blurEdge = "function(e){
    this.body.data.edges.update({id: e.edge, font: {size : 0}});
  }")

我已尝试修改此功能,但我认为我没有正确执行javascript部分,我几乎不了解JS。

nodes <- data.frame(id = 1:3, label = 1:3)
edges <- data.frame(from = c(1,2), to = c(1,3), label = "Edge label", font.size = 0)
visNetwork(nodes, edges) %>%
  visInteraction(hover = T) %>%
  visEvents(selectNode= "function(e){
    this.body.data.nodes.update({id: e.node, font: {size : 14}});
  }") %>%
  visEvents(deselectNode= "function(e){
    this.body.data.nodes.update({id: e.node, font: {size : 0}});
  }")

这会导致每次选择或取消选择节点时都会创建一个新节点。虽然坐着点击它们是一种让我的Rsession崩溃的有趣方式,但遗憾的是它并没有解决我的问题。

我确定这是一个简单的修复程序,但我已经通过了visNetwork文档,而我却找不到我需要的内容。帮助赞赏!

1 个答案:

答案 0 :(得分:1)

这应该可以解决问题。这个JS实际上是根据数据框中的两个标签创建一个变量。我确定这是一种更为技术性的方法,但它仍然可以正常工作。

library(visNetwork)


nodes <- data.frame(id = 1:3, label = paste0(""), label_long = c('Label 1','Label 2','Label 3'))
edges <- data.frame(from = c(1,2), to = c(1,3), label = "Edge label", font.size = 0)

net <- visNetwork(nodes, edges) %>%
  visInteraction(hover = T) %>%
  visEvents(selectNode  = "function(e){
            var label_info = this.body.data.nodes.get({
            fields: ['label', 'label_long'],
            filter: function (item) {
            return item.id === e.node
            },
            returnType :'Array'
            });
            this.body.data.nodes.update({id: e.node, label : label_info[0].label_long, label_long : label_info[0].label});
            }") %>% 
  visEvents(blurNode  = "function(e){
            var label_info = this.body.data.nodes.get({
            fields: ['label', 'label_long'],
            filter: function (item) {
            return item.id === e.node
            },
            returnType :'Array'
            });
            this.body.data.nodes.update({id: e.node, label : label_info[0].label_long, label_long : label_info[0].label});
  }")

print(net)