Skip to content

Commit 02f9e87

Browse files
Mugen87Mugen87
committed
DragControls: Add doc page.
1 parent 6e2d870 commit 02f9e87

File tree

3 files changed

+240
-0
lines changed

3 files changed

+240
-0
lines changed

‎docs/examples/en/controls/DragControls.html‎

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<base href="../../../" />
6+
<script src="list.js"></script>
7+
<script src="page.js"></script>
8+
<link type="text/css" rel="stylesheet" href="page.css" />
9+
</head>
10+
<body>
11+
[page:EventDispatcher] &rarr;
12+
13+
<h1>[name]</h1>
14+
15+
<p class="desc">
16+
This class can be used to provide a drag'n'drop interaction.
17+
</p>
18+
19+
<h2>Example</h2>
20+
21+
<p>[example:misc_controls_drag misc / controls / drag ]</p>
22+
23+
<code>
24+
var controls = new THREE.DragControls( objects, camera, renderer.domElement );
25+
26+
// add event listener to highlight dragged objects
27+
28+
controls.addEventListener( 'dragstart', function ( event ) {
29+
30+
event.object.material.emissive.set( 0xaaaaaa );
31+
32+
} );
33+
34+
controls.addEventListener( 'dragend', function ( event ) {
35+
36+
event.object.material.emissive.set( 0x000000 );
37+
38+
} );
39+
40+
</code>
41+
42+
<h2>Constructor</h2>
43+
44+
<h3>[name]( [param:Array objects], [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
45+
<p>
46+
<p>
47+
[page:Array objects]: An array of draggable 3D objects.
48+
</p>
49+
<p>
50+
[page:Camera camera]: The camera of the rendered scene.
51+
</p>
52+
<p>
53+
[page:HTMLDOMElement domElement]: The HTML element used for event listeners.
54+
</p>
55+
<p>
56+
Creates a new instance of [name].
57+
</p>
58+
</p>
59+
60+
<h2>Events</h2>
61+
62+
<h3>dragstart</h3>
63+
<p>
64+
Fires when the user starts to drag a 3D object.
65+
</p>
66+
67+
<h3>drag</h3>
68+
<p>
69+
Fires when the user drags a 3D object.
70+
</p>
71+
72+
<h3>dragend</h3>
73+
<p>
74+
Fires when the user has finished dragging a 3D object.
75+
</p>
76+
77+
<h3>hoveron</h3>
78+
<p>
79+
Fires when the pointer is moved onto a 3D object, or onto one of its children.
80+
</p>
81+
82+
<h3>hoveroff</h3>
83+
<p>
84+
Fires when the pointer is moved out of a 3D object.
85+
</p>
86+
87+
<h2>Properties</h2>
88+
89+
<h3>[property:Boolean enabled]</h3>
90+
<p>
91+
Whether or not the controls are enabled.
92+
</p>
93+
94+
<h2>Methods</h2>
95+
96+
<p>See the base [page:EventDispatcher] class for common methods.</p>
97+
98+
<h3>[method:null activate] ()</h3>
99+
<p>
100+
Adds the event listeners of the controls.
101+
</p>
102+
103+
<h3>[method:null deactivate] ()</h3>
104+
<p>
105+
Removes the event listeners of the controls.
106+
</p>
107+
108+
<h3>[method:null dispose] ()</h3>
109+
<p>
110+
Should be called if the controls is no longer required.
111+
</p>
112+
113+
<h2>Source</h2>
114+
115+
<p>
116+
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/DragControls.js examples/js/controls/DragControls.js]
117+
</p>
118+
</body>
119+
</html>

‎docs/examples/zh/controls/DragControls.html‎

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<base href="../../../" />
6+
<script src="list.js"></script>
7+
<script src="page.js"></script>
8+
<link type="text/css" rel="stylesheet" href="page.css" />
9+
</head>
10+
<body>
11+
[page:EventDispatcher] &rarr;
12+
13+
<h1>[name]</h1>
14+
15+
<p class="desc">
16+
This class can be used to provide a drag'n'drop interaction.
17+
</p>
18+
19+
<h2>Example</h2>
20+
21+
<p>[example:misc_controls_drag misc / controls / drag ]</p>
22+
23+
<code>
24+
var controls = new THREE.DragControls( objects, camera, renderer.domElement );
25+
26+
// add event listener to highlight dragged objects
27+
28+
controls.addEventListener( 'dragstart', function ( event ) {
29+
30+
event.object.material.emissive.set( 0xaaaaaa );
31+
32+
} );
33+
34+
controls.addEventListener( 'dragend', function ( event ) {
35+
36+
event.object.material.emissive.set( 0x000000 );
37+
38+
} );
39+
40+
</code>
41+
42+
<h2>Constructor</h2>
43+
44+
<h3>[name]( [param:Array objects], [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
45+
<p>
46+
<p>
47+
[page:Array objects]: An array of draggable 3D objects.
48+
</p>
49+
<p>
50+
[page:Camera camera]: The camera of the rendered scene.
51+
</p>
52+
<p>
53+
[page:HTMLDOMElement domElement]: The HTML element used for event listeners.
54+
</p>
55+
<p>
56+
Creates a new instance of [name].
57+
</p>
58+
</p>
59+
60+
<h2>Events</h2>
61+
62+
<h3>dragstart</h3>
63+
<p>
64+
Fires when the user starts to drag a 3D object.
65+
</p>
66+
67+
<h3>drag</h3>
68+
<p>
69+
Fires when the user drags a 3D object.
70+
</p>
71+
72+
<h3>dragend</h3>
73+
<p>
74+
Fires when the user has finished dragging a 3D object.
75+
</p>
76+
77+
<h3>hoveron</h3>
78+
<p>
79+
Fires when the pointer is moved onto a 3D object, or onto one of its children.
80+
</p>
81+
82+
<h3>hoveroff</h3>
83+
<p>
84+
Fires when the pointer is moved out of a 3D object.
85+
</p>
86+
87+
<h2>Properties</h2>
88+
89+
<h3>[property:Boolean enabled]</h3>
90+
<p>
91+
Whether or not the controls are enabled.
92+
</p>
93+
94+
<h2>Methods</h2>
95+
96+
<p>See the base [page:EventDispatcher] class for common methods.</p>
97+
98+
<h3>[method:null activate] ()</h3>
99+
<p>
100+
Adds the event listeners of the controls.
101+
</p>
102+
103+
<h3>[method:null deactivate] ()</h3>
104+
<p>
105+
Removes the event listeners of the controls.
106+
</p>
107+
108+
<h3>[method:null dispose] ()</h3>
109+
<p>
110+
Should be called if the controls is no longer required.
111+
</p>
112+
113+
<h2>Source</h2>
114+
115+
<p>
116+
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/DragControls.js examples/js/controls/DragControls.js]
117+
</p>
118+
</body>
119+
</html>

‎docs/list.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -354,6 +354,7 @@ var list = {
354354
},
355355

356356
"Controls": {
357+
"DragControls": "examples/en/controls/DragControls",
357358
"OrbitControls": "examples/en/controls/OrbitControls"
358359
},
359360

@@ -790,6 +791,7 @@ var list = {
790791
},
791792

792793
"控制": {
794+
"DragControls": "examples/en/controls/DragControls",
793795
"OrbitControls": "examples/zh/controls/OrbitControls"
794796
},
795797

0 commit comments

Comments
 (0)