提交 f1ac751d 编写于 作者: D Dinesh Salunke

Merge branch 'dev' of https://github.com/mrdoob/three.js into dev

此差异已折叠。
此差异已折叠。
此差异已折叠。
......@@ -128,6 +128,11 @@
Whether rendering this material has any effect on the stencil buffer. Default is *false*.
</p>
<h3>[property:Boolean stencilWriteMask]</h3>
<p>
The bit mask to use when writing to the stencil buffer. Default is *0xFF*.
</p>
<h3>[property:Boolean stencilFunc]</h3>
<p>
The stencil comparison function to use. Default is [page:Materials AlwaysStencilFunc]. See stencil function [page:Materials constants] for all possible values.
......@@ -138,9 +143,9 @@
The value to use when performing stencil comparisons or stencil operations. Default is *0*.
</p>
<h3>[property:Boolean stencilMask]</h3>
<h3>[property:Boolean stencilFuncMask]</h3>
<p>
The bit mask to use when comparing against or writing to the stencil buffer. Default is *0xFF*.
The bit mask to use when comparing against the stencil buffer. Default is *0xFF*.
</p>
<h3>[property:Integer stencilFail]</h3>
......
......@@ -108,6 +108,11 @@
Whether rendering this material has any effect on the stencil buffer. Default is *false*.
</p>
<h3>[property:Boolean stencilWriteMask]</h3>
<p>
The bit mask to use when writing to the stencil buffer. Default is *0xFF*.
</p>
<h3>[property:Boolean stencilFunc]</h3>
<p>
The stencil comparison function to use. Default is [page:Materials AlwaysStencilFunc]. See stencil function [page:Materials constants] for all possible values.
......@@ -118,9 +123,9 @@ The stencil comparison function to use. Default is [page:Materials AlwaysStencil
The value to use when performing stencil comparisons or stencil operations. Default is *0*.
</p>
<h3>[property:Boolean stencilMask]</h3>
<h3>[property:Boolean stencilFuncMask]</h3>
<p>
The bit mask to use when comparing against or writing to the stencil buffer. Default is *0xFF*.
The bit mask to use when comparing against the stencil buffer. Default is *0xFF*.
</p>
<h3>[property:Integer stencilFail]</h3>
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<p class="desc">
Can be used to orient the camera based on the mobile device's orientation.
</p>
<h2>Example</h2>
<p>[example:misc_controls_deviceorientation misc / controls / deviceorientation ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Camera object] )</h3>
<p>
<p>
[page:Camera object]: The camera to be controlled.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Properties</h2>
<h3>[property:Number alphaOffset]</h3>
<p>
The alpha offset in radians. Default is *0*.
</p>
<h3>[property:Object deviceOrientation]</h3>
<p>
The current *deviceorientation* event object.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h3>[property:Camera object]</h3>
<p>
The camera to be controlled.
</p>
<h3>[property:Number screenOrientation]</h3>
<p>
The orientation in degrees (in 90-degree increments) of the viewport relative to the device's natural orientation. Default is *0*.
</p>
<h2>Methods</h2>
<h3>[method:null connect] ()</h3>
<p>
Adds the event listeners of the controls and enables it.
</p>
<h3>[method:null disconnect] ()</h3>
<p>
Removes the event listeners of the controls and disables it.
</p>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null update] ()</h3>
<p>
Updates the controls. Usually called in the animation loop.
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/DeviceOrientationControls.js examples/js/controls/DeviceOrientationControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:EventDispatcher] &rarr;
<h1>[name]</h1>
<p class="desc">
This class can be used to provide a drag'n'drop interaction.
</p>
<h2>Example</h2>
<p>[example:misc_controls_drag misc / controls / drag ]</p>
<code>
var controls = new THREE.DragControls( objects, camera, renderer.domElement );
// add event listener to highlight dragged objects
controls.addEventListener( 'dragstart', function ( event ) {
event.object.material.emissive.set( 0xaaaaaa );
} );
controls.addEventListener( 'dragend', function ( event ) {
event.object.material.emissive.set( 0x000000 );
} );
</code>
<h2>Constructor</h2>
<h3>[name]( [param:Array objects], [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Array objects]: An array of draggable 3D objects.
</p>
<p>
[page:Camera camera]: The camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: The HTML element used for event listeners.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>dragstart</h3>
<p>
Fires when the user starts to drag a 3D object.
</p>
<h3>drag</h3>
<p>
Fires when the user drags a 3D object.
</p>
<h3>dragend</h3>
<p>
Fires when the user has finished dragging a 3D object.
</p>
<h3>hoveron</h3>
<p>
Fires when the pointer is moved onto a 3D object, or onto one of its children.
</p>
<h3>hoveroff</h3>
<p>
Fires when the pointer is moved out of a 3D object.
</p>
<h2>Properties</h2>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h2>Methods</h2>
<p>See the base [page:EventDispatcher] class for common methods.</p>
<h3>[method:null activate] ()</h3>
<p>
Adds the event listeners of the controls.
</p>
<h3>[method:null deactivate] ()</h3>
<p>
Removes the event listeners of the controls.
</p>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/DragControls.js examples/js/controls/DragControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<p class="desc">
This class is an alternative implementation of [page:FlyControls].
</p>
<h2>Example</h2>
<p>[example:webgl_geometry_terrain webgl / geometry / terrain ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Camera object]: The camera to be controlled.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Properties</h2>
<h3>[property:Boolean activeLook]</h3>
<p>
Whether or not it's possible to look around. Default is *true*.
</p>
<h3>[property:Boolean autoForward]</h3>
<p>
Whether or not the camera is automatically moved forward. Default is *false*.
</p>
<h3>[property:Boolean constrainVertical]</h3>
<p>
Whether or not looking around is vertically constrained by [[page:.verticalMin], [page:.verticalMax]]. Default is *false*.
</p>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled. Default is *true*.
</p>
<h3>[property:Number heightCoef]</h3>
<p>
Determines how much faster the camera moves when it's y-component is near [page:.heightMax]. Default is *1*.
</p>
<h3>[property:Number heightMax]</h3>
<p>
Upper camera height limit used for movement speed adjusment. Default is *1*.
</p>
<h3>[property:Number heightMin]</h3>
<p>
Lower camera height limit used for movement speed adjusment. Default is *0*.
</p>
<h3>[property:Boolean heightSpeed]</h3>
<p>
Whether or not the camera's height influences the forward movement speed. Default is *false*.
Use the properties [page:.heightCoef], [page:.heightMin] and [page:.heightMax] for configuration.
</p>
<h3>[property:Boolean lookVertical]</h3>
<p>
Whether or not it's possible to vertically look around. Default is *true*.
</p>
<h3>[property:Number lookSpeed]</h3>
<p>
The look around speed. Default is *0.005*.
</p>
<h3>[property:Boolean mouseDragOn]</h3>
<p>
Whether or not the mouse is pressed down. Read-only property.
</p>
<h3>[property:Number movementSpeed]</h3>
<p>
The movement speed. Default is *1*.
</p>
<h3>[property:Camera object]</h3>
<p>
The camera to be controlled.
</p>
<h3>[property:Number verticalMax]</h3>
<p>
How far you can vertically look around, upper limit. Range is 0 to Math.PI radians. Default is *Math.PI*.
</p>
<h3>[property:Number verticalMin]</h3>
<p>
How far you can vertically look around, lower limit. Range is 0 to Math.PI radians. Default is *0*.
</p>
<h2>Methods</h2>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null handleResize] ()</h3>
<p>
Should be called if the application window is resized.
</p>
<h3>[method:FirstPersonControls lookAt]( [param:Vector3 vector] )<br />
[method:FirstPersonControls lookAt]( [param:Float x], [param:Float y], [param:Float z] )</h3>
<p>
<p>
<p>
vector - A vector representing the target position.
</p>
<p>
Optionally, the x, y, z components of the world space position.
</p>
</p>
<p>
Ensures the controls orient the camera towards the defined target position.
</p>
</p>
<h3>[method:null update] ( [param:Number delta] )</h3>
<p>
<p>
[page:Number delta]: Time delta value.
</p>
<p>
Updates the controls. Usually called in the animation loop.
</p>
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/FirstPersonControls.js examples/js/controls/FirstPersonControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<p class="desc">
[name] enables a navigation similar to fly modes in DCC tools like Blender. You can arbitrarily transform the camera in
3D space without any limitations (e.g. focus on a specific target).
</p>
<h2>Example</h2>
<p>[example:misc_controls_fly misc / controls / fly ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Camera object]: The camera to be controlled.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Properties</h2>
<h3>[property:Boolean autoForward]</h3>
<p>
If set to *true*, the camera automatically moves forward (and does not stop) when initially translated. Default is *false*.
</p>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Boolean dragToLook]</h3>
<p>
If set to *true*, you can only look around by performing a drag interaction. Default is *false*.
</p>
<h3>[property:Number movementSpeed]</h3>
<p>
The movement speed. Default is *1*.
</p>
<h3>[property:Camera object]</h3>
<p>
The camera to be controlled.
</p>
<h3>[property:Number rollSpeed]</h3>
<p>
The rotation speed. Default is *0.005*.
</p>
<h2>Methods</h2>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null update] ( [param:Number delta] )</h3>
<p>
<p>
[page:Number delta]: Time delta value.
</p>
<p>
Updates the controls. Usually called in the animation loop.
</p>
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/FlyControls.js examples/js/controls/FlyControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:EventDispatcher] &rarr;
<h1>[name]</h1>
<p class="desc">
<p>
This class is a special version of [page:TrackballControls] which supports orthographic cameras.
</p>
</p>
<h2>Example</h2>
<p>[example:misc_controls_trackball_orthographic misc / controls / trackball / orthographic ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:OrthographicCamera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:OrthographicCamera camera]: The orthographic camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>change</h3>
<p>
Fires when the camera has been transformed by the controls.
</p>
<h3>start</h3>
<p>
Fires when an interaction (e.g. touch) was initiated.
</p>
<h3>end</h3>
<p>
Fires when an interaction has finished.
</p>
<h2>Properties</h2>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Number dynamicDampingFactor]</h3>
<p>
Defines the intensity of damping. Only considered if [page:.staticMoving staticMoving] is set to *false*. Default is *0.2*.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h3>[property:Array keys]</h3>
<p>
This array holds keycodes for controlling interactions.
<ul>
<li>When the first defined key is pressed, all mouse interactions (left, middle, right) performs orbiting.</li>
<li>When the second defined key is pressed, all mouse interactions (left, middle, right) performs zooming.</li>
<li>When the third defined key is pressed, all mouse interactions (left, middle, right) performs panning.</li>
</ul>
Default is *65, 83, 68* which represents A, S, D.
</p>
<h3>[property:Boolean noPan]</h3>
<p>
Whether or not panning is disabled. Default is *false*.
</p>
<h3>[property:Boolean noRoll]</h3>
<p>
Whether or not rolling is disabled. Default is *false*.
</p>
<h3>[property:Boolean noRotate]</h3>
<p>
Whether or not rotation is disabled. Default is *false*.
</p>
<h3>[property:Boolean noZoom]</h3>
<p>
Whether or not zooming is disabled. Default is *false*.
</p>
<h3>[property:OrthographicCamera object]</h3>
<p>
The camera being controlled.
</p>
<h3>[property:Number panSpeed]</h3>
<p>
The zoom speed. Default is *0.3*.
</p>
<h3>[property:Number rotateSpeed]</h3>
<p>
The rotation speed. Default is *1.0*.
</p>
<h3>[property:Object screen]</h3>
<p>
Represents the properties of the screen. Automatically set when [page:.handleResize handleResize]() is called.
<ul>
<li>left: Represents the offset in pixels to the screen's left boundary.</li>
<li>top: Represents the offset in pixels to the screen's top boundary.</li>
<li>width: Represents the screen width in pixels.</li>
<li>height: Represents the screen height in pixels.</li>
</ul>
</p>
<h3>[property:Boolean staticMoving]</h3>
<p>
Whether or not damping is disabled. Default is *false*.
</p>
<h3>[property:Number zoomSpeed]</h3>
<p>
The zoom speed. Default is *1.2*.
</p>
<h2>Methods</h2>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null handleResize] ()</h3>
<p>
Should be called if the application window is resized.
</p>
<h3>[method:null panCamera] ()</h3>
<p>
Performs panning if necessary. Called by [page:.update update]().
</p>
<h3>[method:null reset] ()</h3>
<p>
Resets the controls to its initial state.
</p>
<h3>[method:null rotateCamera] ()</h3>
<p>
Rotates the camera if necessary. Called by [page:.update update]().
</p>
<h3>[method:null update] ()</h3>
<p>
Updates the controls. Usually called in the animation loop.
</p>
<h3>[method:null zoomCamera] ()</h3>
<p>
Performs zooming if necessary. Called by [page:.update update]().
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TrackballControls.js examples/js/controls/TrackballControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:EventDispatcher] &rarr;
<h1>[name]</h1>
<p class="desc">
The implementation of this class is based on the [link:https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API Pointer Lock API].
[name] is a perfect choice for first person 3D games.
</p>
<h2>Example</h2>
<p>[example:misc_controls_pointerlock misc / controls / pointerlock ]</p>
<code>
var controls = new PointerLockControls( camera );
// add event listener to show/hide a UI (e.g. the game's menu)
controls.addEventListener( 'lock', function () {
menu.style.display = 'none';
} );
controls.addEventListener( 'unlock', function () {
menu.style.display = 'block';
} );
</code>
<h2>Constructor</h2>
<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Camera camera]: The camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the document's body.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>change</h3>
<p>
Fires when the user moves the mouse.
</p>
<h3>lock</h3>
<p>
Fires when the pointer lock status is "locked" (in other words: the mouse is captured).
</p>
<h3>unlock</h3>
<p>
Fires when the pointer lock status is "unlocked" (in other words: the mouse is not captured anymore).
</p>
<h2>Properties</h2>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the document's body.
</p>
<h3>[property:Boolean isLocked]</h3>
<p>
Whether or not the controls are locked.
</p>
<h2>Methods</h2>
<p>See the base [page:EventDispatcher] class for common methods.</p>
<h3>[method:null connect] ()</h3>
<p>
Adds the event listeners of the controls.
</p>
<h3>[method:null disconnect] ()</h3>
<p>
Removes the event listeners of the controls.
</p>
<h3>[method:Vector3 getDirection] ( [param:Vector3 target] )</h3>
<p>
<p>
[page:Vector3 target]: The target vector.
</p>
<p>
Returns the look direction of the camera.
</p>
</p>
<h3>[method:null lock] ()</h3>
<p>
Activates the pointer lock.
</p>
<h3>[method:null moveForward] ( [param:Number distance] )</h3>
<p>
<p>
[page:Number distance]: The signed distance.
</p>
<p>
Moves the camera forward parallel to the xz-plane. Assumes camera.up is y-up.
</p>
</p>
<h3>[method:null moveRight] ( [param:Number distance] )</h3>
<p>
<p>
[page:Number distance]: The signed distance.
</p>
<p>
Moves the camera sidewards parallel to the xz-plane.
</p>
</p>
<h3>[method:null unlock] ()</h3>
<p>
Exits the pointer lock.
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/PointerLockControls.js examples/js/controls/PointerLockControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:EventDispatcher] &rarr;
<h1>[name]</h1>
<p class="desc">
<p>
[name] is similar to [page:OrbitControls]. However, it does not maintain a constant camera [page:Object3D.up up] vector.
That means if the camera orbits over the “north” and “south” poles, it does not flip to stay "right side up".
</p>
<p>
Notice that [name] can only be used with a perspective camera. Use [page:OrthographicTrackballControls] when working with an orthographic camera.
</p>
</p>
<h2>Example</h2>
<p>[example:misc_controls_trackball misc / controls / trackball ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:PerspectiveCamera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:PerspectiveCamera camera]: The perspective camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>change</h3>
<p>
Fires when the camera has been transformed by the controls.
</p>
<h3>start</h3>
<p>
Fires when an interaction (e.g. touch) was initiated.
</p>
<h3>end</h3>
<p>
Fires when an interaction has finished.
</p>
<h2>Properties</h2>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Number dynamicDampingFactor]</h3>
<p>
Defines the intensity of damping. Only considered if [page:.staticMoving staticMoving] is set to *false*. Default is *0.2*.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h3>[property:Array keys]</h3>
<p>
This array holds keycodes for controlling interactions.
<ul>
<li>When the first defined key is pressed, all mouse interactions (left, middle, right) performs orbiting.</li>
<li>When the second defined key is pressed, all mouse interactions (left, middle, right) performs zooming.</li>
<li>When the third defined key is pressed, all mouse interactions (left, middle, right) performs panning.</li>
</ul>
Default is *65, 83, 68* which represents A, S, D.
</p>
<h3>[property:Number maxDistance]</h3>
<p>
How far you can zoom in. Default is *Infinity*.
</p>
<h3>[property:Number minDistance]</h3>
<p>
How far you can zoom in. Default is *0*.
</p>
<h3>
[property:Object mouseButtons]</h3>
<p>
This object contains references to the mouse actions used by the controls.
<ul>
<li>.LEFT is assinged with *THREE.MOUSE.ROTATE*</li>
<li>.MIDDLE is assinged with *THREE.MOUSE.ZOOM*</li>
<li>.RIGHT is assinged with *THREE.MOUSE.PAN*</li>
</ul>
</p>
<h3>[property:Boolean noPan]</h3>
<p>
Whether or not panning is disabled. Default is *false*.
</p>
<h3>[property:Boolean noRotate]</h3>
<p>
Whether or not rotation is disabled. Default is *false*.
</p>
<h3>[property:Boolean noZoom]</h3>
<p>
Whether or not zooming is disabled. Default is *false*.
</p>
<h3>[property:PerspectiveCamera object]</h3>
<p>
The camera being controlled.
</p>
<h3>[property:Number panSpeed]</h3>
<p>
The zoom speed. Default is *0.3*.
</p>
<h3>[property:Number rotateSpeed]</h3>
<p>
The rotation speed. Default is *1.0*.
</p>
<h3>[property:Object screen]</h3>
<p>
Represents the properties of the screen. Automatically set when [page:.handleResize handleResize]() is called.
<ul>
<li>left: Represents the offset in pixels to the screen's left boundary.</li>
<li>top: Represents the offset in pixels to the screen's top boundary.</li>
<li>width: Represents the screen width in pixels.</li>
<li>height: Represents the screen height in pixels.</li>
</ul>
</p>
<h3>[property:Boolean staticMoving]</h3>
<p>
Whether or not damping is disabled. Default is *false*.
</p>
<h3>[property:Number zoomSpeed]</h3>
<p>
The zoom speed. Default is *1.2*.
</p>
<h2>Methods</h2>
<h3>[method:null checkDistances] ()</h3>
<p>
Ensures the controls stay in the range [minDistance, maxDistance]. Called by [page:.update update]().
</p>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null handleResize] ()</h3>
<p>
Should be called if the application window is resized.
</p>
<h3>[method:null panCamera] ()</h3>
<p>
Performs panning if necessary. Called by [page:.update update]().
</p>
<h3>[method:null reset] ()</h3>
<p>
Resets the controls to its initial state.
</p>
<h3>[method:null rotateCamera] ()</h3>
<p>
Rotates the camera if necessary. Called by [page:.update update]().
</p>
<h3>[method:null update] ()</h3>
<p>
Updates the controls. Usually called in the animation loop.
</p>
<h3>[method:null zoomCamera] ()</h3>
<p>
Performs zooming if necessary. Called by [page:.update update]().
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TrackballControls.js examples/js/controls/TrackballControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<p class="desc">
This class can be used to transform objects in 3D space by adapting a similar interaction model of DCC tools like Blender.
Unlike other controls, it is not intended to transform the scene's camera.
</p>
<h2>Example</h2>
<p>[example:misc_controls_transform misc / controls / transform ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Camera camera]: The camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>change</h3>
<p>
Fires if any type of change (object or property change) is performed. Property changes
are separate events you can add event listeners to. The event type is "propertyname-changed".
</p>
<h3>mouseDown</h3>
<p>
Fires if a pointer (mouse/touch) becomes active.
</p>
<h3>mouseUp</h3>
<p>
Fires if a pointer (mouse/touch) is no longer active.
</p>
<h3>objectChange</h3>
<p>
Fires if the controlled 3D object is changed.
</p>
<h2>Properties</h2>
<p>See the base [page:Object3D] class for common properties.</p>
<h3>[property:String axis]</h3>
<p>
The current transformation axis.
</p>
<h3>[property:Camera camera]</h3>
<p>
The camera of the rendered scene.
</p>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Boolean dragging]</h3>
<p>
Whether or not dragging is currently performed. Read-only property.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h3>[property:String mode]</h3>
<p>
The current transformation mode. Possible values are "translate", "rotate" and "scale". Default is *translate*.
</p>
<h3>[property:Object3D object]</h3>
<p>
The 3D object being controlled.
</p>
<h3>[property:Number rotationSnap]</h3>
<p>
By default, 3D objects are continously rotated. If you set this property to a numeric value (radians), you can define in which
steps the 3D object should be rotated. Deault is *null*.
</p>
<h3>[property:Boolean showX]</h3>
<p>
Whether or not the x-axis helper should be visible. Default is *true*.
</p>
<h3>[property:Boolean showY]</h3>
<p>
Whether or not the y-axis helper should be visible. Default is *true*.
</p>
<h3>[property:Boolean showZ]</h3>
<p>
Whether or not the z-axis helper should be visible. Default is *true*.
</p>
<h3>[property:Number size]</h3>
<p>
The size of the helper UI (axes/planes). Default is *1*.
</p>
<h3>[property:String space]</h3>
<p>
Defines in which coordinate space transformations should be performed. Possible values are "world" and "local". Default is *world*.
</p>
<h3>[property:Number translationSnap]</h3>
<p>
By default, 3D objects are continously translated. If you set this property to a numeric value (world units), you can define in which
steps the 3D object should be translated. Deault is *null*.
</p>
<h2>Methods</h2>
<p>See the base [page:Object3D] class for common methods.</p>
<h3>[method:TransformControls attach] ( [param:Object3D object] )</h3>
<p>
<p>
[page:Object3D object]: The 3D object that should be transformed.
</p>
<p>
Sets the 3D object that should be transformed and ensures the controls UI is visible.
</p>
</p>
<h3>[method:TransformControls detach] ()</h3>
<p>
Removes the current 3D object from the controls and makes the helper UI is invisible.
</p>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:String getMode] ()</h3>
<p>
Returns the transformation mode.
</p>
<h3>[method:null setMode] ( [param:String mode] )</h3>
<p>
<p>
[page:String mode]: The transformation mode.
</p>
<p>
Sets the transformation mode.
</p>
</p>
<h3>[method:null setRotationSnap] ( [param:Number rotationSnap] )</h3>
<p>
<p>
[page:Number rotationSnap]: The rotation snap.
</p>
<p>
Sets the rotation snap.
</p>
</p>
<h3>[method:null setSize] ( [param:Number size] )</h3>
<p>
<p>
[page:Number size]: The size of the helper UI.
</p>
<p>
Sets the size of the helper UI.
</p>
</p>
<h3>[method:null setSpace] ( [param:String space] )</h3>
<p>
<p>
[page:String space]: The coordinate space in which transformations are applied.
</p>
<p>
Sets the coordinate space in which transformations are applied.
</p>
</p>
<h3>[method:null setTranslationSnap] ( [param:Number translationSnap] )</h3>
<p>
<p>
[page:Number translationSnap]: The translation snap.
</p>
<p>
Sets the translation snap.
</p>
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TransformControls.js examples/js/controls/TransformControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<p class="desc">
Can be used to orient the camera based on the mobile device's orientation.
</p>
<h2>Example</h2>
<p>[example:misc_controls_deviceorientation misc / controls / deviceorientation ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Camera object] )</h3>
<p>
<p>
[page:Camera object]: The camera to be controlled.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Properties</h2>
<h3>[property:Number alphaOffset]</h3>
<p>
The alpha offset in radians. Default is *0*.
</p>
<h3>[property:Object deviceOrientation]</h3>
<p>
The current *deviceorientation* event object.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h3>[property:Camera object]</h3>
<p>
The camera to be controlled.
</p>
<h3>[property:Number screenOrientation]</h3>
<p>
The orientation in degrees (in 90-degree increments) of the viewport relative to the device's natural orientation. Default is *0*.
</p>
<h2>Methods</h2>
<h3>[method:null connect] ()</h3>
<p>
Adds the event listeners of the controls and enables it.
</p>
<h3>[method:null disconnect] ()</h3>
<p>
Removes the event listeners of the controls and disables it.
</p>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null update] ()</h3>
<p>
Updates the controls. Usually called in the animation loop.
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/DeviceOrientationControls.js examples/js/controls/DeviceOrientationControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:EventDispatcher] &rarr;
<h1>[name]</h1>
<p class="desc">
This class can be used to provide a drag'n'drop interaction.
</p>
<h2>Example</h2>
<p>[example:misc_controls_drag misc / controls / drag ]</p>
<code>
var controls = new THREE.DragControls( objects, camera, renderer.domElement );
// add event listener to highlight dragged objects
controls.addEventListener( 'dragstart', function ( event ) {
event.object.material.emissive.set( 0xaaaaaa );
} );
controls.addEventListener( 'dragend', function ( event ) {
event.object.material.emissive.set( 0x000000 );
} );
</code>
<h2>Constructor</h2>
<h3>[name]( [param:Array objects], [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Array objects]: An array of draggable 3D objects.
</p>
<p>
[page:Camera camera]: The camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: The HTML element used for event listeners.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>dragstart</h3>
<p>
Fires when the user starts to drag a 3D object.
</p>
<h3>drag</h3>
<p>
Fires when the user drags a 3D object.
</p>
<h3>dragend</h3>
<p>
Fires when the user has finished dragging a 3D object.
</p>
<h3>hoveron</h3>
<p>
Fires when the pointer is moved onto a 3D object, or onto one of its children.
</p>
<h3>hoveroff</h3>
<p>
Fires when the pointer is moved out of a 3D object.
</p>
<h2>Properties</h2>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h2>Methods</h2>
<p>See the base [page:EventDispatcher] class for common methods.</p>
<h3>[method:null activate] ()</h3>
<p>
Adds the event listeners of the controls.
</p>
<h3>[method:null deactivate] ()</h3>
<p>
Removes the event listeners of the controls.
</p>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/DragControls.js examples/js/controls/DragControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<p class="desc">
This class is an alternative implementation of [page:FlyControls].
</p>
<h2>Example</h2>
<p>[example:webgl_geometry_terrain webgl / geometry / terrain ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Camera object]: The camera to be controlled.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Properties</h2>
<h3>[property:Boolean activeLook]</h3>
<p>
Whether or not it's possible to look around. Default is *true*.
</p>
<h3>[property:Boolean autoForward]</h3>
<p>
Whether or not the camera is automatically moved forward. Default is *false*.
</p>
<h3>[property:Boolean constrainVertical]</h3>
<p>
Whether or not looking around is vertically constrained by [[page:.verticalMin], [page:.verticalMax]]. Default is *false*.
</p>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled. Default is *true*.
</p>
<h3>[property:Number heightCoef]</h3>
<p>
Determines how much faster the camera moves when it's y-component is near [page:.heightMax]. Default is *1*.
</p>
<h3>[property:Number heightMax]</h3>
<p>
Upper camera height limit used for movement speed adjusment. Default is *1*.
</p>
<h3>[property:Number heightMin]</h3>
<p>
Lower camera height limit used for movement speed adjusment. Default is *0*.
</p>
<h3>[property:Boolean heightSpeed]</h3>
<p>
Whether or not the camera's height influences the forward movement speed. Default is *false*.
Use the properties [page:.heightCoef], [page:.heightMin] and [page:.heightMax] for configuration.
</p>
<h3>[property:Boolean lookVertical]</h3>
<p>
Whether or not it's possible to vertically look around. Default is *true*.
</p>
<h3>[property:Number lookSpeed]</h3>
<p>
The look around speed. Default is *0.005*.
</p>
<h3>[property:Boolean mouseDragOn]</h3>
<p>
Whether or not the mouse is pressed down. Read-only property.
</p>
<h3>[property:Number movementSpeed]</h3>
<p>
The movement speed. Default is *1*.
</p>
<h3>[property:Camera object]</h3>
<p>
The camera to be controlled.
</p>
<h3>[property:Number verticalMax]</h3>
<p>
How far you can vertically look around, upper limit. Range is 0 to Math.PI radians. Default is *Math.PI*.
</p>
<h3>[property:Number verticalMin]</h3>
<p>
How far you can vertically look around, lower limit. Range is 0 to Math.PI radians. Default is *0*.
</p>
<h2>Methods</h2>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null handleResize] ()</h3>
<p>
Should be called if the application window is resized.
</p>
<h3>[method:FirstPersonControls lookAt]( [param:Vector3 vector] )<br />
[method:FirstPersonControls lookAt]( [param:Float x], [param:Float y], [param:Float z] )</h3>
<p>
<p>
<p>
vector - A vector representing the target position.
</p>
<p>
Optionally, the x, y, z components of the world space position.
</p>
</p>
<p>
Ensures the controls orient the camera towards the defined target position.
</p>
</p>
<h3>[method:null update] ( [param:Number delta] )</h3>
<p>
<p>
[page:Number delta]: Time delta value.
</p>
<p>
Updates the controls. Usually called in the animation loop.
</p>
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/FirstPersonControls.js examples/js/controls/FirstPersonControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<p class="desc">
[name] enables a navigation similar to fly modes in DCC tools like Blender. You can arbitrarily transform the camera in
3D space without any limitations (e.g. focus on a specific target).
</p>
<h2>Example</h2>
<p>[example:misc_controls_fly misc / controls / fly ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Camera object]: The camera to be controlled.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Properties</h2>
<h3>[property:Boolean autoForward]</h3>
<p>
If set to *true*, the camera automatically moves forward (and does not stop) when initially translated. Default is *false*.
</p>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Boolean dragToLook]</h3>
<p>
If set to *true*, you can only look around by performing a drag interaction. Default is *false*.
</p>
<h3>[property:Number movementSpeed]</h3>
<p>
The movement speed. Default is *1*.
</p>
<h3>[property:Camera object]</h3>
<p>
The camera to be controlled.
</p>
<h3>[property:Number rollSpeed]</h3>
<p>
The rotation speed. Default is *0.005*.
</p>
<h2>Methods</h2>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null update] ( [param:Number delta] )</h3>
<p>
<p>
[page:Number delta]: Time delta value.
</p>
<p>
Updates the controls. Usually called in the animation loop.
</p>
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/FlyControls.js examples/js/controls/FlyControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:EventDispatcher] &rarr;
<h1>[name]</h1>
<p class="desc">
<p>
This class is a special version of [page:TrackballControls] which supports orthographic cameras.
</p>
</p>
<h2>Example</h2>
<p>[example:misc_controls_trackball_orthographic misc / controls / trackball / orthographic ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:OrthographicCamera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:OrthographicCamera camera]: The orthographic camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>change</h3>
<p>
Fires when the camera has been transformed by the controls.
</p>
<h3>start</h3>
<p>
Fires when an interaction (e.g. touch) was initiated.
</p>
<h3>end</h3>
<p>
Fires when an interaction has finished.
</p>
<h2>Properties</h2>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Number dynamicDampingFactor]</h3>
<p>
Defines the intensity of damping. Only considered if [page:.staticMoving staticMoving] is set to *false*. Default is *0.2*.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h3>[property:Array keys]</h3>
<p>
This array holds keycodes for controlling interactions.
<ul>
<li>When the first defined key is pressed, all mouse interactions (left, middle, right) performs orbiting.</li>
<li>When the second defined key is pressed, all mouse interactions (left, middle, right) performs zooming.</li>
<li>When the third defined key is pressed, all mouse interactions (left, middle, right) performs panning.</li>
</ul>
Default is *65, 83, 68* which represents A, S, D.
</p>
<h3>[property:Boolean noPan]</h3>
<p>
Whether or not panning is disabled. Default is *false*.
</p>
<h3>[property:Boolean noRoll]</h3>
<p>
Whether or not rolling is disabled. Default is *false*.
</p>
<h3>[property:Boolean noRotate]</h3>
<p>
Whether or not rotation is disabled. Default is *false*.
</p>
<h3>[property:Boolean noZoom]</h3>
<p>
Whether or not zooming is disabled. Default is *false*.
</p>
<h3>[property:OrthographicCamera object]</h3>
<p>
The camera being controlled.
</p>
<h3>[property:Number panSpeed]</h3>
<p>
The zoom speed. Default is *0.3*.
</p>
<h3>[property:Number rotateSpeed]</h3>
<p>
The rotation speed. Default is *1.0*.
</p>
<h3>[property:Object screen]</h3>
<p>
Represents the properties of the screen. Automatically set when [page:.handleResize handleResize]() is called.
<ul>
<li>left: Represents the offset in pixels to the screen's left boundary.</li>
<li>top: Represents the offset in pixels to the screen's top boundary.</li>
<li>width: Represents the screen width in pixels.</li>
<li>height: Represents the screen height in pixels.</li>
</ul>
</p>
<h3>[property:Boolean staticMoving]</h3>
<p>
Whether or not damping is disabled. Default is *false*.
</p>
<h3>[property:Number zoomSpeed]</h3>
<p>
The zoom speed. Default is *1.2*.
</p>
<h2>Methods</h2>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null handleResize] ()</h3>
<p>
Should be called if the application window is resized.
</p>
<h3>[method:null panCamera] ()</h3>
<p>
Performs panning if necessary. Called by [page:.update update]().
</p>
<h3>[method:null reset] ()</h3>
<p>
Resets the controls to its initial state.
</p>
<h3>[method:null rotateCamera] ()</h3>
<p>
Rotates the camera if necessary. Called by [page:.update update]().
</p>
<h3>[method:null update] ()</h3>
<p>
Updates the controls. Usually called in the animation loop.
</p>
<h3>[method:null zoomCamera] ()</h3>
<p>
Performs zooming if necessary. Called by [page:.update update]().
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TrackballControls.js examples/js/controls/TrackballControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:EventDispatcher] &rarr;
<h1>[name]</h1>
<p class="desc">
The implementation of this class is based on the [link:https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API Pointer Lock API].
[name] is a perfect choice for first person 3D games.
</p>
<h2>Example</h2>
<p>[example:misc_controls_pointerlock misc / controls / pointerlock ]</p>
<code>
var controls = new PointerLockControls( camera );
// add event listener to show/hide a UI (e.g. the game's menu)
controls.addEventListener( 'lock', function () {
menu.style.display = 'none';
} );
controls.addEventListener( 'unlock', function () {
menu.style.display = 'block';
} );
</code>
<h2>Constructor</h2>
<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Camera camera]: The camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the document's body.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>change</h3>
<p>
Fires when the user moves the mouse.
</p>
<h3>lock</h3>
<p>
Fires when the pointer lock status is "locked" (in other words: the mouse is captured).
</p>
<h3>unlock</h3>
<p>
Fires when the pointer lock status is "unlocked" (in other words: the mouse is not captured anymore).
</p>
<h2>Properties</h2>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the document's body.
</p>
<h3>[property:Boolean isLocked]</h3>
<p>
Whether or not the controls are locked.
</p>
<h2>Methods</h2>
<p>See the base [page:EventDispatcher] class for common methods.</p>
<h3>[method:null connect] ()</h3>
<p>
Adds the event listeners of the controls.
</p>
<h3>[method:null disconnect] ()</h3>
<p>
Removes the event listeners of the controls.
</p>
<h3>[method:Vector3 getDirection] ( [param:Vector3 target] )</h3>
<p>
<p>
[page:Vector3 target]: The target vector.
</p>
<p>
Returns the look direction of the camera.
</p>
</p>
<h3>[method:null lock] ()</h3>
<p>
Activates the pointer lock.
</p>
<h3>[method:null moveForward] ( [param:Number distance] )</h3>
<p>
<p>
[page:Number distance]: The signed distance.
</p>
<p>
Moves the camera forward parallel to the xz-plane. Assumes camera.up is y-up.
</p>
</p>
<h3>[method:null moveRight] ( [param:Number distance] )</h3>
<p>
<p>
[page:Number distance]: The signed distance.
</p>
<p>
Moves the camera sidewards parallel to the xz-plane.
</p>
</p>
<h3>[method:null unlock] ()</h3>
<p>
Exits the pointer lock.
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/PointerLockControls.js examples/js/controls/PointerLockControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:EventDispatcher] &rarr;
<h1>[name]</h1>
<p class="desc">
<p>
[name] is similar to [page:OrbitControls]. However, it does not maintain a constant camera [page:Object3D.up up] vector.
That means if the camera orbits over the “north” and “south” poles, it does not flip to stay "right side up".
</p>
<p>
Notice that [name] can only be used with a perspective camera. Use [page:OrthographicTrackballControls] when working with an orthographic camera.
</p>
</p>
<h2>Example</h2>
<p>[example:misc_controls_trackball misc / controls / trackball ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:PerspectiveCamera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:PerspectiveCamera camera]: The perspective camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>change</h3>
<p>
Fires when the camera has been transformed by the controls.
</p>
<h3>start</h3>
<p>
Fires when an interaction (e.g. touch) was initiated.
</p>
<h3>end</h3>
<p>
Fires when an interaction has finished.
</p>
<h2>Properties</h2>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Number dynamicDampingFactor]</h3>
<p>
Defines the intensity of damping. Only considered if [page:.staticMoving staticMoving] is set to *false*. Default is *0.2*.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h3>[property:Array keys]</h3>
<p>
This array holds keycodes for controlling interactions.
<ul>
<li>When the first defined key is pressed, all mouse interactions (left, middle, right) performs orbiting.</li>
<li>When the second defined key is pressed, all mouse interactions (left, middle, right) performs zooming.</li>
<li>When the third defined key is pressed, all mouse interactions (left, middle, right) performs panning.</li>
</ul>
Default is *65, 83, 68* which represents A, S, D.
</p>
<h3>[property:Number maxDistance]</h3>
<p>
How far you can zoom in. Default is *Infinity*.
</p>
<h3>[property:Number minDistance]</h3>
<p>
How far you can zoom in. Default is *0*.
</p>
<h3>
[property:Object mouseButtons]</h3>
<p>
This object contains references to the mouse actions used by the controls.
<ul>
<li>.LEFT is assinged with *THREE.MOUSE.ROTATE*</li>
<li>.MIDDLE is assinged with *THREE.MOUSE.ZOOM*</li>
<li>.RIGHT is assinged with *THREE.MOUSE.PAN*</li>
</ul>
</p>
<h3>[property:Boolean noPan]</h3>
<p>
Whether or not panning is disabled. Default is *false*.
</p>
<h3>[property:Boolean noRotate]</h3>
<p>
Whether or not rotation is disabled. Default is *false*.
</p>
<h3>[property:Boolean noZoom]</h3>
<p>
Whether or not zooming is disabled. Default is *false*.
</p>
<h3>[property:PerspectiveCamera object]</h3>
<p>
The camera being controlled.
</p>
<h3>[property:Number panSpeed]</h3>
<p>
The zoom speed. Default is *0.3*.
</p>
<h3>[property:Number rotateSpeed]</h3>
<p>
The rotation speed. Default is *1.0*.
</p>
<h3>[property:Object screen]</h3>
<p>
Represents the properties of the screen. Automatically set when [page:.handleResize handleResize]() is called.
<ul>
<li>left: Represents the offset in pixels to the screen's left boundary.</li>
<li>top: Represents the offset in pixels to the screen's top boundary.</li>
<li>width: Represents the screen width in pixels.</li>
<li>height: Represents the screen height in pixels.</li>
</ul>
</p>
<h3>[property:Boolean staticMoving]</h3>
<p>
Whether or not damping is disabled. Default is *false*.
</p>
<h3>[property:Number zoomSpeed]</h3>
<p>
The zoom speed. Default is *1.2*.
</p>
<h2>Methods</h2>
<h3>[method:null checkDistances] ()</h3>
<p>
Ensures the controls stay in the range [minDistance, maxDistance]. Called by [page:.update update]().
</p>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:null handleResize] ()</h3>
<p>
Should be called if the application window is resized.
</p>
<h3>[method:null panCamera] ()</h3>
<p>
Performs panning if necessary. Called by [page:.update update]().
</p>
<h3>[method:null reset] ()</h3>
<p>
Resets the controls to its initial state.
</p>
<h3>[method:null rotateCamera] ()</h3>
<p>
Rotates the camera if necessary. Called by [page:.update update]().
</p>
<h3>[method:null update] ()</h3>
<p>
Updates the controls. Usually called in the animation loop.
</p>
<h3>[method:null zoomCamera] ()</h3>
<p>
Performs zooming if necessary. Called by [page:.update update]().
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TrackballControls.js examples/js/controls/TrackballControls.js]
</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<p class="desc">
This class can be used to transform objects in 3D space by adapting a similar interaction model of DCC tools like Blender.
Unlike other controls, it is not intended to transform the scene's camera.
</p>
<h2>Example</h2>
<p>[example:misc_controls_transform misc / controls / transform ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
<p>
<p>
[page:Camera camera]: The camera of the rendered scene.
</p>
<p>
[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
</p>
<p>
Creates a new instance of [name].
</p>
</p>
<h2>Events</h2>
<h3>change</h3>
<p>
Fires if any type of change (object or property change) is performed. Property changes
are separate events you can add event listeners to. The event type is "propertyname-changed".
</p>
<h3>mouseDown</h3>
<p>
Fires if a pointer (mouse/touch) becomes active.
</p>
<h3>mouseUp</h3>
<p>
Fires if a pointer (mouse/touch) is no longer active.
</p>
<h3>objectChange</h3>
<p>
Fires if the controlled 3D object is changed.
</p>
<h2>Properties</h2>
<p>See the base [page:Object3D] class for common properties.</p>
<h3>[property:String axis]</h3>
<p>
The current transformation axis.
</p>
<h3>[property:Camera camera]</h3>
<p>
The camera of the rendered scene.
</p>
<h3>[property:HTMLDOMElement domElement]</h3>
<p>
The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
not set up new event listeners. Default is the whole document.
</p>
<h3>[property:Boolean dragging]</h3>
<p>
Whether or not dragging is currently performed. Read-only property.
</p>
<h3>[property:Boolean enabled]</h3>
<p>
Whether or not the controls are enabled.
</p>
<h3>[property:String mode]</h3>
<p>
The current transformation mode. Possible values are "translate", "rotate" and "scale". Default is *translate*.
</p>
<h3>[property:Object3D object]</h3>
<p>
The 3D object being controlled.
</p>
<h3>[property:Number rotationSnap]</h3>
<p>
By default, 3D objects are continously rotated. If you set this property to a numeric value (radians), you can define in which
steps the 3D object should be rotated. Deault is *null*.
</p>
<h3>[property:Boolean showX]</h3>
<p>
Whether or not the x-axis helper should be visible. Default is *true*.
</p>
<h3>[property:Boolean showY]</h3>
<p>
Whether or not the y-axis helper should be visible. Default is *true*.
</p>
<h3>[property:Boolean showZ]</h3>
<p>
Whether or not the z-axis helper should be visible. Default is *true*.
</p>
<h3>[property:Number size]</h3>
<p>
The size of the helper UI (axes/planes). Default is *1*.
</p>
<h3>[property:String space]</h3>
<p>
Defines in which coordinate space transformations should be performed. Possible values are "world" and "local". Default is *world*.
</p>
<h3>[property:Number translationSnap]</h3>
<p>
By default, 3D objects are continously translated. If you set this property to a numeric value (world units), you can define in which
steps the 3D object should be translated. Deault is *null*.
</p>
<h2>Methods</h2>
<p>See the base [page:Object3D] class for common methods.</p>
<h3>[method:TransformControls attach] ( [param:Object3D object] )</h3>
<p>
<p>
[page:Object3D object]: The 3D object that should be transformed.
</p>
<p>
Sets the 3D object that should be transformed and ensures the controls UI is visible.
</p>
</p>
<h3>[method:TransformControls detach] ()</h3>
<p>
Removes the current 3D object from the controls and makes the helper UI is invisible.
</p>
<h3>[method:null dispose] ()</h3>
<p>
Should be called if the controls is no longer required.
</p>
<h3>[method:String getMode] ()</h3>
<p>
Returns the transformation mode.
</p>
<h3>[method:null setMode] ( [param:String mode] )</h3>
<p>
<p>
[page:String mode]: The transformation mode.
</p>
<p>
Sets the transformation mode.
</p>
</p>
<h3>[method:null setRotationSnap] ( [param:Number rotationSnap] )</h3>
<p>
<p>
[page:Number rotationSnap]: The rotation snap.
</p>
<p>
Sets the rotation snap.
</p>
</p>
<h3>[method:null setSize] ( [param:Number size] )</h3>
<p>
<p>
[page:Number size]: The size of the helper UI.
</p>
<p>
Sets the size of the helper UI.
</p>
</p>
<h3>[method:null setSpace] ( [param:String space] )</h3>
<p>
<p>
[page:String space]: The coordinate space in which transformations are applied.
</p>
<p>
Sets the coordinate space in which transformations are applied.
</p>
</p>
<h3>[method:null setTranslationSnap] ( [param:Number translationSnap] )</h3>
<p>
<p>
[page:Number translationSnap]: The translation snap.
</p>
<p>
Sets the translation snap.
</p>
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TransformControls.js examples/js/controls/TransformControls.js]
</p>
</body>
</html>
......@@ -354,7 +354,15 @@ var list = {
},
"Controls": {
"OrbitControls": "examples/en/controls/OrbitControls"
"DeviceOrientationControls": "examples/en/controls/DeviceOrientationControls",
"DragControls": "examples/en/controls/DragControls",
"FirstPersonControls": "examples/en/controls/FirstPersonControls",
"FlyControls": "examples/en/controls/FlyControls",
"OrbitControls": "examples/en/controls/OrbitControls",
"OrthographicTrackballControls": "examples/en/controls/OrthographicTrackballControls",
"PointerLockControls": "examples/en/controls/PointerLockControls",
"TrackballControls": "examples/en/controls/TrackballControls",
"TransformControls": "examples/en/controls/TransformControls"
},
"Geometries": {
......@@ -790,7 +798,15 @@ var list = {
},
"控制": {
"OrbitControls": "examples/zh/controls/OrbitControls"
"DeviceOrientationControls": "examples/zh/controls/DeviceOrientationControls",
"DragControls": "examples/zh/controls/DragControls",
"FirstPersonControls": "examples/zh/controls/FirstPersonControls",
"FlyControls": "examples/zh/controls/FlyControls",
"OrbitControls": "examples/zh/controls/OrbitControls",
"OrthographicTrackballControls": "examples/zh/controls/OrthographicTrackballControls",
"PointerLockControls": "examples/zh/controls/PointerLockControls",
"TrackballControls": "examples/zh/controls/TrackballControls",
"TransformControls": "examples/zh/controls/TransformControls"
},
"几何体": {
......
......@@ -7,8 +7,8 @@
<link rel="apple-touch-icon" href="images/icon.png">
<link rel="manifest" href="manifest.json">
<link rel="shortcut icon" href="../files/favicon.ico" />
<!-- WebXR Device API (For Chrome M76+), expires 09/09/2019 -->
<meta http-equiv="origin-trial" content="Ai1/G787sugfmWtk1xQExa8N6OqwDsJyNn+OwpA1J4PozR1lixRYIQ4Tmp00vrGWS8FQQ2iDyqjwaewrOfYvPAUAAABTeyJvcmlnaW4iOiJodHRwczovL3RocmVlanMub3JnOjQ0MyIsImZlYXR1cmUiOiJXZWJYUkRldmljZU03NiIsImV4cGlyeSI6MTU2ODAyMzQ3OH0=">
<!-- WebXR Device API (For Chrome M76+), expires 10/16/2019 -->
<meta http-equiv="origin-trial" content="AtWCPo0cZgy0zJDSYftemy7eZvmcwR5qy/4osFkMkLZ0ar6OYyKfbu93pjpxiOVzcWNIVxgoWoK8YtxCXeFSqgIAAABTeyJvcmlnaW4iOiJodHRwczovL3RocmVlanMub3JnOjQ0MyIsImZlYXR1cmUiOiJXZWJYUkRldmljZU03NiIsImV4cGlyeSI6MTU3MTE4Mzk5OX0=">
</head>
<body ontouchstart="">
<link rel="stylesheet" href="css/main.css">
......@@ -126,6 +126,7 @@
<script src="js/Sidebar.Geometry.BoxGeometry.js"></script>
<script src="js/Sidebar.Geometry.CircleGeometry.js"></script>
<script src="js/Sidebar.Geometry.CylinderGeometry.js"></script>
<script src="js/Sidebar.Geometry.DodecahedronGeometry.js"></script>
<script src="js/Sidebar.Geometry.ExtrudeGeometry.js"></script>
<script src="js/Sidebar.Geometry.IcosahedronGeometry.js"></script>
<script src="js/Sidebar.Geometry.OctahedronGeometry.js"></script>
......
......@@ -85,6 +85,22 @@ Menubar.Add = function ( editor ) {
} );
options.add( option );
// Dodecahedron
var option = new UI.Row();
option.setClass( 'option' );
option.setTextContent( strings.getKey( 'menubar/add/dodecahedron' ) );
option.onClick( function () {
var geometry = new THREE.DodecahedronBufferGeometry( 1, 0 );
var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
mesh.name = 'Dodecahedron';
editor.execute( new AddObjectCommand( editor, mesh ) );
} );
options.add( option );
// Icosahedron
var option = new UI.Row();
......@@ -162,7 +178,7 @@ Menubar.Add = function ( editor ) {
editor.execute( new AddObjectCommand( editor, mesh ) );
} );
options.add( option )
options.add( option );
// Ring
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.BoxGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.CircleGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.CylinderGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
/**
* @author mrdoob / http://mrdoob.com/
*/
Sidebar.Geometry.DodecahedronGeometry = function ( editor, object ) {
var strings = editor.strings;
var container = new UI.Row();
var geometry = object.geometry;
var parameters = geometry.parameters;
// radius
var radiusRow = new UI.Row();
var radius = new UI.Number( parameters.radius ).onChange( update );
radiusRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/dodecahedron_geometry/radius' ) ).setWidth( '90px' ) );
radiusRow.add( radius );
container.add( radiusRow );
// detail
var detailRow = new UI.Row();
var detail = new UI.Integer( parameters.detail ).setRange( 0, Infinity ).onChange( update );
detailRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/dodecahedron_geometry/detail' ) ).setWidth( '90px' ) );
detailRow.add( detail );
container.add( detailRow );
//
function update() {
editor.execute( new SetGeometryCommand( editor, object, new THREE[ geometry.type ](
radius.getValue(),
detail.getValue()
) ) );
}
return container;
};
Sidebar.Geometry.DodecahedronBufferGeometry = Sidebar.Geometry.DodecahedronGeometry;
......@@ -6,8 +6,6 @@ Sidebar.Geometry.ExtrudeGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.IcosahedronGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......@@ -33,7 +31,6 @@ Sidebar.Geometry.IcosahedronGeometry = function ( editor, object ) {
container.add( detailRow );
//
function update() {
......@@ -43,8 +40,6 @@ Sidebar.Geometry.IcosahedronGeometry = function ( editor, object ) {
detail.getValue()
) ) );
signals.objectChanged.dispatch( object );
}
return container;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.LatheGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.OctahedronGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......@@ -43,8 +41,6 @@ Sidebar.Geometry.OctahedronGeometry = function ( editor, object ) {
detail.getValue()
) ) );
signals.objectChanged.dispatch( object );
}
return container;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.PlaneGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.RingGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.ShapeGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.SphereGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -7,8 +7,6 @@ Sidebar.Geometry.TetrahedronGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......@@ -44,8 +42,6 @@ Sidebar.Geometry.TetrahedronGeometry = function ( editor, object ) {
detail.getValue()
) ) );
signals.objectChanged.dispatch( object );
}
return container;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.TorusGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.TorusKnotGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -6,8 +6,6 @@ Sidebar.Geometry.TubeGeometry = function ( editor, object ) {
var strings = editor.strings;
var signals = editor.signals;
var container = new UI.Row();
var geometry = object.geometry;
......
......@@ -9,9 +9,9 @@ Sidebar.Properties = function ( editor ) {
var container = new UI.TabbedPanel();
container.setId( 'properties' );
container.addPanel( 'object', strings.getKey( 'sidebar/properties/object' ), new Sidebar.Object( editor ) );
container.addPanel( 'geometry', strings.getKey( 'sidebar/properties/geometry' ), new Sidebar.Geometry( editor ) );
container.addPanel( 'material', strings.getKey( 'sidebar/properties/material' ), new Sidebar.Material( editor ) );
container.addTab( 'object', strings.getKey( 'sidebar/properties/object' ), new Sidebar.Object( editor ) );
container.addTab( 'geometry', strings.getKey( 'sidebar/properties/geometry' ), new Sidebar.Geometry( editor ) );
container.addTab( 'material', strings.getKey( 'sidebar/properties/material' ), new Sidebar.Material( editor ) );
return container;
......
......@@ -21,9 +21,9 @@ var Sidebar = function ( editor ) {
new Sidebar.History( editor )
);
container.addPanel( 'scene', strings.getKey( 'sidebar/scene' ), scene );
container.addPanel( 'project', strings.getKey( 'sidebar/project' ), new Sidebar.Project( editor ) );
container.addPanel( 'settings', strings.getKey( 'sidebar/settings' ), settings );
container.addTab( 'scene', strings.getKey( 'sidebar/scene' ), scene );
container.addTab( 'project', strings.getKey( 'sidebar/project' ), new Sidebar.Project( editor ) );
container.addTab( 'settings', strings.getKey( 'sidebar/settings' ), settings );
return container;
......
......@@ -41,6 +41,7 @@ var Strings = function ( config ) {
'menubar/add/cylinder': 'Cylinder',
'menubar/add/ring': 'Ring',
'menubar/add/sphere': 'Sphere',
'menubar/add/dodecahedron': 'Dodecahedron',
'menubar/add/icosahedron': 'Icosahedron',
'menubar/add/octahedron': 'Octahedron',
'menubar/add/tetrahedron': 'Tetrahedron',
......@@ -148,6 +149,9 @@ var Strings = function ( config ) {
'sidebar/geometry/geometry/vertices': 'Vertices',
'sidebar/geometry/geometry/faces': 'Faces',
'sidebar/geometry/dodecahedron_geometry/radius': 'Radius',
'sidebar/geometry/dodecahedron_geometry/detail': 'Detail',
'sidebar/geometry/icosahedron_geometry/radius': 'Radius',
'sidebar/geometry/icosahedron_geometry/detail': 'Detail',
......@@ -338,6 +342,7 @@ var Strings = function ( config ) {
'menubar/add/cylinder': '圆柱体',
'menubar/add/ring': '',
'menubar/add/sphere': '球体',
'menubar/add/dodecahedron': 'Dodecahedron',
'menubar/add/icosahedron': '二十面体',
'menubar/add/octahedron': '八面体',
'menubar/add/tetrahedron': '四面体',
......@@ -435,6 +440,9 @@ var Strings = function ( config ) {
'sidebar/geometry/geometry/vertices': '顶点',
'sidebar/geometry/geometry/faces': '',
'sidebar/geometry/dodecahedron_geometry/radius': '半径',
'sidebar/geometry/dodecahedron_geometry/detail': '面片分段',
'sidebar/geometry/icosahedron_geometry/radius': '半径',
'sidebar/geometry/icosahedron_geometry/detail': '面片分段',
......
......@@ -1098,7 +1098,7 @@ UI.TabbedPanel.prototype.select = function ( id ) {
}
UI.TabbedPanel.prototype.addPanel = function ( id, label, items ) {
UI.TabbedPanel.prototype.addTab = function ( id, label, items ) {
var tab = new UI.TabbedPanel.Tab( label, this );
tab.setId( id );
......
......@@ -52,7 +52,6 @@ var files = {
"webgl_interactive_cubes_gpu",
"webgl_interactive_instances_gpu",
"webgl_interactive_cubes_ortho",
"webgl_interactive_draggablecubes",
"webgl_interactive_lines",
"webgl_interactive_points",
"webgl_interactive_raycasting_points",
......@@ -338,6 +337,7 @@ var files = {
"webvr_cubes",
"webvr_dragging",
"webvr_lorenzattractor",
"webvr_multiview",
"webvr_panorama",
"webvr_paint",
"webvr_rollercoaster",
......@@ -360,6 +360,7 @@ var files = {
"misc_animation_keys",
"misc_boxselection",
"misc_controls_deviceorientation",
"misc_controls_drag",
"misc_controls_fly",
"misc_controls_map",
"misc_controls_orbit",
......
......@@ -10,6 +10,8 @@ THREE.FirstPersonControls = function ( object, domElement ) {
this.domElement = ( domElement !== undefined ) ? domElement : document;
// API
this.enabled = true;
this.movementSpeed = 1.0;
......@@ -29,6 +31,10 @@ THREE.FirstPersonControls = function ( object, domElement ) {
this.verticalMin = 0;
this.verticalMax = Math.PI;
this.mouseDragOn = false;
// internals
this.autoSpeedFactor = 0.0;
this.mouseX = 0;
......@@ -39,8 +45,6 @@ THREE.FirstPersonControls = function ( object, domElement ) {
this.moveLeft = false;
this.moveRight = false;
this.mouseDragOn = false;
this.viewHalfX = 0;
this.viewHalfY = 0;
......
......@@ -19,8 +19,6 @@ THREE.OrthographicTrackballControls = function ( object, domElement ) {
this.screen = { left: 0, top: 0, width: 0, height: 0 };
this.radius = 0;
this.rotateSpeed = 1.0;
this.zoomSpeed = 1.2;
......@@ -36,6 +34,8 @@ THREE.OrthographicTrackballControls = function ( object, domElement ) {
// internals
this.radius = 0;
this.target = new THREE.Vector3();
var EPS = 0.000001;
......
......@@ -22,7 +22,7 @@ THREE.PointerLockControls = function ( camera, domElement ) {
var PI_2 = Math.PI / 2;
var vec = new Vector3();
var vec = new THREE.Vector3();
function onMouseMove( event ) {
......
......@@ -510,18 +510,18 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype
void main() {\
vec2 invSize = 1.0 / texSize;\
float weightSum = gaussianPdf(0.0, kernelRadius);\
vec3 diffuseSum = texture2D( colorTexture, vUv).rgb * weightSum;\
vec4 diffuseSum = texture2D( colorTexture, vUv) * weightSum;\
vec2 delta = direction * invSize * kernelRadius/float(MAX_RADIUS);\
vec2 uvOffset = delta;\
for( int i = 1; i <= MAX_RADIUS; i ++ ) {\
float w = gaussianPdf(uvOffset.x, kernelRadius);\
vec3 sample1 = texture2D( colorTexture, vUv + uvOffset).rgb;\
vec3 sample2 = texture2D( colorTexture, vUv - uvOffset).rgb;\
vec4 sample1 = texture2D( colorTexture, vUv + uvOffset);\
vec4 sample2 = texture2D( colorTexture, vUv - uvOffset);\
diffuseSum += ((sample1 + sample2) * w);\
weightSum += (2.0 * w);\
uvOffset += delta;\
}\
gl_FragColor = vec4(diffuseSum/weightSum, 1.0);\
gl_FragColor = diffuseSum/weightSum;\
}"
} );
......
import {
Camera,
Vector3
Camera
} from '../../../src/Three';
export class DeviceOrientationControls {
......@@ -14,7 +13,6 @@ export class DeviceOrientationControls {
deviceOrientation: any;
enabled: boolean;
screenOrientation: number;
target: Vector3;
connect(): void;
disconnect(): void;
......
......@@ -22,7 +22,7 @@ export class FirstPersonControls {
constrainVertical: boolean;
verticalMin: number;
verticalMax: number;
autoSpeedFactor: number;
mouseDragOn: boolean;
handleResize(): void;
lookAt(x: number | Vector3, y: number, z: number): this;
......
......@@ -8,7 +8,6 @@ export class OrthographicTrackballControls extends EventDispatcher {
enabled: boolean;
screen: {left: number; top: number; width: number; height: number};
radius: number;
rotateSpeed: number;
zoomSpeed: number;
noRotate: boolean;
......
......@@ -42,6 +42,4 @@ export class TrackballControls extends EventDispatcher {
rotateCamera(): void;
handleResize(): void;
handleEvent(event: any): void;
}
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
export function arrayMin( array: number[] ): number;
export function arrayMax( array: number[] ): number;
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册