add group functionality to the cluster

This commit is contained in:
Andreas Zweili 2018-07-26 21:12:15 +02:00
parent 053be700da
commit d50dfd9ffb
1 changed files with 55 additions and 2 deletions

View File

@ -18,15 +18,26 @@
font-family: Arial;
font-weight:bold
}
#buttons {
width: 119px;
}
#stabilisationBox {
width: 175px;
}
</style>
</head>
<body>
<div id="infomessage">
<p>If you see an empty rectangle the cluster ist currently loading.<br />
Please be patient and don't refresh the page.
</p>
Please be patient and don't refresh the page.</p>
</div>
<div id="buttons">
<input id="buttonCluster" type="button" value="Open/Close Clusters" onclick="clusterByHubsize()"/>
</div>
<div id="stabilisationBox">
Stabilize when clustering:<input type="checkbox" id="stabilizeCheckbox">
</div>
<div id="mynetwork"></div>
@ -44,10 +55,52 @@
nodes: nodes,
edges: edges
};
var clusterIndex = 0;
var clusters = [];
var options = {};
// initialize your network!
var network = new vis.Network(container, data, options);
network.on("selectNode", function(params) {
if (params.nodes.length == 1) {
if (network.isCluster(params.nodes[0]) == true) {
network.openCluster(params.nodes[0]);
}
}
});
function clusterByHubsize() {
if (clusterIndex == 0) {
network.setData(data);
var clusterOptionsByData = {
processProperties: function (clusterOptions, childNodes) {
clusterIndex = clusterIndex + 1;
clusterOptions.label = "[" + childNodes.length + "]";
clusterOptions.id = 'cluster:' + clusterIndex;
clusters.push({ id: 'cluster:' + clusterIndex });
return clusterOptions;
},
clusterNodeProperties: { borderWidth: 3, shape: 'box', font: { size: 30 } }
};
network.clusterByHubsize(undefined, clusterOptionsByData);
}
else {
openClusters();
}
};
clusterByHubsize();
function openClusters() {
var newClusters = [];
for (var i = 0; i < clusters.length; i++) {
network.openCluster(clusters[i].id);
}
if (document.getElementById('stabilizeCheckbox').checked === true) {
network.stabilize();
}
clusterIndex = 0;
clusters = newClusters;
};
</script>
</body>
</html>