Inicio Explorar Ayuda
Iniciar sesión
javascript
/
three.js
espejo de https://github.com/tazdij/three.js.git
2
0
Fork 0
Archivos Incidencias 0 Wiki
Explorar el Código

TrackballControls: Add support for OrthographicCamera.

Mugen87 hace 5 años
padre
74c506980f
commit
8ab5280bfc
Se han modificado 14 ficheros con 202 adiciones y 1898 borrados
Unificar vista Mostrar estadísticas de diff
  1. 0 187
      docs/examples/en/controls/OrthographicTrackballControls.html
  2. 3 6
      docs/examples/en/controls/TrackballControls.html
  3. 0 187
      docs/examples/zh/controls/OrthographicTrackballControls.html
  4. 3 6
      docs/examples/zh/controls/TrackballControls.html
  5. 0 2
      docs/list.js
  6. 0 1
      examples/files.js
  7. 0 644
      examples/js/controls/OrthographicTrackballControls.js
  8. 71 7
      examples/js/controls/TrackballControls.js
  9. 0 29
      examples/jsm/controls/OrthographicTrackballControls.d.ts
  10. 0 653
      examples/jsm/controls/OrthographicTrackballControls.js
  11. 71 7
      examples/jsm/controls/TrackballControls.js
  12. 54 20
      examples/misc_controls_trackball.html
  13. 0 148
      examples/misc_controls_trackball_orthographic.html
  14. 0 1
      utils/modularize.js

+ 0 - 187
docs/examples/en/controls/OrthographicTrackballControls.html
Ver fichero 

@@ -1,187 +0,0 @@
 
-<!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>

+ 3 - 6
docs/examples/en/controls/TrackballControls.html
Ver fichero 

