-
Notifications
You must be signed in to change notification settings - Fork 191
/
click.html
57 lines (50 loc) · 1.35 KB
/
click.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<script src="../../build/3Dmol.js"></script>
<style>
.mol-container {
width: 100%;
height: 800px;
position: relative;
}
</style>
<div id="container-01" class="mol-container"></div>
<script>
let element = $('#container-01');
let config = { backgroundColor: 'white' };
let viewer = $3Dmol.createViewer( element, config );
let lines = [
[[ 0, 0, 0], [10, 0, 0,]],
[[10, 0, 0], [10, 10, 0,]],
[[10, 10, 0], [ 0, 10, 0,]],
[[ 0, 10, 0], [ 0, 0, 0,]],
[[ 0, 0, 10], [10, 0, 10,]],
[[10, 0, 10], [10, 10, 10,]],
[[10, 10, 10], [ 0, 10, 10,]],
[[ 0, 10, 10], [ 0, 0, 10,]],
[[ 0, 0, 0], [ 0, 0, 10,]],
[[10, 0, 0], [10, 0, 10,]],
[[10, 10, 0], [10, 10, 10,]],
[[ 0, 10, 0], [ 0, 10, 10,]],
]
for (let i = 0; i< 12; i++) {
a = viewer.addLine({start:{x:lines[i][0][0],
y:lines[i][0][1],
z:lines[i][0][2]},
end: {x:lines[i][1][0],
y:lines[i][1][1],
z:lines[i][1][2]}});
// console.log(a)
}
viewer.addSphere({
center:{x:10,y:10,z:10},
radius:1.0,
color:'red',
clickable: true,
callback: ()=>{
alert(123)
}
})
viewer.setProjection('orthographic')
viewer.zoomTo();
viewer.render();
viewer.zoom(0.8, 0);
</script>