Skip to content

Commit b4c0a23

Browse files
davidpiegzadavidpiegza
committed
Restructure source code files
1 parent 34b27e6 commit b4c0a23

File tree

13 files changed

+240
-109
lines changed

13 files changed

+240
-109
lines changed

‎examples/simple_graph/index.html

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
<!--
2+
This is an example html file with some options added. The minimum html file for
3+
the graph visualization is:
4+
<!DOCTYPE html>
5+
<html>
6+
<head>
7+
<title>Graph Visualization</title>
8+
<script type="text/javascript" src="build/graph.min.js"></script>
9+
</head>
10+
<body onload="new Drawing.SimpleGraph({layout: '3d', showStats: true, showInfo: true})">
11+
</bod>
12+
</html>
13+
-->
14+
<!DOCTYPE html>
15+
<html>
16+
<head>
17+
<meta charset="utf-8">
18+
<title>Graph Visualization</title>
19+
<script type="text/javascript" src="../../build/graph.min.js"></script>
20+
<script type="text/javascript" src="simple_graph.js"></script>
21+
22+
<script type="text/javascript">
23+
var drawing;
24+
function createDrawing() {
25+
drawing = new Drawing.SimpleGraph({layout: '3d', selection: true, numNodes: 50, graphLayout:{attraction: 5, repulsion: 0.5}, showStats: true, showInfo: true});
26+
}
27+
</script>
28+
29+
<style type="text/css">
30+
body {
31+
margin: 0;
32+
padding: 0;
33+
font: 11px courier;
34+
overflow: hidden;
35+
}
36+
#graph-info {
37+
position: absolute;
38+
top: 0px;
39+
left: 40%;
40+
margin: 10px;
41+
background-color: #ffffe0;
42+
color: #333;
43+
padding: 5px 10px;
44+
}
45+
#options {
46+
position: absolute;
47+
top: 0;
48+
right: 0;
49+
z-index: 10;
50+
}
51+
</style>
52+
</head>
53+
<body onload="createDrawing()">
54+
<div id="options">
55+
<form>
56+
<p>
57+
<input type="checkbox" id="show_labels" onclick="drawing.show_labels = this.checked;">
58+
<label for="show_labels">Show labels</label>
59+
</p>
60+
<p>
61+
<input type="button" value="Stop layout" onclick="drawing.stop_calculating();">
62+
</p>
63+
</form>
64+
</div>
65+
66+
<div style="position: absolute; bottom: 0;">
67+
Rotate: Left Mouse Button and Move<br />
68+
Zoom: Press Key S + Left Mouse Button and Move<br />
69+
Drag: Press Key D + Left Mouse Button and Move
70+
</div>
71+
</body>
72+
</html>

‎drawings/simple_graph.js renamed to ‎examples/simple_graph/simple_graph.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ Drawing.SimpleGraph = function(options) {
8282

8383

8484
camera = new THREE.PerspectiveCamera(40, window.innerWidth/window.innerHeight, 1, 1000000);
85-
camera.position.z = 5000;
85+
camera.position.z = 10000;
8686

8787
controls = new THREE.TrackballControls(camera);
8888

‎examples/sphere_graph/index.html

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
<!--
2+
This is an example html file with some options added. The minimum html file for
3+
the graph visualization is:
4+
<!DOCTYPE html>
5+
<html>
6+
<head>
7+
<title>Graph Visualization</title>
8+
<script type="text/javascript" src="build/graph.min.js"></script>
9+
</head>
10+
<body onload="new Drawing.SimpleGraph({layout: '3d', showStats: true, showInfo: true})">
11+
</bod>
12+
</html>
13+
-->
14+
<!DOCTYPE html>
15+
<html>
16+
<head>
17+
<meta charset="utf-8">
18+
<title>Graph Visualization</title>
19+
<script type="text/javascript" src="../../build/graph.min.js"></script>
20+
<script type="text/javascript" src="sphere_graph.js"></script>
21+
22+
<script type="text/javascript">
23+
var drawing;
24+
function createDrawing() {
25+
drawing = new Drawing.SphereGraph({numNodes: 50, showStats: true, showInfo: true});
26+
}
27+
</script>
28+
29+
<style type="text/css">
30+
body {
31+
margin: 0;
32+
padding: 0;
33+
font: 11px courier;
34+
overflow: hidden;
35+
}
36+
#graph-info {
37+
position: absolute;
38+
top: 0px;
39+
left: 40%;
40+
margin: 10px;
41+
background-color: #ffffe0;
42+
color: #333;
43+
padding: 5px 10px;
44+
}
45+
#options {
46+
position: absolute;
47+
top: 0;
48+
right: 0;
49+
z-index: 10;
50+
}
51+
</style>
52+
</head>
53+
<body onload="createDrawing()">
54+
<div id="options">
55+
<form>
56+
<p>
57+
<input type="checkbox" id="show_labels" onclick="drawing.show_labels = this.checked;">
58+
<label for="show_labels">Show labels</label>
59+
</p>
60+
<p>
61+
<input type="button" value="Stop layout" onclick="drawing.stop_calculating();">
62+
</p>
63+
</form>
64+
</div>
65+
66+
<div style="position: absolute; bottom: 0;">
67+
Rotate: Left Mouse Button and Move<br />
68+
Zoom: Press Key S + Left Mouse Button and Move<br />
69+
Drag: Press Key D + Left Mouse Button and Move
70+
</div>
71+
</body>
72+
</html>

