Browse Source

Removed restriction to allow clusters of a single node. (#2013)

* Removed restriction to allow clusters of a single node; Default functionality remains the same;  Also added new example
* Add documentation for allowSingleNodeCluster, and removed excessive cluster() calls in example.
* Changed documentation as per request.
codeClimate
Steven 8 years ago
committed by Alexander Wunschik
parent
commit
b84e9e48de
3 changed files with 87 additions and 3 deletions
  1. +7
    -1
      docs/network/index.html
  2. +75
    -0
      examples/network/other/clustersOfclusters.html
  3. +5
    -2
      lib/network/modules/Clustering.js

+ 7
- 1
docs/network/index.html View File

@ -1237,7 +1237,13 @@ var options = {
node
any way you want. This is also the style object that is provided in the processProperties function
for
fine tuning. If undefined, default node options will be used.
fine tuning. If undefined, default node options will be used.<br/><br/>
Default functionality only allows clustering if the cluster will contain 2 or more nodes. To allow clustering of single nodes you can use the <code>allowSingleNodeCluster : true</code> property.
<pre class="prettyprint lang-js">
clusterNodeProperties: {
allowSingleNodeCluster: true
}
</pre>
</td>
</tr>
<tr><td id="event_clusterEdgeProperties">clusterEdgeProperties</td>

+ 75
- 0
examples/network/other/clustersOfclusters.html View File

@ -0,0 +1,75 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Cluster Test</title>
<script type="text/javascript" src="../../../dist/vis.js"></script>
<link href="../../../dist/vis.css" rel="stylesheet" type="text/css"/>
<style type="text/css">
#network_graph {
width: 1000px;
height: 800px;
border: 1px solid lightgray;
}
</style>
</head>
<body onload="draw()">
<p>
Clusters can contain other clusters, but clusters of a single node is only possible by adding
<pre>allowSingleNodeCluster: true</pre>
to clusterNodeProperties<br/>
In this example repeatedly clicking on the node with open the Clusters.
</p>
<div id="network_graph"></div>
<div id="info"></div>
<script type="text/javascript">
var network;
var node_color = ['orange', 'green', 'red', 'yellow', 'cyan'];
var node_shape = ['star', 'database', 'diamond', 'square', 'triangle'];
var nodes = new vis.DataSet([
{id: 'x', label: 'Node X'},
{id: 'y', label: 'Node Y'},
]);
var network_options = {};
var edges = new vis.DataSet([
{from: 'x', to: 'y'}
]);
var cluster_id = 1;
function draw() {
network = new vis.Network(
document.getElementById('network_graph'),
{
nodes: nodes,
edges: edges
},
network_options
);
network.on('click', function (params) {
if (params.nodes.length == 1) {
if (network.isCluster(params.nodes[0]) == true) {
network.openCluster(params.nodes[0]);
}
}
});
cluster();
cluster();
cluster();
}
function cluster() {
var clusterOptions = {
joinCondition: function (childOptions) {
console.log(childOptions);
return true;
},
clusterNodeProperties: {id: cluster_id, label: "Cluster " + cluster_id, color: node_color[cluster_id - 1], shape: node_shape[cluster_id - 1], allowSingleNodeCluster: true}
};
cluster_id++;
network.cluster(clusterOptions);
}
</script>
</body>
</html>

+ 5
- 2
lib/network/modules/Clustering.js View File

@ -348,8 +348,11 @@ class ClusterEngine {
* @private
*/
_cluster(childNodesObj, childEdgesObj, options, refreshData = true) {
// kill condition: no children so can't cluster or only one node in the cluster, don't bother
if (Object.keys(childNodesObj).length < 2) {return;}
// kill condition: no nodes don't bother
if (Object.keys(childNodesObj).length == 0) {return;}
// allow clusters of 1 if options allow
if (Object.keys(childNodesObj).length == 1 && options.clusterNodeProperties.allowSingleNodeCluster != true) {return;}
// check if this cluster call is not trying to cluster anything that is in another cluster.
for (let nodeId in childNodesObj) {

Loading…
Cancel
Save