@@ -17,9 +17,6 @@
 
 				[name] is similar to [page:OrbitControls]. However, it does not maintain a constant camera [page:Object3D.up up] vector.
 
 				[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".
 
 				That means if the camera orbits over the “north” and “south” poles, it does not flip to stay "right side up".
 
 			</p>
 
 			</p>
 
-			<p>
 
-				Notice that [name] can only be used with a perspective camera. Use [page:OrthographicTrackballControls] when working with an orthographic camera.
 
-			</p>
 
 		</p>
 
 		</p>
 
 
 
 		<h2>Example</h2>
 
 		<h2>Example</h2>
 
@@ -28,10 +25,10 @@
 
 
 
 		<h2>Constructor</h2>
 
 		<h2>Constructor</h2>
 
 
 
-		<h3>[name]( [param:PerspectiveCamera camera], [param:HTMLDOMElement domElement] )</h3>
 
+		<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
 
 		<p>
 
 		<p>
 
 			<p>
 
 			<p>
 
-				[page:PerspectiveCamera camera]: The perspective camera of the rendered scene.
 
+				[page:Camera camera]: The camera of the rendered scene.
 
 			</p>
 
 			</p>
 
 			<p>
 
 			<p>
 
 				[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
 
 				[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
 
@@ -124,7 +121,7 @@
 
 			Whether or not zooming is disabled. Default is *false*.
 
 			Whether or not zooming is disabled. Default is *false*.
 
 		</p>
 
 		</p>
 
 
 
-		<h3>[property:PerspectiveCamera object]</h3>
 
+		<h3>[property:Camera object]</h3>
 
 		<p>
 
 		<p>
 
 			The camera being controlled.
 
 			The camera being controlled.
 
 		</p>
 
 		</p>

+ 0 - 187
docs/examples/zh/controls/OrthographicTrackballControls.html
Ver fichero 

@@ -1,187 +0,0 @@
 
-<!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>

+ 3 - 6
docs/examples/zh/controls/TrackballControls.html
Ver fichero 

@@ -17,9 +17,6 @@
 
 				[name] is similar to [page:OrbitControls]. However, it does not maintain a constant camera [page:Object3D.up up] vector.
 
 				[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".
 
 				That means if the camera orbits over the “north” and “south” poles, it does not flip to stay "right side up".
 
 			</p>
 
 			</p>
 
-			<p>
 
-				Notice that [name] can only be used with a perspective camera. Use [page:OrthographicTrackballControls] when working with an orthographic camera.
 
-			</p>
 
 		</p>
 
 		</p>
 
 
 
 		<h2>Example</h2>
 
 		<h2>Example</h2>
 
@@ -28,10 +25,10 @@
 
 
 
 		<h2>Constructor</h2>
 
 		<h2>Constructor</h2>
 
 
 
-		<h3>[name]( [param:PerspectiveCamera camera], [param:HTMLDOMElement domElement] )</h3>
 
+		<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
 
 		<p>
 
 		<p>
 
 			<p>
 
 			<p>
 
-				[page:PerspectiveCamera camera]: The perspective camera of the rendered scene.
 
+				[page:Camera camera]: The camera of the rendered scene.
 
 			</p>
 
 			</p>
 
 			<p>
 
 			<p>
 
 				[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
 
 				[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
 
@@ -124,7 +121,7 @@
 
 			Whether or not zooming is disabled. Default is *false*.
 
 			Whether or not zooming is disabled. Default is *false*.
 
 		</p>
 
 		</p>
 
 
 
-		<h3>[property:PerspectiveCamera object]</h3>
 
+		<h3>[property:Camera object]</h3>
 
 		<p>
 
 		<p>
 
 			The camera being controlled.
 
 			The camera being controlled.
 
 		</p>
 
 		</p>

+ 0 - 2
docs/list.js
Ver fichero 

@@ -359,7 +359,6 @@ var list = {
 
 				"FirstPersonControls": "examples/en/controls/FirstPersonControls",
 
 				"FirstPersonControls": "examples/en/controls/FirstPersonControls",
 
 				"FlyControls": "examples/en/controls/FlyControls",
 
 				"FlyControls": "examples/en/controls/FlyControls",
 
 				"OrbitControls": "examples/en/controls/OrbitControls",
 
 				"OrbitControls": "examples/en/controls/OrbitControls",
 
-				"OrthographicTrackballControls": "examples/en/controls/OrthographicTrackballControls",
 
 				"PointerLockControls": "examples/en/controls/PointerLockControls",
 
 				"PointerLockControls": "examples/en/controls/PointerLockControls",
 
 				"TrackballControls": "examples/en/controls/TrackballControls",
 
 				"TrackballControls": "examples/en/controls/TrackballControls",
 
 				"TransformControls": "examples/en/controls/TransformControls"
 
 				"TransformControls": "examples/en/controls/TransformControls"
 
@@ -802,7 +801,6 @@ var list = {
 
 				"FirstPersonControls": "examples/zh/controls/FirstPersonControls",
 
 				"FirstPersonControls": "examples/zh/controls/FirstPersonControls",
 
 				"FlyControls": "examples/zh/controls/FlyControls",
 
 				"FlyControls": "examples/zh/controls/FlyControls",
 
 				"OrbitControls": "examples/zh/controls/OrbitControls",
 
 				"OrbitControls": "examples/zh/controls/OrbitControls",
 
-				"OrthographicTrackballControls": "examples/zh/controls/OrthographicTrackballControls",
 
 				"PointerLockControls": "examples/zh/controls/PointerLockControls",
 
 				"PointerLockControls": "examples/zh/controls/PointerLockControls",
 
 				"TrackballControls": "examples/zh/controls/TrackballControls",
 
 				"TrackballControls": "examples/zh/controls/TrackballControls",
 
 				"TransformControls": "examples/zh/controls/TransformControls"
 
 				"TransformControls": "examples/zh/controls/TransformControls"

+ 0 - 1
examples/files.js
Ver fichero 

@@ -364,7 +364,6 @@ var files = {
 
 		"misc_controls_orbit",
 
 		"misc_controls_orbit",
 
 		"misc_controls_pointerlock",
 
 		"misc_controls_pointerlock",
 
 		"misc_controls_trackball",
 
 		"misc_controls_trackball",
 
-		"misc_controls_trackball_orthographic",
 
 		"misc_controls_transform",
 
 		"misc_controls_transform",
 
 		"misc_exporter_collada",
 
 		"misc_exporter_collada",
 
 		"misc_exporter_draco",
 
 		"misc_exporter_draco",

+ 0 - 644
examples/js/controls/OrthographicTrackballControls.js
Ver fichero 

@@ -1,644 +0,0 @@
 
-/**
 
- * @author Eberhard Graether / http://egraether.com/
 
- * @author Mark Lundin 	/ http://mark-lundin.com
 
- * @author Patrick Fuller / http://patrick-fuller.com
 
- * @author Max Smolens / https://github.com/msmolens
 
- */
 
-
 
-THREE.OrthographicTrackballControls = function ( object, domElement ) {
 
-
 
-	var _this = this;
 
-	var STATE = { NONE: - 1, ROTATE: 0, ZOOM: 1, PAN: 2, TOUCH_ROTATE: 3, TOUCH_ZOOM_PAN: 4 };
 
-
 
-	this.object = object;
 
-	this.domElement = ( domElement !== undefined ) ? domElement : document;
 
-
 
-	// API
 
-
 
-	this.enabled = true;
 
-
 
-	this.screen = { left: 0, top: 0, width: 0, height: 0 };
 
-
 
-	this.rotateSpeed = 1.0;
 
-	this.zoomSpeed = 1.2;
 
-
 
-	this.noRotate = false;
 
-	this.noZoom = false;
 
-	this.noPan = false;
 
-	this.noRoll = false;
 
-
 
-	this.staticMoving = false;
 
-	this.dynamicDampingFactor = 0.2;
 
-
 
-	this.keys = [ 65 /*A*/, 83 /*S*/, 68 /*D*/ ];
 
-
 
-	// internals
 
-
 
-	this.radius = 0;
 
-
 
-	this.target = new THREE.Vector3();
 
-
 
-	var EPS = 0.000001;
 
-
 
-	var _changed = true;
 
-
 
-	var _state = STATE.NONE,
 
-		_prevState = STATE.NONE,
 
-
 
-		_eye = new THREE.Vector3(),
 
-
 
-		_rotateStart = new THREE.Vector3(),
 
-		_rotateEnd = new THREE.Vector3(),
 
-
 
-		_zoomStart = new THREE.Vector2(),
 
-		_zoomEnd = new THREE.Vector2(),
 
-
 
-		_touchZoomDistanceStart = 0,
 
-		_touchZoomDistanceEnd = 0,
 
-
 
-		_panStart = new THREE.Vector2(),
 
-		_panEnd = new THREE.Vector2();
 
-
 
-	// for reset
 
-
 
-	this.target0 = this.target.clone();
 
-	this.position0 = this.object.position.clone();
 
-	this.up0 = this.object.up.clone();
 
-
 
-	this.left0 = this.object.left;
 
-	this.right0 = this.object.right;
 
-	this.top0 = this.object.top;
 
-	this.bottom0 = this.object.bottom;
 
-
 
-	// events
 
-
 
-	var changeEvent = { type: 'change' };
 
-	var startEvent = { type: 'start' };
 
-	var endEvent = { type: 'end' };
 
-
 
-
 
-	// methods
 
-
 
-	this.handleResize = function () {
 
-
 
-		if ( this.domElement === document ) {
 
-
 
-			this.screen.left = 0;
 
-			this.screen.top = 0;
 
-			this.screen.width = window.innerWidth;
 
-			this.screen.height = window.innerHeight;
 
-
 
-		} else {
 
-
 
-			var box = this.domElement.getBoundingClientRect();
 
-			// adjustments come from similar code in the jquery offset() function
 
-			var d = this.domElement.ownerDocument.documentElement;
 
-			this.screen.left = box.left + window.pageXOffset - d.clientLeft;
 
-			this.screen.top = box.top + window.pageYOffset - d.clientTop;
 
-			this.screen.width = box.width;
 
-			this.screen.height = box.height;
 
-
 
-		}
 
-
 
-		this.radius = 0.5 * Math.min( this.screen.width, this.screen.height );
 
-
 
-		this.left0 = this.object.left;
 
-		this.right0 = this.object.right;
 
-		this.top0 = this.object.top;
 
-		this.bottom0 = this.object.bottom;
 
-
 
-	};
 
-
 
-	var getMouseOnScreen = ( function () {
 
-
 
-		var vector = new THREE.Vector2();
 
-
 
-		return function getMouseOnScreen( pageX, pageY ) {
 
-
 
-			vector.set(
 
-				( pageX - _this.screen.left ) / _this.screen.width,
 
-				( pageY - _this.screen.top ) / _this.screen.height
 
-			);
 
-
 
-			return vector;
 
-
 
-		};
 
-
 
-	}() );
 
-
 
-	var getMouseProjectionOnBall = ( function () {
 
-
 
-		var vector = new THREE.Vector3();
 
-		var objectUp = new THREE.Vector3();
 
-		var mouseOnBall = new THREE.Vector3();
 
-
 
-		return function getMouseProjectionOnBall( pageX, pageY ) {
 
-
 
-			mouseOnBall.set(
 
-				( pageX - _this.screen.width * 0.5 - _this.screen.left ) / _this.radius,
 
-				( _this.screen.height * 0.5 + _this.screen.top - pageY ) / _this.radius,
 
-				0.0
 
-			);
 
-
 
-			var length = mouseOnBall.length();
 
-
 
-			if ( _this.noRoll ) {
 
-
 
-				if ( length < Math.SQRT1_2 ) {
 
-
 
-					mouseOnBall.z = Math.sqrt( 1.0 - length * length );
 
-
 
-				} else {
 
-
 
-					mouseOnBall.z = .5 / length;
 
-
 
-				}
 
-
 
-			} else if ( length > 1.0 ) {
 
-
 
-				mouseOnBall.normalize();
 
-
 
-			} else {
 
-
 
-				mouseOnBall.z = Math.sqrt( 1.0 - length * length );
 
-
 
-			}
 
-
 
-			_eye.copy( _this.object.position ).sub( _this.target );
 
-
 
-			vector.copy( _this.object.up ).setLength( mouseOnBall.y );
 
-			vector.add( objectUp.copy( _this.object.up ).cross( _eye ).setLength( mouseOnBall.x ) );
 
-			vector.add( _eye.setLength( mouseOnBall.z ) );
 
-
 
-			return vector;
 
-
 
-		};
 
-
 
-	}() );
 
-
 
-	this.rotateCamera = ( function () {
 
-
 
-		var axis = new THREE.Vector3(),
 
-			quaternion = new THREE.Quaternion();
 
-
 
-
 
-		return function rotateCamera() {
 
-
 
-			var angle = Math.acos( _rotateStart.dot( _rotateEnd ) / _rotateStart.length() / _rotateEnd.length() );
 
-
 
-			if ( angle ) {
 
-
 
-				axis.crossVectors( _rotateStart, _rotateEnd ).normalize();
 
-
 
-				angle *= _this.rotateSpeed;
 
-
 
-				quaternion.setFromAxisAngle( axis, - angle );
 
-
 
-				_eye.applyQuaternion( quaternion );
 
-				_this.object.up.applyQuaternion( quaternion );
 
-
 
-				_rotateEnd.applyQuaternion( quaternion );
 
-
 
-				if ( _this.staticMoving ) {
 
-
 
-					_rotateStart.copy( _rotateEnd );
 
-
 
-				} else {
 
-
 
-					quaternion.setFromAxisAngle( axis, angle * ( _this.dynamicDampingFactor - 1.0 ) );
 
-					_rotateStart.applyQuaternion( quaternion );
 
-
 
-				}
 
-
 
-				_changed = true;
 
-
 
-			}
 
-
 
-		};
 
-
 
-	}() );
 
-
 
-	this.zoomCamera = function () {
 
-
 
-		if ( _state === STATE.TOUCH_ZOOM_PAN ) {
 
-
 
-			var factor = _touchZoomDistanceEnd / _touchZoomDistanceStart;
 
-			_touchZoomDistanceStart = _touchZoomDistanceEnd;
 
-
 
-			_this.object.zoom *= factor;
 
-
 
-			_changed = true;
 
-
 
-		} else {
 
-
 
-			var factor = 1.0 + ( _zoomEnd.y - _zoomStart.y ) * _this.zoomSpeed;
 
-
 
-			if ( Math.abs( factor - 1.0 ) > EPS && factor > 0.0 ) {
 
-
 
-				_this.object.zoom /= factor;
 
-
 
-				if ( _this.staticMoving ) {
 
-
 
-					_zoomStart.copy( _zoomEnd );
 
-
 
-				} else {
 
-
 
-					_zoomStart.y += ( _zoomEnd.y - _zoomStart.y ) * this.dynamicDampingFactor;
 
-
 
-				}
 
-
 
-				_changed = true;
 
-
 
-			}
 
-
 
-		}
 
-
 
-	};
 
-
 
-	this.panCamera = ( function () {
 
-
 
-		var mouseChange = new THREE.Vector2(),
 
-			objectUp = new THREE.Vector3(),
 
-			pan = new THREE.Vector3();
 
-
 
-		return function panCamera() {
 
-
 
-			mouseChange.copy( _panEnd ).sub( _panStart );
 
-
 
-			if ( mouseChange.lengthSq() > EPS ) {
 
-
 
-				// Scale movement to keep clicked/dragged position under cursor
 
-				var scale_x = ( _this.object.right - _this.object.left ) / _this.object.zoom;
 
-				var scale_y = ( _this.object.top - _this.object.bottom ) / _this.object.zoom;
 
-				mouseChange.x *= scale_x;
 
-				mouseChange.y *= scale_y;
 
-
 
-				pan.copy( _eye ).cross( _this.object.up ).setLength( mouseChange.x );
 
-				pan.add( objectUp.copy( _this.object.up ).setLength( mouseChange.y ) );
 
-
 
-				_this.object.position.add( pan );
 
-				_this.target.add( pan );
 
-
 
-				if ( _this.staticMoving ) {
 
-
 
-					_panStart.copy( _panEnd );
 
-
 
-				} else {
 
-
 
-					_panStart.add( mouseChange.subVectors( _panEnd, _panStart ).multiplyScalar( _this.dynamicDampingFactor ) );
 
-
 
-				}
 
-
 
-				_changed = true;
 
-
 
-			}
 
-
 
-		};
 
-
 
-	}() );
 
-
 
-	this.update = function () {
 
-
 
-		_eye.subVectors( _this.object.position, _this.target );
 
-
 
-		if ( ! _this.noRotate ) {
 
-
 
-			_this.rotateCamera();
 
-
 
-		}
 
-
 
-		if ( ! _this.noZoom ) {
 
-
 
-			_this.zoomCamera();
 
-
 
-			if ( _changed ) {
 
-
 
-				_this.object.updateProjectionMatrix();
 
-
 
-			}
 
-
 
-		}
 
-
 
-		if ( ! _this.noPan ) {
 
-
 
-			_this.panCamera();
 
-
 
-		}
 
-
 
-		_this.object.position.addVectors( _this.target, _eye );
 
-
 
-		_this.object.lookAt( _this.target );
 
-
 
-		if ( _changed ) {
 
-
 
-			_this.dispatchEvent( changeEvent );
 
-
 
-			_changed = false;
 
-
 
-		}
 
-
 
-	};
 
-
 
-	this.reset = function () {
 
-
 
-		_state = STATE.NONE;
 
-		_prevState = STATE.NONE;
 
-
 
-		_this.target.copy( _this.target0 );
 
-		_this.object.position.copy( _this.position0 );
 
-		_this.object.up.copy( _this.up0 );
 
-
 
-		_eye.subVectors( _this.object.position, _this.target );
 
-
 
-		_this.object.left = _this.left0;
 
-		_this.object.right = _this.right0;
 
-		_this.object.top = _this.top0;
 
-		_this.object.bottom = _this.bottom0;
 
-
 
-		_this.object.lookAt( _this.target );
 
-
 
-		_this.dispatchEvent( changeEvent );
 
-
 
-		_changed = false;
 
-
 
-	};
 
-
 
-	// listeners
 
-
 
-	function keydown( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		window.removeEventListener( 'keydown', keydown );
 
-
 
-		_prevState = _state;
 
-
 
-		if ( _state !== STATE.NONE ) {
 
-
 
-			return;
 
-
 
-		} else if ( event.keyCode === _this.keys[ STATE.ROTATE ] && ! _this.noRotate ) {
 
-
 
-			_state = STATE.ROTATE;
 
-
 
-		} else if ( event.keyCode === _this.keys[ STATE.ZOOM ] && ! _this.noZoom ) {
 
-
 
-			_state = STATE.ZOOM;
 
-
 
-		} else if ( event.keyCode === _this.keys[ STATE.PAN ] && ! _this.noPan ) {
 
-
 
-			_state = STATE.PAN;
 
-
 
-		}
 
-
 
-	}
 
-
 
-	function keyup() {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		_state = _prevState;
 
-
 
-		window.addEventListener( 'keydown', keydown, false );
 
-
 
-	}
 
-
 
-	function mousedown( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		if ( _state === STATE.NONE ) {
 
-
 
-			_state = event.button;
 
-
 
-		}
 
-
 
-		if ( _state === STATE.ROTATE && ! _this.noRotate ) {
 
-
 
-			_rotateStart.copy( getMouseProjectionOnBall( event.pageX, event.pageY ) );
 
-			_rotateEnd.copy( _rotateStart );
 
-
 
-		} else if ( _state === STATE.ZOOM && ! _this.noZoom ) {
 
-
 
-			_zoomStart.copy( getMouseOnScreen( event.pageX, event.pageY ) );
 
-			_zoomEnd.copy( _zoomStart );
 
-
 
-		} else if ( _state === STATE.PAN && ! _this.noPan ) {
 
-
 
-			_panStart.copy( getMouseOnScreen( event.pageX, event.pageY ) );
 
-			_panEnd.copy( _panStart );
 
-
 
-		}
 
-
 
-		document.addEventListener( 'mousemove', mousemove, false );
 
-		document.addEventListener( 'mouseup', mouseup, false );
 
-
 
-		_this.dispatchEvent( startEvent );
 
-
 
-	}
 
-
 
-	function mousemove( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		if ( _state === STATE.ROTATE && ! _this.noRotate ) {
 
-
 
-			_rotateEnd.copy( getMouseProjectionOnBall( event.pageX, event.pageY ) );
 
-
 
-		} else if ( _state === STATE.ZOOM && ! _this.noZoom ) {
 
-
 
-			_zoomEnd.copy( getMouseOnScreen( event.pageX, event.pageY ) );
 
-
 
-		} else if ( _state === STATE.PAN && ! _this.noPan ) {
 
-
 
-			_panEnd.copy( getMouseOnScreen( event.pageX, event.pageY ) );
 
-
 
-		}
 
-
 
-	}
 
-
 
-	function mouseup( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		_state = STATE.NONE;
 
-
 
-		document.removeEventListener( 'mousemove', mousemove );
 
-		document.removeEventListener( 'mouseup', mouseup );
 
-		_this.dispatchEvent( endEvent );
 
-
 
-	}
 
-
 
-	function mousewheel( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		switch ( event.deltaMode ) {
 
-
 
-			case 2:
 
-				// Zoom in pages
 
-				_zoomStart.y -= event.deltaY * 0.025;
 
-				break;
 
-
 
-			case 1:
 
-				// Zoom in lines
 
-				_zoomStart.y -= event.deltaY * 0.01;
 
-				break;
 
-
 
-			default:
 
-				// undefined, 0, assume pixels
 
-				_zoomStart.y -= event.deltaY * 0.00025;
 
-				break;
 
-
 
-		}
 
-
 
-		_this.dispatchEvent( startEvent );
 
-		_this.dispatchEvent( endEvent );
 
-
 
-	}
 
-
 
-	function touchstart( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		switch ( event.touches.length ) {
 
-
 
-			case 1:
 
-				_state = STATE.TOUCH_ROTATE;
 
-				_rotateStart.copy( getMouseProjectionOnBall( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY ) );
 
-				_rotateEnd.copy( _rotateStart );
 
-				break;
 
-
 
-			case 2:
 
-				_state = STATE.TOUCH_ZOOM_PAN;
 
-				var dx = event.touches[ 0 ].pageX - event.touches[ 1 ].pageX;
 
-				var dy = event.touches[ 0 ].pageY - event.touches[ 1 ].pageY;
 
-				_touchZoomDistanceEnd = _touchZoomDistanceStart = Math.sqrt( dx * dx + dy * dy );
 
-
 
-				var x = ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX ) / 2;
 
-				var y = ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY ) / 2;
 
-				_panStart.copy( getMouseOnScreen( x, y ) );
 
-				_panEnd.copy( _panStart );
 
-				break;
 
-
 
-			default:
 
-				_state = STATE.NONE;
 
-
 
-		}
 
-		_this.dispatchEvent( startEvent );
 
-
 
-	}
 
-
 
-	function touchmove( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		switch ( event.touches.length ) {
 
-
 
-			case 1:
 
-				_rotateEnd.copy( getMouseProjectionOnBall( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY ) );
 
-				break;
 
-
 
-			case 2:
 
-				var dx = event.touches[ 0 ].pageX - event.touches[ 1 ].pageX;
 
-				var dy = event.touches[ 0 ].pageY - event.touches[ 1 ].pageY;
 
-				_touchZoomDistanceEnd = Math.sqrt( dx * dx + dy * dy );
 
-
 
-				var x = ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX ) / 2;
 
-				var y = ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY ) / 2;
 
-				_panEnd.copy( getMouseOnScreen( x, y ) );
 
-				break;
 
-
 
-			default:
 
-				_state = STATE.NONE;
 
-
 
-		}
 
-
 
-	}
 
-
 
-	function touchend( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		switch ( event.touches.length ) {
 
-
 
-			case 1:
 
-				_rotateEnd.copy( getMouseProjectionOnBall( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY ) );
 
-				_rotateStart.copy( _rotateEnd );
 
-				break;
 
-
 
-			case 2:
 
-				_touchZoomDistanceStart = _touchZoomDistanceEnd = 0;
 
-
 
-				var x = ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX ) / 2;
 
-				var y = ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY ) / 2;
 
-				_panEnd.copy( getMouseOnScreen( x, y ) );
 
-				_panStart.copy( _panEnd );
 
-				break;
 
-
 
-		}
 
-
 
-		_state = STATE.NONE;
 
-		_this.dispatchEvent( endEvent );
 
-
 
-	}
 
-
 
-	function contextmenu( event ) {
 
-
 
-		event.preventDefault();
 
-
 
-	}
 
-
 
-	this.dispose = function () {
 
-
 
-		this.domElement.removeEventListener( 'contextmenu', contextmenu, false );
 
-		this.domElement.removeEventListener( 'mousedown', mousedown, false );
 
-		this.domElement.removeEventListener( 'wheel', mousewheel, false );
 
-
 
-		this.domElement.removeEventListener( 'touchstart', touchstart, false );
 
-		this.domElement.removeEventListener( 'touchend', touchend, false );
 
-		this.domElement.removeEventListener( 'touchmove', touchmove, false );
 
-
 
-		document.removeEventListener( 'mousemove', mousemove, false );
 
-		document.removeEventListener( 'mouseup', mouseup, false );
 
-
 
-		window.removeEventListener( 'keydown', keydown, false );
 
-		window.removeEventListener( 'keyup', keyup, false );
 
-
 
-	};
 
-
 
-	this.domElement.addEventListener( 'contextmenu', contextmenu, false );
 
-	this.domElement.addEventListener( 'mousedown', mousedown, false );
 
-	this.domElement.addEventListener( 'wheel', mousewheel, false );
 
-
 
-	this.domElement.addEventListener( 'touchstart', touchstart, false );
 
-	this.domElement.addEventListener( 'touchend', touchend, false );
 
-	this.domElement.addEventListener( 'touchmove', touchmove, false );
 
-
 
-	window.addEventListener( 'keydown', keydown, false );
 
-	window.addEventListener( 'keyup', keyup, false );
 
-
 
-	this.handleResize();
 
-
 
-	// force an update at start
 
-	this.update();
 
-
 
-};
 
-
 
-THREE.OrthographicTrackballControls.prototype = Object.create( THREE.EventDispatcher.prototype );
 
-THREE.OrthographicTrackballControls.prototype.constructor = THREE.OrthographicTrackballControls;

+ 71 - 7
examples/js/controls/TrackballControls.js
Ver fichero 

@@ -44,6 +44,7 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 	var EPS = 0.000001;
 
 	var EPS = 0.000001;
 
 
 
 	var lastPosition = new THREE.Vector3();
 
 	var lastPosition = new THREE.Vector3();
 
+	var lastZoom = 1;
 
 
 
 	var _state = STATE.NONE,
 
 	var _state = STATE.NONE,
 
 		_keyState = STATE.NONE,
 
 		_keyState = STATE.NONE,
 
@@ -70,6 +71,7 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 	this.target0 = this.target.clone();
 
 	this.target0 = this.target.clone();
 
 	this.position0 = this.object.position.clone();
 
 	this.position0 = this.object.position.clone();
 
 	this.up0 = this.object.up.clone();
 
 	this.up0 = this.object.up.clone();
 
+	this.zoom0 = this.object.zoom;
 
 
 
 	// events
 
 	// events
 
 
 
@@ -201,7 +203,21 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 
 
 			factor = _touchZoomDistanceStart / _touchZoomDistanceEnd;
 
 			factor = _touchZoomDistanceStart / _touchZoomDistanceEnd;
 
 			_touchZoomDistanceStart = _touchZoomDistanceEnd;
 
 			_touchZoomDistanceStart = _touchZoomDistanceEnd;
 
-			_eye.multiplyScalar( factor );
 
+
 
+			if ( _this.object.isPerspectiveCamera ) {
 
+
 
+				_eye.multiplyScalar( factor );
 
+
 
+			} else if ( _this.object.isOrthographicCamera ) {
 
+
 
+				_this.object.zoom *= factor;
 
+				_this.object.updateProjectionMatrix();
 
+
 
+			} else {
 
+
 
+				console.warn( 'THREE.TrackballControls: Unsupported camera type' );
 
+
 
+			}
 
 
 
 		} else {
 
 		} else {
 
 
 
@@ -209,7 +225,20 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 
 
 			if ( factor !== 1.0 && factor > 0.0 ) {
 
 			if ( factor !== 1.0 && factor > 0.0 ) {
 
 
 
-				_eye.multiplyScalar( factor );
 
+				if ( _this.object.isPerspectiveCamera ) {
 
+
 
+					_eye.multiplyScalar( factor );
 
+
 
+				} else if ( _this.object.isOrthographicCamera ) {
 
+
 
+					_this.object.zoom /= factor;
 
+					_this.object.updateProjectionMatrix();
 
+
 
+				} else {
 
+
 
+					console.warn( 'THREE.TrackballControls: Unsupported camera type' );
 
+
 
+				}
 
 
 
 			}
 
 			}
 
 
 
@@ -239,6 +268,16 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 
 
 			if ( mouseChange.lengthSq() ) {
 
 			if ( mouseChange.lengthSq() ) {
 
 
 
+				if ( _this.object.isOrthographicCamera ) {
 
+
 
+					var scale_x = ( _this.object.right - _this.object.left ) / _this.object.zoom / _this.domElement.clientWidth;
 
+					var scale_y = ( _this.object.top - _this.object.bottom ) / _this.object.zoom / _this.domElement.clientWidth;
 
+
 
+					mouseChange.x *= scale_x;
 
+					mouseChange.y *= scale_y;
 
+
 
+				}
 
+
 
 				mouseChange.multiplyScalar( _eye.length() * _this.panSpeed );
 
 				mouseChange.multiplyScalar( _eye.length() * _this.panSpeed );
 
 
 
 				pan.copy( _eye ).cross( _this.object.up ).setLength( mouseChange.x );
 
 				pan.copy( _eye ).cross( _this.object.up ).setLength( mouseChange.x );
 
@@ -309,15 +348,36 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 
 
 		_this.object.position.addVectors( _this.target, _eye );
 
 		_this.object.position.addVectors( _this.target, _eye );
 
 
 
-		_this.checkDistances();
 
+		if ( _this.object.isPerspectiveCamera ) {
 
 
 
-		_this.object.lookAt( _this.target );
 
+			_this.checkDistances();
 
 
 
-		if ( lastPosition.distanceToSquared( _this.object.position ) > EPS ) {
 
+			_this.object.lookAt( _this.target );
 
+
 
+			if ( lastPosition.distanceToSquared( _this.object.position ) > EPS ) {
 
+
 
+				_this.dispatchEvent( changeEvent );
 
+
 
+				lastPosition.copy( _this.object.position );
 
+
 
+			}
 
 
 
-			_this.dispatchEvent( changeEvent );
 
+		} else if ( _this.object.isOrthographicCamera ) {
 
 
 
-			lastPosition.copy( _this.object.position );
 
+			_this.object.lookAt( _this.target );
 
+
 
+			if ( lastPosition.distanceToSquared( _this.object.position ) > EPS || lastZoom !== _this.object.zoom ) {
 
+
 
+				_this.dispatchEvent( changeEvent );
 
+
 
+				lastPosition.copy( _this.object.position );
 
+				lastZoom = _this.object.zoom;
 
+
 
+			}
 
+
 
+		} else {
 
+
 
+			console.warn( 'THREE.TrackballControls: Unsupported camera type' );
 
 
 
 		}
 
 		}
 
 
 
@@ -331,6 +391,9 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 		_this.target.copy( _this.target0 );
 
 		_this.target.copy( _this.target0 );
 
 		_this.object.position.copy( _this.position0 );
 
 		_this.object.position.copy( _this.position0 );
 
 		_this.object.up.copy( _this.up0 );
 
 		_this.object.up.copy( _this.up0 );
 
+		_this.object.zoom = _this.zoom0;
 
+
 
+		_this.object.updateProjectionMatrix();
 
 
 
 		_eye.subVectors( _this.object.position, _this.target );
 
 		_eye.subVectors( _this.object.position, _this.target );
 
 
 
@@ -339,6 +402,7 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 		_this.dispatchEvent( changeEvent );
 
 		_this.dispatchEvent( changeEvent );
 
 
 
 		lastPosition.copy( _this.object.position );
 
 		lastPosition.copy( _this.object.position );
 
+		lastZoom = _this.object.zoom;
 
 
 
 	};
 
 	};

+ 0 - 29
examples/jsm/controls/OrthographicTrackballControls.d.ts
Ver fichero 

@@ -1,29 +0,0 @@
 
-import { Camera, EventDispatcher } from '../../../src/Three';
 
-
 
-export class OrthographicTrackballControls extends EventDispatcher {
 
-  constructor(object: Camera, domElement?: HTMLElement);
 
-
 
-  object: Camera;
 
-  domElement: HTMLElement;
 
-
 
-  enabled: boolean;
 
-  screen: {left: number; top: number; width: number; height: number};
 
-  rotateSpeed: number;
 
-  zoomSpeed: number;
 
-  noRotate: boolean;
 
-  noZoom: boolean;
 
-  noPan: boolean;
 
-  noRoll: boolean;
 
-  staticMoving: boolean;
 
-  dynamicDampingFactor: number;
 
-  keys: number[];
 
-
 
-  handleResize(): void;
 
-  rotateCamera(): void;
 
-  zoomCamera(): void;
 
-  panCamera(): void;
 
-  update(): void;
 
-  reset(): void;
 
-  dispose(): void;
 
-
 
-}

+ 0 - 653
examples/jsm/controls/OrthographicTrackballControls.js
Ver fichero 

@@ -1,653 +0,0 @@
 
-/**
 
- * @author Eberhard Graether / http://egraether.com/
 
- * @author Mark Lundin 	/ http://mark-lundin.com
 
- * @author Patrick Fuller / http://patrick-fuller.com
 
- * @author Max Smolens / https://github.com/msmolens
 
- */
 
-
 
-import {
 
-	EventDispatcher,
 
-	Quaternion,
 
-	Vector2,
 
-	Vector3
 
-} from "../../../build/three.module.js";
 
-
 
-var OrthographicTrackballControls = function ( object, domElement ) {
 
-
 
-	var _this = this;
 
-	var STATE = { NONE: - 1, ROTATE: 0, ZOOM: 1, PAN: 2, TOUCH_ROTATE: 3, TOUCH_ZOOM_PAN: 4 };
 
-
 
-	this.object = object;
 
-	this.domElement = ( domElement !== undefined ) ? domElement : document;
 
-
 
-	// API
 
-
 
-	this.enabled = true;
 
-
 
-	this.screen = { left: 0, top: 0, width: 0, height: 0 };
 
-
 
-	this.rotateSpeed = 1.0;
 
-	this.zoomSpeed = 1.2;
 
-
 
-	this.noRotate = false;
 
-	this.noZoom = false;
 
-	this.noPan = false;
 
-	this.noRoll = false;
 
-
 
-	this.staticMoving = false;
 
-	this.dynamicDampingFactor = 0.2;
 
-
 
-	this.keys = [ 65 /*A*/, 83 /*S*/, 68 /*D*/ ];
 
-
 
-	// internals
 
-
 
-	this.radius = 0;
 
-
 
-	this.target = new Vector3();
 
-
 
-	var EPS = 0.000001;
 
-
 
-	var _changed = true;
 
-
 
-	var _state = STATE.NONE,
 
-		_prevState = STATE.NONE,
 
-
 
-		_eye = new Vector3(),
 
-
 
-		_rotateStart = new Vector3(),
 
-		_rotateEnd = new Vector3(),
 
-
 
-		_zoomStart = new Vector2(),
 
-		_zoomEnd = new Vector2(),
 
-
 
-		_touchZoomDistanceStart = 0,
 
-		_touchZoomDistanceEnd = 0,
 
-
 
-		_panStart = new Vector2(),
 
-		_panEnd = new Vector2();
 
-
 
-	// for reset
 
-
 
-	this.target0 = this.target.clone();
 
-	this.position0 = this.object.position.clone();
 
-	this.up0 = this.object.up.clone();
 
-
 
-	this.left0 = this.object.left;
 
-	this.right0 = this.object.right;
 
-	this.top0 = this.object.top;
 
-	this.bottom0 = this.object.bottom;
 
-
 
-	// events
 
-
 
-	var changeEvent = { type: 'change' };
 
-	var startEvent = { type: 'start' };
 
-	var endEvent = { type: 'end' };
 
-
 
-
 
-	// methods
 
-
 
-	this.handleResize = function () {
 
-
 
-		if ( this.domElement === document ) {
 
-
 
-			this.screen.left = 0;
 
-			this.screen.top = 0;
 
-			this.screen.width = window.innerWidth;
 
-			this.screen.height = window.innerHeight;
 
-
 
-		} else {
 
-
 
-			var box = this.domElement.getBoundingClientRect();
 
-			// adjustments come from similar code in the jquery offset() function
 
-			var d = this.domElement.ownerDocument.documentElement;
 
-			this.screen.left = box.left + window.pageXOffset - d.clientLeft;
 
-			this.screen.top = box.top + window.pageYOffset - d.clientTop;
 
-			this.screen.width = box.width;
 
-			this.screen.height = box.height;
 
-
 
-		}
 
-
 
-		this.radius = 0.5 * Math.min( this.screen.width, this.screen.height );
 
-
 
-		this.left0 = this.object.left;
 
-		this.right0 = this.object.right;
 
-		this.top0 = this.object.top;
 
-		this.bottom0 = this.object.bottom;
 
-
 
-	};
 
-
 
-	var getMouseOnScreen = ( function () {
 
-
 
-		var vector = new Vector2();
 
-
 
-		return function getMouseOnScreen( pageX, pageY ) {
 
-
 
-			vector.set(
 
-				( pageX - _this.screen.left ) / _this.screen.width,
 
-				( pageY - _this.screen.top ) / _this.screen.height
 
-			);
 
-
 
-			return vector;
 
-
 
-		};
 
-
 
-	}() );
 
-
 
-	var getMouseProjectionOnBall = ( function () {
 
-
 
-		var vector = new Vector3();
 
-		var objectUp = new Vector3();
 
-		var mouseOnBall = new Vector3();
 
-
 
-		return function getMouseProjectionOnBall( pageX, pageY ) {
 
-
 
-			mouseOnBall.set(
 
-				( pageX - _this.screen.width * 0.5 - _this.screen.left ) / _this.radius,
 
-				( _this.screen.height * 0.5 + _this.screen.top - pageY ) / _this.radius,
 
-				0.0
 
-			);
 
-
 
-			var length = mouseOnBall.length();
 
-
 
-			if ( _this.noRoll ) {
 
-
 
-				if ( length < Math.SQRT1_2 ) {
 
-
 
-					mouseOnBall.z = Math.sqrt( 1.0 - length * length );
 
-
 
-				} else {
 
-
 
-					mouseOnBall.z = .5 / length;
 
-
 
-				}
 
-
 
-			} else if ( length > 1.0 ) {
 
-
 
-				mouseOnBall.normalize();
 
-
 
-			} else {
 
-
 
-				mouseOnBall.z = Math.sqrt( 1.0 - length * length );
 
-
 
-			}
 
-
 
-			_eye.copy( _this.object.position ).sub( _this.target );
 
-
 
-			vector.copy( _this.object.up ).setLength( mouseOnBall.y );
 
-			vector.add( objectUp.copy( _this.object.up ).cross( _eye ).setLength( mouseOnBall.x ) );
 
-			vector.add( _eye.setLength( mouseOnBall.z ) );
 
-
 
-			return vector;
 
-
 
-		};
 
-
 
-	}() );
 
-
 
-	this.rotateCamera = ( function () {
 
-
 
-		var axis = new Vector3(),
 
-			quaternion = new Quaternion();
 
-
 
-
 
-		return function rotateCamera() {
 
-
 
-			var angle = Math.acos( _rotateStart.dot( _rotateEnd ) / _rotateStart.length() / _rotateEnd.length() );
 
-
 
-			if ( angle ) {
 
-
 
-				axis.crossVectors( _rotateStart, _rotateEnd ).normalize();
 
-
 
-				angle *= _this.rotateSpeed;
 
-
 
-				quaternion.setFromAxisAngle( axis, - angle );
 
-
 
-				_eye.applyQuaternion( quaternion );
 
-				_this.object.up.applyQuaternion( quaternion );
 
-
 
-				_rotateEnd.applyQuaternion( quaternion );
 
-
 
-				if ( _this.staticMoving ) {
 
-
 
-					_rotateStart.copy( _rotateEnd );
 
-
 
-				} else {
 
-
 
-					quaternion.setFromAxisAngle( axis, angle * ( _this.dynamicDampingFactor - 1.0 ) );
 
-					_rotateStart.applyQuaternion( quaternion );
 
-
 
-				}
 
-
 
-				_changed = true;
 
-
 
-			}
 
-
 
-		};
 
-
 
-	}() );
 
-
 
-	this.zoomCamera = function () {
 
-
 
-		if ( _state === STATE.TOUCH_ZOOM_PAN ) {
 
-
 
-			var factor = _touchZoomDistanceEnd / _touchZoomDistanceStart;
 
-			_touchZoomDistanceStart = _touchZoomDistanceEnd;
 
-
 
-			_this.object.zoom *= factor;
 
-
 
-			_changed = true;
 
-
 
-		} else {
 
-
 
-			var factor = 1.0 + ( _zoomEnd.y - _zoomStart.y ) * _this.zoomSpeed;
 
-
 
-			if ( Math.abs( factor - 1.0 ) > EPS && factor > 0.0 ) {
 
-
 
-				_this.object.zoom /= factor;
 
-
 
-				if ( _this.staticMoving ) {
 
-
 
-					_zoomStart.copy( _zoomEnd );
 
-
 
-				} else {
 
-
 
-					_zoomStart.y += ( _zoomEnd.y - _zoomStart.y ) * this.dynamicDampingFactor;
 
-
 
-				}
 
-
 
-				_changed = true;
 
-
 
-			}
 
-
 
-		}
 
-
 
-	};
 
-
 
-	this.panCamera = ( function () {
 
-
 
-		var mouseChange = new Vector2(),
 
-			objectUp = new Vector3(),
 
-			pan = new Vector3();
 
-
 
-		return function panCamera() {
 
-
 
-			mouseChange.copy( _panEnd ).sub( _panStart );
 
-
 
-			if ( mouseChange.lengthSq() > EPS ) {
 
-
 
-				// Scale movement to keep clicked/dragged position under cursor
 
-				var scale_x = ( _this.object.right - _this.object.left ) / _this.object.zoom;
 
-				var scale_y = ( _this.object.top - _this.object.bottom ) / _this.object.zoom;
 
-				mouseChange.x *= scale_x;
 
-				mouseChange.y *= scale_y;
 
-
 
-				pan.copy( _eye ).cross( _this.object.up ).setLength( mouseChange.x );
 
-				pan.add( objectUp.copy( _this.object.up ).setLength( mouseChange.y ) );
 
-
 
-				_this.object.position.add( pan );
 
-				_this.target.add( pan );
 
-
 
-				if ( _this.staticMoving ) {
 
-
 
-					_panStart.copy( _panEnd );
 
-
 
-				} else {
 
-
 
-					_panStart.add( mouseChange.subVectors( _panEnd, _panStart ).multiplyScalar( _this.dynamicDampingFactor ) );
 
-
 
-				}
 
-
 
-				_changed = true;
 
-
 
-			}
 
-
 
-		};
 
-
 
-	}() );
 
-
 
-	this.update = function () {
 
-
 
-		_eye.subVectors( _this.object.position, _this.target );
 
-
 
-		if ( ! _this.noRotate ) {
 
-
 
-			_this.rotateCamera();
 
-
 
-		}
 
-
 
-		if ( ! _this.noZoom ) {
 
-
 
-			_this.zoomCamera();
 
-
 
-			if ( _changed ) {
 
-
 
-				_this.object.updateProjectionMatrix();
 
-
 
-			}
 
-
 
-		}
 
-
 
-		if ( ! _this.noPan ) {
 
-
 
-			_this.panCamera();
 
-
 
-		}
 
-
 
-		_this.object.position.addVectors( _this.target, _eye );
 
-
 
-		_this.object.lookAt( _this.target );
 
-
 
-		if ( _changed ) {
 
-
 
-			_this.dispatchEvent( changeEvent );
 
-
 
-			_changed = false;
 
-
 
-		}
 
-
 
-	};
 
-
 
-	this.reset = function () {
 
-
 
-		_state = STATE.NONE;
 
-		_prevState = STATE.NONE;
 
-
 
-		_this.target.copy( _this.target0 );
 
-		_this.object.position.copy( _this.position0 );
 
-		_this.object.up.copy( _this.up0 );
 
-
 
-		_eye.subVectors( _this.object.position, _this.target );
 
-
 
-		_this.object.left = _this.left0;
 
-		_this.object.right = _this.right0;
 
-		_this.object.top = _this.top0;
 
-		_this.object.bottom = _this.bottom0;
 
-
 
-		_this.object.lookAt( _this.target );
 
-
 
-		_this.dispatchEvent( changeEvent );
 
-
 
-		_changed = false;
 
-
 
-	};
 
-
 
-	// listeners
 
-
 
-	function keydown( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		window.removeEventListener( 'keydown', keydown );
 
-
 
-		_prevState = _state;
 
-
 
-		if ( _state !== STATE.NONE ) {
 
-
 
-			return;
 
-
 
-		} else if ( event.keyCode === _this.keys[ STATE.ROTATE ] && ! _this.noRotate ) {
 
-
 
-			_state = STATE.ROTATE;
 
-
 
-		} else if ( event.keyCode === _this.keys[ STATE.ZOOM ] && ! _this.noZoom ) {
 
-
 
-			_state = STATE.ZOOM;
 
-
 
-		} else if ( event.keyCode === _this.keys[ STATE.PAN ] && ! _this.noPan ) {
 
-
 
-			_state = STATE.PAN;
 
-
 
-		}
 
-
 
-	}
 
-
 
-	function keyup() {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		_state = _prevState;
 
-
 
-		window.addEventListener( 'keydown', keydown, false );
 
-
 
-	}
 
-
 
-	function mousedown( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		if ( _state === STATE.NONE ) {
 
-
 
-			_state = event.button;
 
-
 
-		}
 
-
 
-		if ( _state === STATE.ROTATE && ! _this.noRotate ) {
 
-
 
-			_rotateStart.copy( getMouseProjectionOnBall( event.pageX, event.pageY ) );
 
-			_rotateEnd.copy( _rotateStart );
 
-
 
-		} else if ( _state === STATE.ZOOM && ! _this.noZoom ) {
 
-
 
-			_zoomStart.copy( getMouseOnScreen( event.pageX, event.pageY ) );
 
-			_zoomEnd.copy( _zoomStart );
 
-
 
-		} else if ( _state === STATE.PAN && ! _this.noPan ) {
 
-
 
-			_panStart.copy( getMouseOnScreen( event.pageX, event.pageY ) );
 
-			_panEnd.copy( _panStart );
 
-
 
-		}
 
-
 
-		document.addEventListener( 'mousemove', mousemove, false );
 
-		document.addEventListener( 'mouseup', mouseup, false );
 
-
 
-		_this.dispatchEvent( startEvent );
 
-
 
-	}
 
-
 
-	function mousemove( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		if ( _state === STATE.ROTATE && ! _this.noRotate ) {
 
-
 
-			_rotateEnd.copy( getMouseProjectionOnBall( event.pageX, event.pageY ) );
 
-
 
-		} else if ( _state === STATE.ZOOM && ! _this.noZoom ) {
 
-
 
-			_zoomEnd.copy( getMouseOnScreen( event.pageX, event.pageY ) );
 
-
 
-		} else if ( _state === STATE.PAN && ! _this.noPan ) {
 
-
 
-			_panEnd.copy( getMouseOnScreen( event.pageX, event.pageY ) );
 
-
 
-		}
 
-
 
-	}
 
-
 
-	function mouseup( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		_state = STATE.NONE;
 
-
 
-		document.removeEventListener( 'mousemove', mousemove );
 
-		document.removeEventListener( 'mouseup', mouseup );
 
-		_this.dispatchEvent( endEvent );
 
-
 
-	}
 
-
 
-	function mousewheel( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		switch ( event.deltaMode ) {
 
-
 
-			case 2:
 
-				// Zoom in pages
 
-				_zoomStart.y -= event.deltaY * 0.025;
 
-				break;
 
-
 
-			case 1:
 
-				// Zoom in lines
 
-				_zoomStart.y -= event.deltaY * 0.01;
 
-				break;
 
-
 
-			default:
 
-				// undefined, 0, assume pixels
 
-				_zoomStart.y -= event.deltaY * 0.00025;
 
-				break;
 
-
 
-		}
 
-
 
-		_this.dispatchEvent( startEvent );
 
-		_this.dispatchEvent( endEvent );
 
-
 
-	}
 
-
 
-	function touchstart( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		switch ( event.touches.length ) {
 
-
 
-			case 1:
 
-				_state = STATE.TOUCH_ROTATE;
 
-				_rotateStart.copy( getMouseProjectionOnBall( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY ) );
 
-				_rotateEnd.copy( _rotateStart );
 
-				break;
 
-
 
-			case 2:
 
-				_state = STATE.TOUCH_ZOOM_PAN;
 
-				var dx = event.touches[ 0 ].pageX - event.touches[ 1 ].pageX;
 
-				var dy = event.touches[ 0 ].pageY - event.touches[ 1 ].pageY;
 
-				_touchZoomDistanceEnd = _touchZoomDistanceStart = Math.sqrt( dx * dx + dy * dy );
 
-
 
-				var x = ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX ) / 2;
 
-				var y = ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY ) / 2;
 
-				_panStart.copy( getMouseOnScreen( x, y ) );
 
-				_panEnd.copy( _panStart );
 
-				break;
 
-
 
-			default:
 
-				_state = STATE.NONE;
 
-
 
-		}
 
-		_this.dispatchEvent( startEvent );
 
-
 
-	}
 
-
 
-	function touchmove( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		event.preventDefault();
 
-		event.stopPropagation();
 
-
 
-		switch ( event.touches.length ) {
 
-
 
-			case 1:
 
-				_rotateEnd.copy( getMouseProjectionOnBall( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY ) );
 
-				break;
 
-
 
-			case 2:
 
-				var dx = event.touches[ 0 ].pageX - event.touches[ 1 ].pageX;
 
-				var dy = event.touches[ 0 ].pageY - event.touches[ 1 ].pageY;
 
-				_touchZoomDistanceEnd = Math.sqrt( dx * dx + dy * dy );
 
-
 
-				var x = ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX ) / 2;
 
-				var y = ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY ) / 2;
 
-				_panEnd.copy( getMouseOnScreen( x, y ) );
 
-				break;
 
-
 
-			default:
 
-				_state = STATE.NONE;
 
-
 
-		}
 
-
 
-	}
 
