TrackballControls.html 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <base href="../../../" />
  6. <script src="list.js"></script>
  7. <script src="page.js"></script>
  8. <link type="text/css" rel="stylesheet" href="page.css" />
  9. </head>
  10. <body>
  11. [page:EventDispatcher] &rarr;
  12. <h1>[name]</h1>
  13. <p class="desc">
  14. <p>
  15. [name] is similar to [page:OrbitControls]. However, it does not maintain a constant camera [page:Object3D.up up] vector.
  16. That means if the camera orbits over the “north” and “south” poles, it does not flip to stay "right side up".
  17. </p>
  18. </p>
  19. <h2>Example</h2>
  20. <p>[example:misc_controls_trackball misc / controls / trackball ]</p>
  21. <h2>Constructor</h2>
  22. <h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
  23. <p>
  24. <p>
  25. [page:Camera camera]: The camera of the rendered scene.
  26. </p>
  27. <p>
  28. [page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
  29. however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
  30. </p>
  31. <p>
  32. Creates a new instance of [name].
  33. </p>
  34. </p>
  35. <h2>Events</h2>
  36. <h3>change</h3>
  37. <p>
  38. Fires when the camera has been transformed by the controls.
  39. </p>
  40. <h3>start</h3>
  41. <p>
  42. Fires when an interaction (e.g. touch) was initiated.
  43. </p>
  44. <h3>end</h3>
  45. <p>
  46. Fires when an interaction has finished.
  47. </p>
  48. <h2>Properties</h2>
  49. <h3>[property:HTMLDOMElement domElement]</h3>
  50. <p>
  51. The HTMLDOMElement used to listen for mouse / touch events. This must be passed in the constructor; changing it here will
  52. not set up new event listeners. Default is the whole document.
  53. </p>
  54. <h3>[property:Number dynamicDampingFactor]</h3>
  55. <p>
  56. Defines the intensity of damping. Only considered if [page:.staticMoving staticMoving] is set to *false*. Default is *0.2*.
  57. </p>
  58. <h3>[property:Boolean enabled]</h3>
  59. <p>
  60. Whether or not the controls are enabled.
  61. </p>
  62. <h3>[property:Array keys]</h3>
  63. <p>
  64. This array holds keycodes for controlling interactions.
  65. <ul>
  66. <li>When the first defined key is pressed, all mouse interactions (left, middle, right) performs orbiting.</li>
  67. <li>When the second defined key is pressed, all mouse interactions (left, middle, right) performs zooming.</li>
  68. <li>When the third defined key is pressed, all mouse interactions (left, middle, right) performs panning.</li>
  69. </ul>
  70. Default is *65, 83, 68* which represents A, S, D.
  71. </p>
  72. <h3>[property:Number maxDistance]</h3>
  73. <p>
  74. How far you can zoom in. Default is *Infinity*.
  75. </p>
  76. <h3>[property:Number minDistance]</h3>
  77. <p>
  78. How far you can zoom in. Default is *0*.
  79. </p>
  80. <h3>
  81. [property:Object mouseButtons]</h3>
  82. <p>
  83. This object contains references to the mouse actions used by the controls.
  84. <ul>
  85. <li>.LEFT is assinged with *THREE.MOUSE.ROTATE*</li>
  86. <li>.MIDDLE is assinged with *THREE.MOUSE.ZOOM*</li>
  87. <li>.RIGHT is assinged with *THREE.MOUSE.PAN*</li>
  88. </ul>
  89. </p>
  90. <h3>[property:Boolean noPan]</h3>
  91. <p>
  92. Whether or not panning is disabled. Default is *false*.
  93. </p>
  94. <h3>[property:Boolean noRotate]</h3>
  95. <p>
  96. Whether or not rotation is disabled. Default is *false*.
  97. </p>
  98. <h3>[property:Boolean noZoom]</h3>
  99. <p>
  100. Whether or not zooming is disabled. Default is *false*.
  101. </p>
  102. <h3>[property:Camera object]</h3>
  103. <p>
  104. The camera being controlled.
  105. </p>
  106. <h3>[property:Number panSpeed]</h3>
  107. <p>
  108. The zoom speed. Default is *0.3*.
  109. </p>
  110. <h3>[property:Number rotateSpeed]</h3>
  111. <p>
  112. The rotation speed. Default is *1.0*.
  113. </p>
  114. <h3>[property:Object screen]</h3>
  115. <p>
  116. Represents the properties of the screen. Automatically set when [page:.handleResize handleResize]() is called.
  117. <ul>
  118. <li>left: Represents the offset in pixels to the screen's left boundary.</li>
  119. <li>top: Represents the offset in pixels to the screen's top boundary.</li>
  120. <li>width: Represents the screen width in pixels.</li>
  121. <li>height: Represents the screen height in pixels.</li>
  122. </ul>
  123. </p>
  124. <h3>[property:Boolean staticMoving]</h3>
  125. <p>
  126. Whether or not damping is disabled. Default is *false*.
  127. </p>
  128. <h3>[property:Number zoomSpeed]</h3>
  129. <p>
  130. The zoom speed. Default is *1.2*.
  131. </p>
  132. <h2>Methods</h2>
  133. <h3>[method:null checkDistances] ()</h3>
  134. <p>
  135. Ensures the controls stay in the range [minDistance, maxDistance]. Called by [page:.update update]().
  136. </p>
  137. <h3>[method:null dispose] ()</h3>
  138. <p>
  139. Should be called if the controls is no longer required.
  140. </p>
  141. <h3>[method:null handleResize] ()</h3>
  142. <p>
  143. Should be called if the application window is resized.
  144. </p>
  145. <h3>[method:null panCamera] ()</h3>
  146. <p>
  147. Performs panning if necessary. Called by [page:.update update]().
  148. </p>
  149. <h3>[method:null reset] ()</h3>
  150. <p>
  151. Resets the controls to its initial state.
  152. </p>
  153. <h3>[method:null rotateCamera] ()</h3>
  154. <p>
  155. Rotates the camera if necessary. Called by [page:.update update]().
  156. </p>
  157. <h3>[method:null update] ()</h3>
  158. <p>
  159. Updates the controls. Usually called in the animation loop.
  160. </p>
  161. <h3>[method:null zoomCamera] ()</h3>
  162. <p>
  163. Performs zooming if necessary. Called by [page:.update update]().
  164. </p>
  165. <h2>Source</h2>
  166. <p>
  167. [link:https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TrackballControls.js examples/js/controls/TrackballControls.js]
  168. </p>
  169. </body>
  170. </html>