| <!DOCTYPE html> | |
| <html> | |
| <head lang="en"> | |
|     <meta charset="UTF-8"> | |
|     <title></title> | |
| 
 | |
|     <script type="text/javascript" src="../dist/vis.js"></script> | |
|     <link href="../dist/vis.css" rel="stylesheet" type="text/css"/> | |
| 
 | |
|     <style type="text/css"> | |
|         #mynetwork { | |
|             width: 600px; | |
|             height: 400px; | |
|             border: 1px solid lightgray; | |
|         } | |
|     </style> | |
| 
 | |
| 
 | |
| </head> | |
| 
 | |
| <body> | |
| <div id="mynetwork"></div> | |
| 
 | |
| <script> | |
|     var network = null; | |
|     // create an array with nodes | |
|     var nodes = new vis.DataSet([ | |
|         {id: 1, label: 'Node 1', cid:1}, | |
|         {id: 2, label: 'Node 2', cid:1}, | |
|         {id: 3, label: 'Node 3'}, | |
|         {id: 4, label: 'Node 4'}, | |
|         {id: 5, label: 'Node 5'} | |
|     ]); | |
| 
 | |
|     // create an array with edges | |
|     var edges = new vis.DataSet([ | |
|         {id: 'e1', from: 1, to: 3, label: 'hi'}, | |
|         {from: 1, to: 2}, | |
|         {from: 2, to: 4}, | |
|         {from: 2, to: 5} | |
|     ]); | |
| 
 | |
|     var data = { | |
|         nodes: nodes, | |
|         edges: edges | |
|     }; | |
|     var container = document.getElementById('mynetwork'); | |
| 
 | |
|     function drawQuick() { | |
|         draw({physics:{stabilization:false}}); | |
|     } | |
| 
 | |
|     function draw(options) { | |
|         try { | |
|             // clean | |
|             if (network !== null) { | |
|                 network.destroy(); | |
|                 network = null; | |
|             } | |
|             network = new vis.Network(container, data, options); | |
|         } | |
|         catch (err) { | |
|             console.log("err") | |
|         } | |
|     } | |
| 
 | |
|     function clusterByCid() { | |
|         drawQuick(); | |
|         var clusterOptionsByData = { | |
|             joinCondition:function(childOptions) { | |
|                 return childOptions.cid == 1; | |
|             }, | |
|             clusterNodeProperties: {id:'cidCluster', borderWidth:3, shape:'database'} | |
|         } | |
|         network.cluster(clusterOptionsByData); | |
|     } | |
| 
 | |
| 
 | |
|     function clusterByConnection() { | |
|         drawQuick(); | |
|         network.clusterByConnection(1) | |
|     } | |
|     function clusterByHubsize() { | |
|         drawQuick(); | |
|         var clusterOptionsByData = { | |
|             processProperties: function(clusterOptions, childNodes) { | |
|                 clusterOptions.label = "[" + childNodes.length + "]"; | |
|                 return clusterOptions; | |
|             }, | |
|             clusterNodeProperties: {borderWidth:3, shape:'box', font:{size:30}} | |
|         } | |
|         network.clusterByHubsize(undefined, clusterOptionsByData); | |
|     } | |
| 
 | |