‎drawings/sphere_graph.js renamed to ‎examples/sphere_graph/sphere_graph.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ Drawing.SphereGraph = function(options) {
8585
renderer.setSize( window.innerWidth, window.innerHeight );
8686

8787
camera = new THREE.PerspectiveCamera(35, window.innerWidth / window.innerHeight, 1, 100000);
88-
camera.position.z = 10000;
88+
camera.position.z = 20000;
8989

9090
controls = new THREE.TrackballControls(camera);
9191

‎index.html

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Graph Visualization</title>
6+
7+
<style type="text/css">
8+
body {
9+
margin: 0;
10+
padding: 0;
11+
font: 14px monospace;
12+
overflow: hidden;
13+
}
14+
15+
h1 {
16+
font-size: 20px;
17+
}
18+
19+
h2 {
20+
font-size: 16px;
21+
}
22+
23+
a {
24+
text-decoration: none;
25+
color: #4285C2;
26+
}
27+
28+
a:hover {
29+
text-decoration: underline;
30+
}
31+
32+
.sidebar {
33+
position: fixed;
34+
left: 0;
35+
width: 20%;
36+
height: 100%;
37+
background-color: #f0f0f0;
38+
}
39+
40+
.sidebar section {
41+
padding: 10px 20px;
42+
}
43+
44+
#viewer {
45+
position: absolute;
46+
left: 20%;
47+
width: 79%;
48+
height: 100%;
49+
overflow: auto;
50+
border: 0;
51+
}
52+
</style>
53+
</head>
54+
<body onload="loadExample()">
55+
<div id="content">
56+
<aside class="sidebar">
57+
<section>
58+
<h1>Graph Visualization</h1>
59+
</section>
60+
61+
<section id="links">
62+
<div>
63+
<a href="https://github.com/davidpiegza/Graph-Visualization">source code</a>
64+
<div>
65+
66+
<div>
67+
<a href="https://github.com/davidpiegza/Graph-Visualization#contribution">contribution</a>
68+
</div>
69+
</section>
70+
71+
<section id="examples">
72+
<h2>examples</h2>
73+
74+
<div>
75+
<a href="examples/simple_graph/index.html" target="viewer">simple graph</a>
76+
</div>
77+
78+
<div>
79+
<a href="examples/sphere_graph/index.html" target="viewer">sphere graph</a>
80+
</div>
81+
</section>
82+
</aside>
83+
84+
<iframe id="viewer" name="viewer" allowfullscreen allowvr onmousewheel=""></iframe>
85+
</div>
86+
87+
<script>
88+
function loadExample() {
89+
var viewer = document.getElementById('viewer');
90+
viewer.src = 'examples/simple_graph/index.html'
91+
}
92+
</script>
93+
</body>
94+
</html>

‎index_example.html

Lines changed: 0 additions & 107 deletions
This file was deleted.

‎Graph.js renamed to ‎src/graph.js

File renamed without changes.

‎layouts/force-directed-layout.js renamed to ‎src/layouts/force-directed-layout.js

File renamed without changes.

‎utils/Label.js renamed to ‎src/utils/Label.js

File renamed without changes.

‎utils/ObjectSelection.js renamed to ‎src/utils/ObjectSelection.js

File renamed without changes.

0 commit comments

Comments
 (0)