-
 
-	function touchend( event ) {
 
-
 
-		if ( _this.enabled === false ) return;
 
-
 
-		switch ( event.touches.length ) {
 
-
 
-			case 1:
 
-				_rotateEnd.copy( getMouseProjectionOnBall( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY ) );
 
-				_rotateStart.copy( _rotateEnd );
 
-				break;
 
-
 
-			case 2:
 
-				_touchZoomDistanceStart = _touchZoomDistanceEnd = 0;
 
-
 
-				var x = ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX ) / 2;
 
-				var y = ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY ) / 2;
 
-				_panEnd.copy( getMouseOnScreen( x, y ) );
 
-				_panStart.copy( _panEnd );
 
-				break;
 
-
 
-		}
 
-
 
-		_state = STATE.NONE;
 
-		_this.dispatchEvent( endEvent );
 
-
 
-	}
 
-
 
-	function contextmenu( event ) {
 
-
 
-		event.preventDefault();
 
-
 
-	}
 
-
 
-	this.dispose = function () {
 
-
 
-		this.domElement.removeEventListener( 'contextmenu', contextmenu, false );
 
-		this.domElement.removeEventListener( 'mousedown', mousedown, false );
 
-		this.domElement.removeEventListener( 'wheel', mousewheel, false );
 
-
 
-		this.domElement.removeEventListener( 'touchstart', touchstart, false );
 
-		this.domElement.removeEventListener( 'touchend', touchend, false );
 
-		this.domElement.removeEventListener( 'touchmove', touchmove, false );
 
-
 
-		document.removeEventListener( 'mousemove', mousemove, false );
 
-		document.removeEventListener( 'mouseup', mouseup, false );
 
-
 
-		window.removeEventListener( 'keydown', keydown, false );
 
-		window.removeEventListener( 'keyup', keyup, false );
 
-
 
-	};
 
