82 lines
1.7 KiB
JavaScript
82 lines
1.7 KiB
JavaScript
const socket = new WebSocket('ws://localhost:3000');
|
|
|
|
socket.addEventListener('open', () => {
|
|
console.log('WebSocket connection established');
|
|
});
|
|
|
|
socket.addEventListener('close', () => {
|
|
console.log('WebSocket connection closed');
|
|
});
|
|
|
|
socket.addEventListener('error', (error) => {
|
|
console.error('WebSocket error:', error);
|
|
});
|
|
|
|
const nodes = new vis.DataSet();
|
|
const network = new vis.Network(document.getElementById('network'), { nodes }, {
|
|
physics: {
|
|
enabled: true,
|
|
solver: 'forceAtlas2Based',
|
|
forceAtlas2Based: {
|
|
gravitationalConstant: -50,
|
|
centralGravity: 0.01,
|
|
springConstant: 0.08,
|
|
springLength: 100,
|
|
damping: 0.4,
|
|
avoidOverlap: 0
|
|
},
|
|
stabilization: {
|
|
enabled: true,
|
|
iterations: 1000,
|
|
updateInterval: 100,
|
|
onlyDynamicEdges: false,
|
|
fit: true
|
|
}
|
|
}
|
|
});
|
|
|
|
socket.addEventListener('message', (event) => {
|
|
const logData = JSON.parse(event.data);
|
|
const { msg_hash, receivedTime, nodeId, newNode } = logData;
|
|
|
|
console.log('Received log data:', logData);
|
|
|
|
if (newNode) {
|
|
console.log(`Adding new node: Node ${nodeId}`);
|
|
nodes.add({
|
|
id: nodeId,
|
|
label: `Node ${nodeId}`,
|
|
shape: 'circle',
|
|
color: {
|
|
background: 'grey',
|
|
highlight: {
|
|
background: 'grey'
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
console.log(`Node ${nodeId} received message: ${msg_hash}`);
|
|
nodes.update({
|
|
id: nodeId,
|
|
color: {
|
|
background: 'green',
|
|
highlight: {
|
|
background: 'green'
|
|
}
|
|
}
|
|
});
|
|
|
|
setTimeout(() => {
|
|
nodes.update({
|
|
id: nodeId,
|
|
color: {
|
|
background: 'grey',
|
|
highlight: {
|
|
background: 'grey'
|
|
}
|
|
}
|
|
});
|
|
}, 500);
|
|
});
|