[在具有相同节点的两个自环边缘时如何避免边缘重叠

Question

使用Vis.js库时出现此问题。

我正在尝试创建一个具有两个自环边的节点。问题是边缘重叠并且标签不可读。

我曾尝试更改某些物理参数，但运气不佳。

这是我想要实现的目标：

// create an array with nodes
var nodes = new vis.DataSet([
    {id: 1, label: 'Node 1'},

]);

// create an array with edges
var edges = new vis.DataSet([
    {from: 1, to: 1, label: "0"},
    {from: 1, to: 1, label: "1"}


]);

// create a network
var container = document.getElementById('mynetwork');

// provide the data in the vis format
var data = {
    nodes: nodes,
    edges: edges
};
var options = {physics:{enabled:true}};

// initialize your network!
var network = new vis.Network(container, data, options);

您可以从图像结果中看到，标签重叠：https://ibb.co/gmT8v8q

您对此问题有任何解决方案吗？

谢谢，

安德里亚

Answer 1

尝试使用Edges的selfReferences属性中的angle参数。它将在节点圆的不同角度创建多个自边缘。

    var data = {
nodes:
    [
        {id:1, label: "Entity 1", shape: 'circle'},

    ],
edges:
    [
        {"from":1,"to":1,"arrows":"to","label":"Prg", 
        selfReference:{
        size: 20,
        angle: Math.PI / 4,
        renderBehindTheNode: true
            } 
        },
        {"from":1,"to":1,"arrows":"to","label":"Boot", selfReference:{
        size: 20,
        angle: Math.PI / 1,
        renderBehindTheNode: true
            } },

    ]};