-
 
-	this.domElement.addEventListener( 'contextmenu', contextmenu, false );
 
-	this.domElement.addEventListener( 'mousedown', mousedown, false );
 
-	this.domElement.addEventListener( 'wheel', mousewheel, false );
 
-
 
-	this.domElement.addEventListener( 'touchstart', touchstart, false );
 
-	this.domElement.addEventListener( 'touchend', touchend, false );
 
-	this.domElement.addEventListener( 'touchmove', touchmove, false );
 
-
 
-	window.addEventListener( 'keydown', keydown, false );
 
-	window.addEventListener( 'keyup', keyup, false );
 
-
 
-	this.handleResize();
 
-
 
-	// force an update at start
 
-	this.update();
 
-
 
-};
 
-
 
-OrthographicTrackballControls.prototype = Object.create( EventDispatcher.prototype );
 
-OrthographicTrackballControls.prototype.constructor = OrthographicTrackballControls;
 
-
 
-export { OrthographicTrackballControls };

+ 71 - 7
examples/jsm/controls/TrackballControls.js
Ver fichero 

@@ -52,6 +52,7 @@ var TrackballControls = function ( object, domElement ) {
 
 	var EPS = 0.000001;
 
 	var EPS = 0.000001;
 
 
 
 	var lastPosition = new Vector3();
 
 	var lastPosition = new Vector3();
 
+	var lastZoom = 1;
 
 
 
 	var _state = STATE.NONE,
 
 	var _state = STATE.NONE,
 
 		_keyState = STATE.NONE,
 
 		_keyState = STATE.NONE,
 
@@ -78,6 +79,7 @@ var TrackballControls = function ( object, domElement ) {
 
 	this.target0 = this.target.clone();
 
 	this.target0 = this.target.clone();
 
 	this.position0 = this.object.position.clone();
 
 	this.position0 = this.object.position.clone();
 
 	this.up0 = this.object.up.clone();
 
 	this.up0 = this.object.up.clone();
 
+	this.zoom0 = this.object.zoom;
 
 
 
 	// events
 
 	// events
 
 
 
@@ -209,7 +211,21 @@ var TrackballControls = function ( object, domElement ) {
 
 
 
 			factor = _touchZoomDistanceStart / _touchZoomDistanceEnd;
 
 			factor = _touchZoomDistanceStart / _touchZoomDistanceEnd;
 
 			_touchZoomDistanceStart = _touchZoomDistanceEnd;
 
 			_touchZoomDistanceStart = _touchZoomDistanceEnd;
 
-			_eye.multiplyScalar( factor );
 
+
 
+			if ( _this.object.isPerspectiveCamera ) {
 
+
 
+				_eye.multiplyScalar( factor );
 
+
 
+			} else if ( _this.object.isOrthographicCamera ) {
 
+
 
+				_this.object.zoom *= factor;
 
+				_this.object.updateProjectionMatrix();
 
+
 
+			} else {
 
+
 
+				console.warn( 'THREE.TrackballControls: Unsupported camera type' );
 
+
 
+			}
 
 
 
 		} else {
 
 		} else {
 
 
 
@@ -217,7 +233,20 @@ var TrackballControls = function ( object, domElement ) {
 
 
 
 			if ( factor !== 1.0 && factor > 0.0 ) {
 
 			if ( factor !== 1.0 && factor > 0.0 ) {
 
 
 
-				_eye.multiplyScalar( factor );
 
+				if ( _this.object.isPerspectiveCamera ) {
 
+
 
+					_eye.multiplyScalar( factor );
 
+
 
+				} else if ( _this.object.isOrthographicCamera ) {
 
+
 
+					_this.object.zoom /= factor;
 
+					_this.object.updateProjectionMatrix();
 
+
 
+				} else {
 
+
 
+					console.warn( 'THREE.TrackballControls: Unsupported camera type' );
 
+
 
+				}
 
 
 
 			}
 
 			}
 
 
 
@@ -247,6 +276,16 @@ var TrackballControls = function ( object, domElement ) {
 
 
 
 			if ( mouseChange.lengthSq() ) {
 
 			if ( mouseChange.lengthSq() ) {
 
 
 
+				if ( _this.object.isOrthographicCamera ) {
 
+
 
+					var scale_x = ( _this.object.right - _this.object.left ) / _this.object.zoom / _this.domElement.clientWidth;
 
+					var scale_y = ( _this.object.top - _this.object.bottom ) / _this.object.zoom / _this.domElement.clientWidth;
 
+
 
+					mouseChange.x *= scale_x;
 
+					mouseChange.y *= scale_y;
 
+
 
+				}
 
+
 
 				mouseChange.multiplyScalar( _eye.length() * _this.panSpeed );
 
 				mouseChange.multiplyScalar( _eye.length() * _this.panSpeed );
 
 
 
 				pan.copy( _eye ).cross( _this.object.up ).setLength( mouseChange.x );
 
 				pan.copy( _eye ).cross( _this.object.up ).setLength( mouseChange.x );
 
@@ -317,15 +356,36 @@ var TrackballControls = function ( object, domElement ) {
 
 
 
 		_this.object.position.addVectors( _this.target, _eye );
 
 		_this.object.position.addVectors( _this.target, _eye );
 
 
 
-		_this.checkDistances();
 
+		if ( _this.object.isPerspectiveCamera ) {
 
 
 
-		_this.object.lookAt( _this.target );
 
+			_this.checkDistances();
 
 
 
-		if ( lastPosition.distanceToSquared( _this.object.position ) > EPS ) {
 
+			_this.object.lookAt( _this.target );
 
+
 
+			if ( lastPosition.distanceToSquared( _this.object.position ) > EPS ) {
 
+
 
+				_this.dispatchEvent( changeEvent );
 
+
 
+				lastPosition.copy( _this.object.position );
 
+
 
+			}
 
 
 
-			_this.dispatchEvent( changeEvent );
 
+		} else if ( _this.object.isOrthographicCamera ) {
 
 
 
-			lastPosition.copy( _this.object.position );
 
+			_this.object.lookAt( _this.target );
 
+
 
+			if ( lastPosition.distanceToSquared( _this.object.position ) > EPS || lastZoom !== _this.object.zoom ) {
 
+
 
+				_this.dispatchEvent( changeEvent );
 
+
 
+				lastPosition.copy( _this.object.position );
 
+				lastZoom = _this.object.zoom;
 
+
 
+			}
 
+
 
+		} else {
 
+
 
+			console.warn( 'THREE.TrackballControls: Unsupported camera type' );
 
 
 
 		}
 
 		}
 
 
 
@@ -339,6 +399,9 @@ var TrackballControls = function ( object, domElement ) {
 
 		_this.target.copy( _this.target0 );
 
 		_this.target.copy( _this.target0 );
 
 		_this.object.position.copy( _this.position0 );
 
 		_this.object.position.copy( _this.position0 );
 
 		_this.object.up.copy( _this.up0 );
 
 		_this.object.up.copy( _this.up0 );
 
+		_this.object.zoom = _this.zoom0;
 
+
 
+		_this.object.updateProjectionMatrix();
 
 
 
 		_eye.subVectors( _this.object.position, _this.target );
 
 		_eye.subVectors( _this.object.position, _this.target );
 
 
 
@@ -347,6 +410,7 @@ var TrackballControls = function ( object, domElement ) {
 
 		_this.dispatchEvent( changeEvent );
 
 		_this.dispatchEvent( changeEvent );
 
 
 
 		lastPosition.copy( _this.object.position );
 
 		lastPosition.copy( _this.object.position );
 
+		lastZoom = _this.object.zoom;
 
 
 
 	};
 
 	};

+ 54 - 20
examples/misc_controls_trackball.html
Ver fichero 

@@ -27,19 +27,30 @@
 
 			import * as THREE from '../build/three.module.js';
 
 			import * as THREE from '../build/three.module.js';
 
 
 
 			import Stats from './jsm/libs/stats.module.js';
 
 			import Stats from './jsm/libs/stats.module.js';
 
+			import { GUI } from './jsm/libs/dat.gui.module.js';
 
 
 
 			import { TrackballControls } from './jsm/controls/TrackballControls.js';
 
 			import { TrackballControls } from './jsm/controls/TrackballControls.js';
 
 
 
+			var perspectiveCamera, orthographicCamera, controls, scene, renderer, stats;
 
 
 
-			var camera, controls, scene, renderer, stats;
 
+			var params = {
 
+				orthographicCamera: false
 
+			};
 
+
 
+			var frustumSize = 400;
 
 
 
 			init();
 
 			init();
 
 			animate();
 
 			animate();
 
 
 
 			function init() {
 
 			function init() {
 
 
 
-				camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 1000 );
 
-				camera.position.z = 500;
 
+				var aspect = window.innerWidth / window.innerHeight;
 
+
 
+				perspectiveCamera = new THREE.PerspectiveCamera( 60, aspect, 1, 1000 );
 
+				perspectiveCamera.position.z = 500;
 
+
 
+				orthographicCamera = new THREE.OrthographicCamera( frustumSize * aspect / - 2, frustumSize * aspect / 2, frustumSize / 2, frustumSize / - 2, 1, 1000 );
 
+				orthographicCamera.position.z = 500;
 
 
 
 				// world
 
 				// world
 
 
 
@@ -62,7 +73,6 @@
 
 
 
 				}
 
 				}
 
 
 
-
 
 				// lights
 
 				// lights
 
 
 
 				var light = new THREE.DirectionalLight( 0xffffff );
 
 				var light = new THREE.DirectionalLight( 0xffffff );
 
@@ -76,7 +86,6 @@
 
 				var light = new THREE.AmbientLight( 0x222222 );
 
 				var light = new THREE.AmbientLight( 0x222222 );
 
 				scene.add( light );
 
 				scene.add( light );
 
 
 
-
 
 				// renderer
 
 				// renderer
 
 
 
 				renderer = new THREE.WebGLRenderer( { antialias: true } );
 
 				renderer = new THREE.WebGLRenderer( { antialias: true } );
 
@@ -84,38 +93,61 @@
 
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				document.body.appendChild( renderer.domElement );
 
 				document.body.appendChild( renderer.domElement );
 
 
 
-				controls = new TrackballControls( camera, renderer.domElement );
 
+				stats = new Stats();
 
+				document.body.appendChild( stats.dom );
 
 
 
-				controls.rotateSpeed = 1.0;
 
-				controls.zoomSpeed = 1.2;
 
-				controls.panSpeed = 0.8;
 
+				//
 
 
 
-				controls.noZoom = false;
 
-				controls.noPan = false;
 
+				var gui = new GUI();
 
+				gui.add( params, 'orthographicCamera' ).name( 'use orthographic' ).onChange( function ( value ) {
 
 
 
-				controls.staticMoving = true;
 
-				controls.dynamicDampingFactor = 0.3;
 
+					controls.dispose();
 
 
 
-				controls.keys = [ 65, 83, 68 ];
 
+					createControls( value ? orthographicCamera : perspectiveCamera );
 
 
 
-				controls.addEventListener( 'change', render );
 
+					render();
 
 
 
-				stats = new Stats();
 
-				document.body.appendChild( stats.dom );
 
+				} );
 
 
 
 				//
 
 				//
 
 
 
 				window.addEventListener( 'resize', onWindowResize, false );
 
 				window.addEventListener( 'resize', onWindowResize, false );
 
-				//
 
+
 
+				createControls( perspectiveCamera );
 
 
 
 				render();
 
 				render();
 
 
 
 			}
 
 			}
 
 
 
+			function createControls( camera ) {
 
+
 
+				controls = new TrackballControls( camera, renderer.domElement );
 
+
 
+				controls.rotateSpeed = 1.0;
 
+				controls.zoomSpeed = 1.2;
 
+				controls.panSpeed = 0.8;
 
+
 
+				controls.staticMoving = true;
 
+				controls.dynamicDampingFactor = 0.3;
 
+
 
+				controls.keys = [ 65, 83, 68 ];
 
+
 
+				controls.addEventListener( 'change', render );
 
+
 
+			}
 
+
 
 			function onWindowResize() {
 
 			function onWindowResize() {
 
 
 
-				camera.aspect = window.innerWidth / window.innerHeight;
 
-				camera.updateProjectionMatrix();
 
+				var aspect = window.innerWidth / window.innerHeight;
 
+
 
+				perspectiveCamera.aspect = aspect;
 
+				perspectiveCamera.updateProjectionMatrix();
 
+
 
+				orthographicCamera.left = - frustumSize * aspect / 2;
 
+				orthographicCamera.right = frustumSize * aspect / 2;
 
+				orthographicCamera.top = frustumSize / 2;
 
+				orthographicCamera.bottom = - frustumSize / 2;
 
+				orthographicCamera.updateProjectionMatrix();
 
 
 
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 
 
@@ -137,6 +169,8 @@
 
 
 
 			function render() {
 
 			function render() {
 
 
 
+				var camera = ( params.orthographicCamera ) ? orthographicCamera : perspectiveCamera;
 
+
 
 				renderer.render( scene, camera );
 
 				renderer.render( scene, camera );
 
 
 
 			}
 
 			}

+ 0 - 148
examples/misc_controls_trackball_orthographic.html
Ver fichero 

@@ -1,148 +0,0 @@
 
-<!DOCTYPE html>
 
-<html lang="en">
 
-	<head>
 
-		<title>three.js webgl - orthographic trackball controls</title>
 
-		<meta charset="utf-8">
 
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
-		<link type="text/css" rel="stylesheet" href="main.css">
 
-		<style>
 
-			body {
 
-				background-color: #ccc;
 
-				color: #000;
 
-			}
 
-			a {
 
-				color: #f00;
 
-			}
 
-		</style>
 
-	</head>
 
-
 
-	<body>
 
-		<div id="info">
 
-			<a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> - orthographic trackball controls<br />
 
-			MOVE mouse &amp; press LEFT: rotate, MIDDLE: zoom, RIGHT: pan
 
-		</div>
 
-
 
-		<script type="module">
 
-
 
-			import * as THREE from '../build/three.module.js';
 
-
 
-			import Stats from './jsm/libs/stats.module.js';
 
-
 
-			import { OrthographicTrackballControls } from './jsm/controls/OrthographicTrackballControls.js';
 
-
 
-			var camera, controls, scene, renderer, stats;
 
-
 
-			init();
 
-			animate();
 
-
 
-			function init() {
 
-
 
-				camera = new THREE.OrthographicCamera( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, 1, 2000 );
 
-				camera.position.z = 1000;
 
-
 
-				// world
 
-
 
-				scene = new THREE.Scene();
 
-				scene.background = new THREE.Color( 0xcccccc );
 
-				scene.fog = new THREE.FogExp2( 0xcccccc, 0.001 );
 
-
 
-				var geometry = new THREE.CylinderBufferGeometry( 0, 10, 30, 4, 1 );
 
-				var material = new THREE.MeshPhongMaterial( { color: 0xffffff, flatShading: true } );
 
-
 
-				for ( var i = 0; i < 500; i ++ ) {
 
-
 
-					var mesh = new THREE.Mesh( geometry, material );
 
-					mesh.position.x = ( Math.random() - 0.5 ) * 1000;
 
-					mesh.position.y = ( Math.random() - 0.5 ) * 1000;
 
-					mesh.position.z = ( Math.random() - 0.5 ) * 1000;
 
-					mesh.updateMatrix();
 
-					mesh.matrixAutoUpdate = false;
 
-					scene.add( mesh );
 
-
 
-				}
 
-
 
-				// lights
 
-
 
-				var light = new THREE.DirectionalLight( 0xffffff );
 
-				light.position.set( 1, 1, 1 );
 
-				scene.add( light );
 
-
 
-				var light = new THREE.DirectionalLight( 0x002288 );
 
-				light.position.set( - 1, - 1, - 1 );
 
-				scene.add( light );
 
-
 
-				var light = new THREE.AmbientLight( 0x222222 );
 
-				scene.add( light );
 
-
 
-
 
-				// renderer
 
-
 
-				renderer = new THREE.WebGLRenderer( { antialias: true } );
 
-				renderer.setPixelRatio( window.devicePixelRatio );
 
-				renderer.setSize( window.innerWidth, window.innerHeight );
 
-				document.body.appendChild( renderer.domElement );
 
-
 
-				controls = new OrthographicTrackballControls( camera, renderer.domElement );
 
-
 
-				controls.rotateSpeed = 1.0;
 
-				controls.zoomSpeed = 1.2;
 
-
 
-				controls.noZoom = false;
 
-				controls.noPan = false;
 
-
 
-				controls.staticMoving = true;
 
-				controls.dynamicDampingFactor = 0.3;
 
-
 
-				controls.keys = [ 65, 83, 68 ];
 
-
 
-				controls.addEventListener( 'change', render );
 
-
 
-				stats = new Stats();
 
-				document.body.appendChild( stats.dom );
 
-
 
-				//
 
-
 
-				window.addEventListener( 'resize', onWindowResize, false );
 
-				//
 
-
 
-				render();
 
-
 
-			}
 
-
 
-			function onWindowResize() {
 
-
 
-				camera.left = window.innerWidth / - 2;
 
-				camera.right = window.innerWidth / 2;
 
-				camera.top = window.innerHeight / 2;
 
-				camera.bottom = window.innerHeight / - 2;
 
-				camera.updateProjectionMatrix();
 
-
 
-				renderer.setSize( window.innerWidth, window.innerHeight );
 
-
 
-				controls.handleResize();
 
-
 
-				render();
 
-
 
-			}
 
-
 
-			function animate() {
 
-
 
-				requestAnimationFrame( animate );
 
-
 
-				controls.update();
 
-
 
-				stats.update();
 
-
 
-			}
 
-
 
-			function render() {
 
-
 
-				renderer.render( scene, camera );
 
-
 
-			}
 
-
 
-
 
-		</script>
 
-
 
-	</body>
 
-</html>

+ 0 - 1
utils/modularize.js
Ver fichero 

@@ -23,7 +23,6 @@ var files = [
 
 	{ path: 'controls/FirstPersonControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/FirstPersonControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/FlyControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/FlyControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/OrbitControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/OrbitControls.js', dependencies: [], ignoreList: [] },
 
-	{ path: 'controls/OrthographicTrackballControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/PointerLockControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/PointerLockControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/TrackballControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/TrackballControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/TransformControls.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'controls/TransformControls.js', dependencies: [], ignoreList: [] },