|     function checkMethods() { | |
|         var methods = [ | |
|             {name:"setSize",            arguments: [200,300]}, | |
|             {name:"canvasToDOM",        arguments: [{x:10,y:20}]}, | |
|             {name:"DOMtoCanvas",        arguments: [{x:10,y:20}]}, | |
|             {name:"findNode",           arguments: [1]}, | |
|             {name:"isCluster",          arguments: [1]}, | |
|             {name:"cluster",            arguments: null, func: clusterByCid}, | |
|             {name:"findNode",           arguments: [1]}, | |
|             {name:"isCluster",          arguments: ['cidCluster']}, | |
|             {name:"getNodesInCluster",  arguments: ['cidCluster']}, | |
|             {name:"openCluster",        arguments: ['cidCluster']}, | |
|             {name:"clusterByConnection",arguments: null, func: clusterByConnection}, | |
|             {name:"clusterByHubsize",   arguments: null, func: clusterByHubsize}, | |
|             {name:"clusterOutliers",    arguments: null, funcFirst: drawQuick}, | |
|             {name:"getSeed",            arguments: null, funcFirst: drawQuick}, | |
|             {name:"enableEditMode",     arguments: null}, | |
|             {name:"disableEditMode",    arguments: null}, | |
|             {name:"addNodeMode",        arguments: null}, | |
|             {name:"disableEditMode",    arguments: null}, | |
|             {name:"editNode",           arguments: null, funcFirst: function() {network.setOptions({manipulation:{editNode:function(data,callback) {callback(data);}}})}}, | |
|             {name:"disableEditMode",    arguments: null}, | |
|             {name:"addEdgeMode",        arguments: null}, | |
|             {name:"disableEditMode",    arguments: null}, | |
|             {name:"editEdgeMode",       arguments: null}, | |
|             {name:"disableEditMode",    arguments: null}, | |
|             {name:"selectNodes",        arguments: [[5], true]}, | |
|             {name:"deleteSelected",     arguments: null, funcFirst:drawQuick}, | |
|             {name:"disableEditMode",    arguments: null}, | |
|             {name:"getPositions",       arguments: [[1]]}, | |
|             {name:"storePositions",     arguments: null, funcFirst:drawQuick}, | |
|             {name:"getBoundingBox",     arguments: [1]}, | |
|             {name:"getConnectedNodes",  arguments: [1]}, | |
|             {name:"getConnectedEdges",  arguments: [1]}, | |
|             {name:"startSimulation",    arguments: null}, | |
|             {name:"stopSimulation",     arguments: null}, | |
|             {name:"stabilize",          arguments: null}, | |
|             {name:"getSelection",       arguments: null}, | |
|             {name:"getSelectedNodes",   arguments: null}, | |
|             {name:"getSelectedEdges",   arguments: null}, | |
|             {name:"getNodeAt",          arguments: [{x:10,y:20}]}, | |
|             {name:"getEdgeAt",          arguments: [{x:10,y:20}]}, | |
|             {name:"selectNodes",        arguments: [[1],false]}, | |
|             {name:"selectEdges",        arguments: [['e1']]}, | |
|             {name:"unselectAll",        arguments: null}, | |
|             {name:"redraw",             arguments: null}, | |
|             {name:"getScale",           arguments: null}, | |
|             {name:"getViewPosition",    arguments: null}, | |
|             {name:"fit",                arguments: null}, | |
|             {name:"moveTo",             arguments: [{position:{x:0,y:0}}]}, | |
|             {name:"focus",              arguments: [1]}, | |
|             {name:"releaseNode",        arguments: null}, | |
|             {name:"getOptionsFromConfigurator", arguments: null}, | |
|         ] | |
| 
 | |
|         drawQuick(); | |
|         for (var i = 0; i < methods.length; i++) { | |
|             setTimeout(testMethod.bind(this,methods,i), i*50); | |
|         } | |
|     } | |
| 
 | |
|     function testMethod(methods,i) { | |
|         var methodName = methods[i].name; | |
|         console.log("Currently testing:", methodName); | |
| 
 | |
|         if (methods[i].funcFirst !== undefined) { | |
|             methods[i].funcFirst(); | |
|         } | |
| 
 | |
|         if (methods[i].func !== undefined) { | |
|             methods[i].func(); | |
|         } | |
|         else { | |
|             if (methods[i].arguments === null) { | |
|                 network[methodName].apply(network); | |
|             } | |
|             else { | |
|                 network[methodName].apply(network, methods[i].arguments) | |
|             } | |
|         } | |
|     } | |
| 
 | |
| 
 | |
| 
 | |
