vis.js 网络操作：将节点标签拆分到不同的行

Question

我正在使用 vis.4.18.1.
我有一个交互式图表，可以通过使用 addNode() 和 editNode().
在地图上单击来添加或编辑节点如何在多行上设置节点标签？
我正在使用弹出表单收集标签数据。
我知道这可以在使用换行符创建地图时导入初始图表数据时完成，但这不能以交互方式工作，节点标签如下所示：
'John Smith\nDate of birth'.
我也试过将节点字体设置为 multi 并使用 html br 但这也不起作用。

Answer 1

您是否尝试过以下方法：

node.username = "John Smith";
node.dateOfBirth = "Jun 18th 1978";
node.label = node.username + "\n" + node.dateOfBirth;

您可以通过非 visJS 固有的属性扩展您的节点对象 nodes/dataSet。也许这样你可以解决你的问题。

编辑： 我刚刚测试了这个示例，其中 node.label = node.title 在初始渲染上，并在选择节点时展开。

function expandNode(selectedNode){
  selectedNode.label = selectedNode.title + '\n' + 'a' + '\n' + 'b' + '\n' + selectedNode.problem;
  nodesObj.update(selectedNode); 
}

network.on('select', function(selection){
  let selectedNodes = nodesObj.get(selection.nodes); // nodesObj is a visjs dataSet
  if(selection.nodes.length === 1){
    expandNode(selectedNodes[0]);
  }
}

折叠和展开的节点

vis.js 网络操作：将节点标签拆分到不同的行

vis.js Network Manipulation: Split Node label onto different lines

vis.js

vis.js-network