Я использую Sigmajs для визуализации ориентированного графа. Я пытаюсь показать изогнутые края, задав sigInst.settings.defaultEdgeType: "curvedArrow" и даже установив type на каждом ребре как curvedArrow.
Некоторые люди получили его с помощью рендера Canvas, ну, я уже использую его, но на рисунке показана прямая линия между узлами, и ожидаемый curvedArrow отображается только при наведении курсора.
Я подумал, что, возможно, его цвет по умолчанию задан как цвет фона холста и не распознается, поэтому я изменил цвет фона, и он не отображается (опять же, пока не завис над)
Вы можете попробовать мой код на этом коде
вот мой код:
const settings = {
minArrowSize: 20,
defaultEdgeType: "curvedArrow",
arrowSizeRatio: 10,
defaultEdgeLabelColor: "#FFFFFF",
defaultEdgeHoverColor: "yellow",
edgeHoverColor: 'default',
defaultEdgeColor: "red",
defaultNodeColor: "#007FFF",
defaultLabelColor: "#FFFFFF",
edgeColor:'default',
enableEdgeHovering: true,
enableHovering: false,
drawEdges: true,
}
const s = new sigma({
settings,
renderer: {
container: document.getElementById('canvas'),
type: 'canvas'
},
})
s.graph.addNode({
id: 'n0',
label: 'Hello',
x: Math.random(),
y: Math.random(),
size: 5
}).addNode({
id: 'n1',
label: 'World !',
x: Math.random() * 1.7,
y: Math.random() * 1.5,
size: 5,
}).addEdge({
id: 'e0',
label: '1',
source: 'n0',
target: 'n1',
size: 10,
type: "curvedArrow",
edgeColor:'default',
})