|     var amountOfOptionChecks = 50; | |
|     var optionsThreshold = 0.8; | |
|     var optionGlobalCount = 0; | |
|     function checkOptions() { | |
|         optionGlobalCount++; | |
|         if (optionGlobalCount == amountOfOptionChecks) { | |
|             checkMethods(); | |
|         } | |
|         else { | |
|             var allOptions = vis.network.allOptions.allOptions; | |
|             var testOptions = {}; | |
|             constructOptions(allOptions, testOptions); | |
|             if (testOptions.physics === undefined) {testOptions.physics = {};} | |
|             if (testOptions.layout === undefined) {testOptions.layout = {};} | |
|             testOptions.physics.enabled = true; | |
|             testOptions.layout.improvedLayout = false; | |
|             var failed = setTimeout(function () { | |
|                 console.error("FAILED", JSON.stringify(testOptions, null, 4)) | |
|             }, 500); | |
|             var counter = 0; | |
|             drawQuick(); | |
|             network.on("afterDrawing", function () { | |
|                 counter++; | |
|                 if (counter > 2) { | |
|                     counter = 0; | |
|                     network.off('afterDrawing'); | |
|                     clearTimeout(failed); | |
|                     network.destroy(); | |
|                 } | |
|             }) | |
|             network.on("stabilized", function () { | |
|                 clearTimeout(failed); | |
|                 network.destroy(); | |
|             }); | |
|             network.once("destroy", function () { | |
|                 clearTimeout(failed); | |
|                 setTimeout(checkOptions, 100); | |
|             }) | |
|             console.log("now testing:",testOptions) | |
| 
 | |
|             network.setOptions(testOptions); | |
|         } | |
|     } | |
| 
 | |
|     function constructOptions(allOptions, testOptions) { | |
|         for (var option in allOptions) { | |
|             if (Math.random() < optionsThreshold) { | |
|                 if (option !== "__type__" && option !== '__any__' && option !== 'locales' && option !== 'image' && option !== 'id') { | |
|                     if (allOptions[option].__type__ !== undefined) { | |
|                         if (testOptions[option] === undefined) { | |
|                             testOptions[option] = {}; | |
|                         } | |
|                         constructOptions(allOptions[option], testOptions[option]) | |
|                         if (Object.keys(testOptions).length === 0) { | |
|                             testOptions[option] = undefined; | |
|                             delete testOptions[option]; | |
|                         } | |
|                     } | |
|                     else { | |
|                         if (allOptions[option].boolean !== undefined) { | |
|                             if (testOptions[option] === undefined) { | |
|                                 testOptions[option] = {}; | |
|                             } | |
|                             testOptions[option] = Math.random() < 0.5; | |
|                         } | |
|                         else if(allOptions[option].number !== undefined) { | |
|                             if (testOptions[option] === undefined) { | |
|                                 testOptions[option] = {}; | |
|                             } | |
|                             testOptions[option] = 1 * Math.random(); | |
|                         } | |
|                         else if(allOptions[option].string !== undefined && Array.isArray(allOptions[option].string)) { | |
|                             var value = allOptions[option].string[Math.floor(Math.random() * allOptions[option].string.length)]; | |
|                             if (value !== 'image' && value !== 'circularImage' && value !== 'icon') { | |
|                                 if (testOptions[option] === undefined) { | |
|                                     testOptions[option] = {}; | |
|                                 } | |
|                                 testOptions[option] = value; | |
|                             } | |
|                         } | |
|                         else if(allOptions[option].string !== undefined) { | |
| //                            if (testOptions[option] === undefined) { | |
| //                                testOptions[option] = {}; | |
| //                            } | |
| //                            testOptions[option] = "hello world"; | |
|                         } | |
|                     } | |
|                 } | |
|             } | |
|         } | |
|     } | |
| 
 | |
| 
 | |
|     checkOptions(); | |
| //    for (var i = 0; i < amountOfOptionChecks; i++) { | |
| //        setTimeout(checkOptions.bind(this,i), i*optionCheckTime); | |
| //    } | |
| //    setTimeout(checkMethods, amountOfOptionChecks*optionCheckTime); | |
| </script> | |
| </body> | |
| </html> |