mirror of
https://github.com/fhswf/aki_prj23_transparenzregister.git
synced 2026-02-13 22:17:38 +01:00
Added test
This commit is contained in:
Tim committed
1 parent
41af7e2d18
commit
410b690873
18 files changed
+619
-384
No files matched your search
@@ -0,0 +1,272 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<script src="lib/bindings/utils.js"></script>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vis-network/9.1.2/dist/dist/vis-network.min.css" integrity="sha512-WgxfT5LWjfszlPHXRmBWHkV2eceiWTOBvrKCNbdgDYTHrT2AeLCGbF4sZlZw3UMN3WtL0tGUoIAKsu8mllg/XA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/vis-network/9.1.2/dist/vis-network.min.js" integrity="sha512-LnvoEWDFrqGHlHmDD2101OrLcbsfkrzoSpvtSQtxK3RMnRV0eOkhhBN2dXHKRrUU8p2DGRTk35n4O8nWSVe1mQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
|
||||
|
||||
<center>
|
||||
<h1></h1>
|
||||
</center>
|
||||
|
||||
<!-- <link rel="stylesheet" href="../node_modules/vis/dist/vis.min.css" type="text/css" />
|
||||
<script type="text/javascript" src="../node_modules/vis/dist/vis.js"> </script>-->
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<script
|
||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf"
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
|
||||
|
||||
<center>
|
||||
<h1></h1>
|
||||
</center>
|
||||
<style type="text/css">
|
||||
|
||||
#mynetwork {
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
background-color: white;
|
||||
border: 1px solid lightgray;
|
||||
position: relative;
|
||||
float: left;
|
||||
}
|
||||
|
||||
|
||||
#loadingBar {
|
||||
position:absolute;
|
||||
top:0px;
|
||||
left:0px;
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
background-color:rgba(200,200,200,0.8);
|
||||
-webkit-transition: all 0.5s ease;
|
||||
-moz-transition: all 0.5s ease;
|
||||
-ms-transition: all 0.5s ease;
|
||||
-o-transition: all 0.5s ease;
|
||||
transition: all 0.5s ease;
|
||||
opacity:1;
|
||||
}
|
||||
|
||||
#bar {
|
||||
position:absolute;
|
||||
top:0px;
|
||||
left:0px;
|
||||
width:20px;
|
||||
height:20px;
|
||||
margin:auto auto auto auto;
|
||||
border-radius:11px;
|
||||
border:2px solid rgba(30,30,30,0.05);
|
||||
background: rgb(0, 173, 246); /* Old browsers */
|
||||
box-shadow: 2px 0px 4px rgba(0,0,0,0.4);
|
||||
}
|
||||
|
||||
#border {
|
||||
position:absolute;
|
||||
top:10px;
|
||||
left:10px;
|
||||
width:500px;
|
||||
height:23px;
|
||||
margin:auto auto auto auto;
|
||||
box-shadow: 0px 0px 4px rgba(0,0,0,0.2);
|
||||
border-radius:10px;
|
||||
}
|
||||
|
||||
#text {
|
||||
position:absolute;
|
||||
top:8px;
|
||||
left:530px;
|
||||
width:30px;
|
||||
height:50px;
|
||||
margin:auto auto auto auto;
|
||||
font-size:22px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
div.outerBorder {
|
||||
position:relative;
|
||||
top:400px;
|
||||
width:600px;
|
||||
height:44px;
|
||||
margin:auto auto auto auto;
|
||||
border:8px solid rgba(0,0,0,0.1);
|
||||
background: rgb(252,252,252); /* Old browsers */
|
||||
background: -moz-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(252,252,252,1)), color-stop(100%,rgba(237,237,237,1))); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(top, rgba(252,252,252,1) 0%,rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(top, rgba(252,252,252,1) 0%,rgba(237,237,237,1) 100%); /* Opera 11.10+ */
|
||||
background: -ms-linear-gradient(top, rgba(252,252,252,1) 0%,rgba(237,237,237,1) 100%); /* IE10+ */
|
||||
background: linear-gradient(to bottom, rgba(252,252,252,1) 0%,rgba(237,237,237,1) 100%); /* W3C */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
|
||||
border-radius:72px;
|
||||
box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
|
||||
|
||||
#config {
|
||||
float: left;
|
||||
width: 400px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
|
||||
<body>
|
||||
<div class="card" style="width: 100%">
|
||||
|
||||
|
||||
<div id="mynetwork" class="card-body"></div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="loadingBar">
|
||||
<div class="outerBorder">
|
||||
<div id="text">0%</div>
|
||||
<div id="border">
|
||||
<div id="bar"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="config"></div>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
// initialize global variables.
|
||||
var edges;
|
||||
var nodes;
|
||||
var allNodes;
|
||||
var allEdges;
|
||||
var nodeColors;
|
||||
var originalNodes;
|
||||
var network;
|
||||
var container;
|
||||
var options, data;
|
||||
var filter = {
|
||||
item : '',
|
||||
property : '',
|
||||
value : []
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// This method is responsible for drawing the graph, returns the drawn network
|
||||
function drawGraph() {
|
||||
var container = document.getElementById('mynetwork');
|
||||
|
||||
|
||||
|
||||
// parsing and collecting nodes and edges from the python
|
||||
nodes = new vis.DataSet([{"color": "#729b79ff", "font": {"color": "black"}, "id": "person_1", "label": "Tetau, Nicolas", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "company_1", "label": "0 10 24 Telefondienste GmbH", "shape": "dot", "size": 10, "type": "Company"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "company_4", "label": "01050.com GmbH", "shape": "dot", "size": 10, "type": "Company"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_2", "label": "Dammast, Lutz", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_3", "label": "Tutsch, Rosemarie", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "company_2", "label": "1. Staiger Grundst\u00fccksverwaltung GmbH \u0026 Co. KG", "shape": "dot", "size": 10, "type": "Company"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_4", "label": "Staiger, Marc", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_5", "label": "Staiger, Michaela", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_6", "label": "Staiger, Margarete", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_7", "label": "Staiger, Bruno", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_8", "label": "Hofmann, Nicole", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_9", "label": "Autenrieth, Steffen", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "company_3", "label": "1 A Autenrieth Kunststofftechnik GmbH \u0026 Co. KG", "shape": "dot", "size": 10, "type": "Company"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_10", "label": "Bischoff, Stefanie", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "company_2213", "label": "Multi-Center Warenvertriebs GmbH", "shape": "dot", "size": 10, "type": "Company"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "company_5", "label": "2. Schaper Objekt GmbH \u0026 Co. Kiel KG", "shape": "dot", "size": 10, "type": "Company"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_11", "label": "Achilles, Christel", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "company_6", "label": "AASP Filmproduktionsgesellschaft mbH \u0026 Co. Leonie KG", "shape": "dot", "size": 10, "type": "Company"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_12", "label": "Ackermann, Wilhelm", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_13", "label": "Ahrens, Harald", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_14", "label": "Al Sibai, Mohamed Maged", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_15", "label": "Al-Bazaz, Salim", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_16", "label": "Attawar, Marina", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_17", "label": "Babic-Pavicic, Ankica", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_18", "label": "Bak, Ingo", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_19", "label": "Becker, Christoph", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_20", "label": "Becker, Olaf", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_21", "label": "Berg, Rainer", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_22", "label": "Berkhout, Pieter", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_23", "label": "Berns, Bernhard", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_24", "label": "Betz, Franz-Hartwig", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_25", "label": "Birken, Claus", "shape": "dot", "size": 10, "type": "Person"}, {"color": "#729b79ff", "font": {"color": "black"}, "id": "person_26", "label": "Blessing, Helmut", "shape": "dot", "size":Line truncated
|
||||
edges = new vis.DataSet([{"from": "person_1", "label": "Gesch\u00e4ftsf\u00fchrer", "to": "company_1", "width": 1}, {"from": "person_1", "label": "Gesch\u00e4ftsf\u00fchrer", "to": "company_4", "width": 1}, {"from": "company_1", "label": "Prokurist", "to": "person_2", "width": 1}, {"from": "person_2", "label": "Prokurist", "to": "company_4", "width": 1}, {"from": "person_3", "label": "Kommanditist", "to": "company_2", "width": 1}, {"from": "company_2", "label": "Kommanditist", "to": "person_4", "width": 1}, {"from": "company_2", "label": "Kommanditist", "to": "person_5", "width": 1}, {"from": "company_2", "label": "Kommanditist", "to": "person_6", "width": 1}, {"from": "company_2", "label": "Kommanditist", "to": "person_7", "width": 1}, {"from": "company_2", "label": "Kommanditist", "to": "person_8", "width": 1}, {"from": "person_9", "label": "Kommanditist", "to": "company_3", "width": 1}, {"from": "company_3", "label": "Prokurist", "to": "person_10", "width": 1}, {"from": "company_2213", "label": "Organisation", "to": "company_5", "width": 1}, {"from": "person_11", "label": "Kommanditist", "to": "company_6", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_12", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_13", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_14", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_15", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_16", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_17", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_18", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_19", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_20", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_21", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_22", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_23", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_24", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_25", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_26", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_27", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_28", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_29", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_30", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_31", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_32", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_33", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_34", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_35", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_36", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_37", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_38", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_39", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_40", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_41", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_42", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_43", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_44", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_45", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_46", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_47", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_48", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_49", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_50", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_51", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_52", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_53", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_54", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_55", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_56", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_57", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_58", "width": 1}, {"from": "company_6", "label": "Kommanditist", "to": "person_59", "width": 1}, {"from": "company_6", "label": "Kommanditist", "tLine truncated
|
||||
|
||||
nodeColors = {};
|
||||
allNodes = nodes.get({ returnType: "Object" });
|
||||
for (nodeId in allNodes) {
|
||||
nodeColors[nodeId] = allNodes[nodeId].color;
|
||||
}
|
||||
allEdges = edges.get({ returnType: "Object" });
|
||||
// adding nodes and edges to the graph
|
||||
data = {nodes: nodes, edges: edges};
|
||||
|
||||
var options = {
|
||||
"configure": {
|
||||
"enabled": true
|
||||
},
|
||||
"edges": {
|
||||
"color": {
|
||||
"inherit": false
|
||||
},
|
||||
"smooth": {
|
||||
"enabled": true,
|
||||
"type": "dynamic"
|
||||
}
|
||||
},
|
||||
"interaction": {
|
||||
"dragNodes": true,
|
||||
"hideEdgesOnDrag": false,
|
||||
"hideNodesOnDrag": false
|
||||
},
|
||||
"physics": {
|
||||
"enabled": true,
|
||||
"repulsion": {
|
||||
"centralGravity": 0.2,
|
||||
"damping": 0.09,
|
||||
"nodeDistance": 100,
|
||||
"springConstant": 0.05,
|
||||
"springLength": 200
|
||||
},
|
||||
"solver": "repulsion",
|
||||
"stabilization": {
|
||||
"enabled": true,
|
||||
"fit": true,
|
||||
"iterations": 1000,
|
||||
"onlyDynamicEdges": false,
|
||||
"updateInterval": 50
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// if this network requires displaying the configure window,
|
||||
// put it in its div
|
||||
options.configure["container"] = document.getElementById("config");
|
||||
|
||||
|
||||
network = new vis.Network(container, data, options);
|
||||
|
||||
|
||||
network.on("click", neighbourhoodHighlight);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
network.on("stabilizationProgress", function(params) {
|
||||
document.getElementById('loadingBar').removeAttribute("style");
|
||||
var maxWidth = 496;
|
||||
var minWidth = 20;
|
||||
var widthFactor = params.iterations/params.total;
|
||||
var width = Math.max(minWidth,maxWidth * widthFactor);
|
||||
document.getElementById('bar').style.width = width + 'px';
|
||||
document.getElementById('text').innerHTML = Math.round(widthFactor*100) + '%';
|
||||
});
|
||||
network.once("stabilizationIterationsDone", function() {
|
||||
document.getElementById('text').innerHTML = '100%';
|
||||
document.getElementById('bar').style.width = '496px';
|
||||
document.getElementById('loadingBar').style.opacity = 0;
|
||||
// really clean the dom element
|
||||
setTimeout(function () {document.getElementById('loadingBar').style.display = 'none';}, 500);
|
||||
});
|
||||
|
||||
|
||||
return network;
|
||||
|
||||
}
|
||||
drawGraph();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user