صفحهٔ اصلی گشت‌و‌گذار راهنما
ثبت نام ورود
samien
/
three.js
mirrorاز https://github.com/mrdoob/three.js.git
1
0
انشعاب 0
پرونده‌ها مشکلات 0 ویکی
درخت: 4345fbc1f2
شاخه‌ها تگ‌ها
three.js
/
docs
/
pages
/
ArcballControls.html

ArcballControls.html 21 KB
تاريخچه خام

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469 
  1. <!DOCTYPE html>
    2. 

  2. <html lang="en">
    3. 

  3. <head>
    4. 

  4. 	<meta charset="utf-8">
    5. 

  5. 	<title>ArcballControls - Three.js Docs</title>
    6. 

  6. 	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    7. 

  7. 	<script src="../scripts/highlight.min.js"></script>
    8. 

  8. 	<link type="text/css" rel="stylesheet" href="../styles/highlight-three.css">
    9. 

  9. 	<link type="text/css" rel="stylesheet" href="../styles/page.css">
    10. 

  10. </head>
    11. 

  11. <body>
    12. 

  12. 		<p class="inheritance" translate="no"><a href="EventDispatcher.html">EventDispatcher</a> → <a href="Controls.html">Controls</a> → </p>
    13. 

  13. 	<h1 translate="no">ArcballControls</h1>
    14. 

  14. 		<section>
    15. 

  15. 			<header>
    16. 

  16. 				<div class="class-description"><p>Arcball controls allow the camera to be controlled by a virtual trackball with full touch support and advanced navigation functionality.
    17. 

  17. Cursor/finger positions and movements are mapped over a virtual trackball surface represented by a gizmo and mapped in intuitive and
    18. 

  18. consistent camera movements. Dragging cursor/fingers will cause camera to orbit around the center of the trackball in a conservative
    19. 

  19. way (returning to the starting point will make the camera return to its starting orientation).</p>
    20. 

  20. <p>In addition to supporting pan, zoom and pinch gestures, Arcball controls provide focus&lt; functionality with a double click/tap for intuitively
    21. 

  21. moving the object's point of interest in the center of the virtual trackball. Focus allows a much better inspection and navigation in complex
    22. 

  22. environment. Moreover Arcball controls allow FOV manipulation (in a vertigo-style method) and z-rotation. Saving and restoring of Camera State
    23. 

  23. is supported also through clipboard (use ctrl+c and ctrl+v shortcuts for copy and paste the state).</p>
    24. 

  24. <p>Unlike <a href="OrbitControls.html">OrbitControls</a> and <a href="TrackballControls.html">TrackballControls</a>, <code>ArcballControls</code> doesn't require <code>update()</code> to be called externally in an
    25. 

  25. animation loop when animations are on.</p></div>
    26. 

  26. 			</header>
    27. 

  27. 			<article>
    28. 

  28. 				<h2 class="subsection-title">Import</h2>
    29. 

  29. 				<p><span translate="no">ArcballControls</span> is an addon, and must be imported explicitly, see <a href="https://threejs.org/manual/#en/installation" target="_blank" rel="noopener">Installation#Addons</a>.</p>
    30. 

  30. 				<pre><code class="language-js">import { ArcballControls } from 'three/addons/controls/ArcballControls.js';</code></pre>
    31. 

  31. 				<div class="container-overview">
    32. 

  32. 					<h2>Constructor</h2>
    33. 

  33. 					<h3 class="name name-method" id="ArcballControls" translate="no">new <a href="#ArcballControls">ArcballControls</a><span class="signature">( camera : <span class="param-type"><a href="Camera.html">Camera</a></span>, domElement : <span class="param-type">HTMLElement</span>, scene : <span class="param-type"><a href="Scene.html">Scene</a></span> )</span> </h3>
    34. 

  34. 					<div class="method">
    35. 

  35. 						<div class="description">
    36. 

  36. 							<p>Constructs a new controls instance.</p>
    37. 

  37. 						</div>
    38. 

  38. 						<table class="params">
    39. 

  39. 							<tbody>
    40. 

  40. 								<tr>
    41. 

  41. 									<td class="name">
    42. 

  42. 										<strong>camera</strong>
    43. 

  43. 									</td>
    44. 

  44. 									<td class="description last">
    45. 

  45. 										<p>The camera to be controlled. The camera must not be a child of another object, unless that object is the scene itself.</p>
    46. 

  46. 									</td>
    47. 

  47. 								</tr>
    48. 

  48. 								<tr>
    49. 

  49. 									<td class="name">
    50. 

  50. 										<strong>domElement</strong>
    51. 

  51. 									</td>
    52. 

  52. 									<td class="description last">
    53. 

  53. 										<p>The HTML element used for event listeners.</p>
    54. 

  54. 										<p>Default is <code>null</code>.</p>
    55. 

  55. 									</td>
    56. 

  56. 								</tr>
    57. 

  57. 								<tr>
    58. 

  58. 									<td class="name">
    59. 

  59. 										<strong>scene</strong>
    60. 

  60. 									</td>
    61. 

  61. 									<td class="description last">
    62. 

  62. 										<p>The scene rendered by the camera. If not given, gizmos cannot be shown.</p>
    63. 

  63. 										<p>Default is <code>null</code>.</p>
    64. 

  64. 									</td>
    65. 

  65. 								</tr>
    66. 

  66. 							</tbody>
    67. 

  67. 						</table>
    68. 

  68. 					</div>
    69. 

  69. 				</div>
    70. 

  70. 				<h2 class="subsection-title">Properties</h2>
    71. 

  71. 				<div class="member">
    72. 

  72. 					<h3 class="name" id="adjustNearFar" translate="no">.<a href="#adjustNearFar">adjustNearFar</a><span class="type-signature"> : boolean</span> </h3>
    73. 

  73. 					<div class="description">
    74. 

  74. 						<p>If set to <code>true</code>, the camera's near and far values will be adjusted every time zoom is
    75. 

  75. performed trying to maintain the same visible portion given by initial near and far
    76. 

  76. values. Only works with perspective cameras.</p>
    77. 

  77. 						<p>Default is <code>false</code>.</p>
    78. 

  78. 					</div>
    79. 

  79. 				</div>
    80. 

  80. 				<div class="member">
    81. 

  81. 					<h3 class="name" id="cursorZoom" translate="no">.<a href="#cursorZoom">cursorZoom</a><span class="type-signature"> : boolean</span> </h3>
    82. 

  82. 					<div class="description">
    83. 

  83. 						<p>Set to <code>true</code> to make zoom become cursor centered.</p>
    84. 

  84. 						<p>Default is <code>false</code>.</p>
    85. 

  85. 					</div>
    86. 

  86. 				</div>
    87. 

  87. 				<div class="member">
    88. 

  88. 					<h3 class="name" id="dampingFactor" translate="no">.<a href="#dampingFactor">dampingFactor</a><span class="type-signature"> : number</span> </h3>
    89. 

  89. 					<div class="description">
    90. 

  90. 						<p>The damping inertia used if 'enableAnimations<code>is set to</code>true`.</p>
    91. 

  91. 						<p>Default is <code>25</code>.</p>
    92. 

  92. 					</div>
    93. 

  93. 				</div>
    94. 

  94. 				<div class="member">
    95. 

  95. 					<h3 class="name" id="enableAnimations" translate="no">.<a href="#enableAnimations">enableAnimations</a><span class="type-signature"> : boolean</span> </h3>
    96. 

  96. 					<div class="description">
    97. 

  97. 						<p>Set to <code>true</code> to enable animations for rotation (damping) and focus operation.</p>
    98. 

  98. 						<p>Default is <code>true</code>.</p>
    99. 

  99. 					</div>
    100. 

  100. 				</div>
    101. 

  101. 				<div class="member">
    102. 

  102. 					<h3 class="name" id="enableFocus" translate="no">.<a href="#enableFocus">enableFocus</a><span class="type-signature"> : boolean</span> </h3>
    103. 

  103. 					<div class="description">
    104. 

  104. 						<p>Enable or disable camera focusing on double-tap (or click) operations.</p>
    105. 

  105. 						<p>Default is <code>true</code>.</p>
    106. 

  106. 					</div>
    107. 

  107. 				</div>
    108. 

  108. 				<div class="member">
    109. 

  109. 					<h3 class="name" id="enableGizmos" translate="no">.<a href="#enableGizmos">enableGizmos</a><span class="type-signature"> : boolean</span> </h3>
    110. 

  110. 					<div class="description">
    111. 

  111. 						<p>Enable or disable gizmos.</p>
    112. 

  112. 						<p>Default is <code>true</code>.</p>
    113. 

  113. 					</div>
    114. 

  114. 				</div>
    115. 

  115. 				<div class="member">
    116. 

  116. 					<h3 class="name" id="enableGrid" translate="no">.<a href="#enableGrid">enableGrid</a><span class="type-signature"> : boolean</span> </h3>
    117. 

  117. 					<div class="description">
    118. 

  118. 						<p>If set to <code>true</code>, a grid will appear when panning operation is being performed
    119. 

  119. (desktop interaction only).</p>
    120. 

  120. 						<p>Default is <code>false</code>.</p>
    121. 

  121. 					</div>
    122. 

  122. 				</div>
    123. 

  123. 				<div class="member">
    124. 

  124. 					<h3 class="name" id="enablePan" translate="no">.<a href="#enablePan">enablePan</a><span class="type-signature"> : boolean</span> </h3>
    125. 

  125. 					<div class="description">
    126. 

  126. 						<p>Enable or disable camera panning.</p>
    127. 

  127. 						<p>Default is <code>true</code>.</p>
    128. 

  128. 					</div>
    129. 

  129. 				</div>
    130. 

  130. 				<div class="member">
    131. 

  131. 					<h3 class="name" id="enableRotate" translate="no">.<a href="#enableRotate">enableRotate</a><span class="type-signature"> : boolean</span> </h3>
    132. 

  132. 					<div class="description">
    133. 

  133. 						<p>Enable or disable camera rotation.</p>
    134. 

  134. 						<p>Default is <code>true</code>.</p>
    135. 

  135. 					</div>
    136. 

  136. 				</div>
    137. 

  137. 				<div class="member">
    138. 

  138. 					<h3 class="name" id="enableZoom" translate="no">.<a href="#enableZoom">enableZoom</a><span class="type-signature"> : boolean</span> </h3>
    139. 

  139. 					<div class="description">
    140. 

  140. 						<p>Enable or disable camera zoom.</p>
    141. 

  141. 						<p>Default is <code>true</code>.</p>
    142. 

  142. 					</div>
    143. 

  143. 				</div>
    144. 

  144. 				<div class="member">
    145. 

  145. 					<h3 class="name" id="focusAnimationTime" translate="no">.<a href="#focusAnimationTime">focusAnimationTime</a><span class="type-signature"> : number</span> </h3>
    146. 

  146. 					<div class="description">
    147. 

  147. 						<p>Duration of focus animations in ms.</p>
    148. 

  148. 						<p>Default is <code>500</code>.</p>
    149. 

  149. 					</div>
    150. 

  150. 				</div>
    151. 

  151. 				<div class="member">
    152. 

  152. 					<h3 class="name" id="maxDistance" translate="no">.<a href="#maxDistance">maxDistance</a><span class="type-signature"> : number</span> </h3>
    153. 

  153. 					<div class="description">
    154. 

  154. 						<p>How far you can dolly out. For perspective cameras only.</p>
    155. 

  155. 						<p>Default is <code>Infinity</code>.</p>
    156. 

  156. 					</div>
    157. 

  157. 				</div>
    158. 

  158. 				<div class="member">
    159. 

  159. 					<h3 class="name" id="maxFov" translate="no">.<a href="#maxFov">maxFov</a><span class="type-signature"> : number</span> </h3>
    160. 

  160. 					<div class="description">
    161. 

  161. 						<p>The maximum FOV in degrees.</p>
    162. 

  162. 						<p>Default is <code>90</code>.</p>
    163. 

  163. 					</div>
    164. 

  164. 				</div>
    165. 

  165. 				<div class="member">
    166. 

  166. 					<h3 class="name" id="maxZoom" translate="no">.<a href="#maxZoom">maxZoom</a><span class="type-signature"> : number</span> </h3>
    167. 

  167. 					<div class="description">
    168. 

  168. 						<p>How far you can zoom out. For orthographic cameras only.</p>
    169. 

  169. 						<p>Default is <code>Infinity</code>.</p>
    170. 

  170. 					</div>
    171. 

  171. 				</div>
    172. 

  172. 				<div class="member">
    173. 

  173. 					<h3 class="name" id="minDistance" translate="no">.<a href="#minDistance">minDistance</a><span class="type-signature"> : number</span> </h3>
    174. 

  174. 					<div class="description">
    175. 

  175. 						<p>How far you can dolly in. For perspective cameras only.</p>
    176. 

  176. 						<p>Default is <code>0</code>.</p>
    177. 

  177. 					</div>
    178. 

  178. 				</div>
    179. 

  179. 				<div class="member">
    180. 

  180. 					<h3 class="name" id="minFov" translate="no">.<a href="#minFov">minFov</a><span class="type-signature"> : number</span> </h3>
    181. 

  181. 					<div class="description">
    182. 

  182. 						<p>The minimum FOV in degrees.</p>
    183. 

  183. 						<p>Default is <code>5</code>.</p>
    184. 

  184. 					</div>
    185. 

  185. 				</div>
    186. 

  186. 				<div class="member">
    187. 

  187. 					<h3 class="name" id="minZoom" translate="no">.<a href="#minZoom">minZoom</a><span class="type-signature"> : number</span> </h3>
    188. 

  188. 					<div class="description">
    189. 

  189. 						<p>How far you can zoom in. For orthographic cameras only.</p>
    190. 

  190. 						<p>Default is <code>0</code>.</p>
    191. 

  191. 					</div>
    192. 

  192. 				</div>
    193. 

  193. 				<div class="member">
    194. 

  194. 					<h3 class="name" id="mouseActions" translate="no">.<a href="#mouseActions">mouseActions</a><span class="type-signature"> : Array.&lt;Object></span> </h3>
    195. 

  195. 					<div class="description">
    196. 

  196. 						<p>Holds the mouse actions of this controls. This property is maintained by the methods
    197. 

  197. <code>setMouseAction()</code> and <code>unsetMouseAction()</code>.</p>
    198. 

  198. 					</div>
    199. 

  199. 				</div>
    200. 

  200. 				<div class="member">
    201. 

  201. 					<h3 class="name" id="radiusFactor" translate="no">.<a href="#radiusFactor">radiusFactor</a><span class="type-signature"> : number</span> </h3>
    202. 

  202. 					<div class="description">
    203. 

  203. 						<p>The size of the gizmo relative to the screen width and height.</p>
    204. 

  204. 						<p>Default is <code>0.67</code>.</p>
    205. 

  205. 					</div>
    206. 

  206. 				</div>
    207. 

  207. 				<div class="member">
    208. 

  208. 					<h3 class="name" id="rotateSpeed" translate="no">.<a href="#rotateSpeed">rotateSpeed</a><span class="type-signature"> : number</span> </h3>
    209. 

  209. 					<div class="description">
    210. 

  210. 						<p>Speed of rotation.</p>
    211. 

  211. 						<p>Default is <code>1</code>.</p>
    212. 

  212. 					</div>
    213. 

  213. 				</div>
    214. 

  214. 				<div class="member">
    215. 

  215. 					<h3 class="name" id="scaleFactor" translate="no">.<a href="#scaleFactor">scaleFactor</a><span class="type-signature"> : number</span> </h3>
    216. 

  216. 					<div class="description">
    217. 

  217. 						<p>The scaling factor used when performing zoom operation.</p>
    218. 

  218. 						<p>Default is <code>1.1</code>.</p>
    219. 

  219. 					</div>
    220. 

  220. 				</div>
    221. 

  221. 				<div class="member">
    222. 

  222. 					<h3 class="name" id="scene" translate="no">.<a href="#scene">scene</a><span class="type-signature"> : <a href="Scene.html">Scene</a></span> </h3>
    223. 

  223. 					<div class="description">
    224. 

  224. 						<p>The scene rendered by the camera. If not given, gizmos cannot be shown.</p>
    225. 

  225. 						<p>Default is <code>null</code>.</p>
    226. 

  226. 					</div>
    227. 

  227. 				</div>
    228. 

  228. 				<div class="member">
    229. 

  229. 					<h3 class="name" id="target" translate="no">.<a href="#target">target</a><span class="type-signature"> : <a href="Vector3.html">Vector3</a></span> </h3>
    230. 

  230. 					<div class="description">
    231. 

  231. 						<p>The control's focus point.</p>
    232. 

  232. 					</div>
    233. 

  233. 				</div>
    234. 

  234. 				<div class="member">
    235. 

  235. 					<h3 class="name" id="wMax" translate="no">.<a href="#wMax">wMax</a><span class="type-signature"> : number</span> </h3>
    236. 

  236. 					<div class="description">
    237. 

  237. 						<p>Maximum angular velocity allowed on rotation animation start.</p>
    238. 

  238. 						<p>Default is <code>20</code>.</p>
    239. 

  239. 					</div>
    240. 

  240. 				</div>
    241. 

  241. 				<h2 class="subsection-title">Methods</h2>
    242. 

  242. 					<h3 class="name name-method" id="activateGizmos" translate="no">.<a href="#activateGizmos">activateGizmos</a><span class="signature">( isActive : <span class="param-type">boolean</span> )</span> </h3>
    243. 

  243. 					<div class="method">
    244. 

  244. 						<div class="description">
    245. 

  245. 							<p>Makes rotation gizmos more or less visible.</p>
    246. 

  246. 						</div>
    247. 

  247. 						<table class="params">
    248. 

  248. 							<tbody>
    249. 

  249. 								<tr>
    250. 

  250. 									<td class="name">
    251. 

  251. 										<strong>isActive</strong>
    252. 

  252. 									</td>
    253. 

  253. 									<td class="description last">
    254. 

  254. 										<p>If set to <code>true</code>, gizmos are more visible.</p>
    255. 

  255. 									</td>
    256. 

  256. 								</tr>
    257. 

  257. 							</tbody>
    258. 

  258. 						</table>
    259. 

  259. 					</div>
    260. 

  260. 					<h3 class="name name-method" id="copyState" translate="no">.<a href="#copyState">copyState</a><span class="signature">()</span> </h3>
    261. 

  261. 					<div class="method">
    262. 

  262. 						<div class="description">
    263. 

  263. 							<p>Copy the current state to clipboard (as a readable JSON text).</p>
    264. 

  264. 						</div>
    265. 

  265. 					</div>
    266. 

  266. 					<h3 class="name name-method" id="disposeGrid" translate="no">.<a href="#disposeGrid">disposeGrid</a><span class="signature">()</span> </h3>
    267. 

  267. 					<div class="method">
    268. 

  268. 						<div class="description">
    269. 

  269. 							<p>Removes the grid from the scene.</p>
    270. 

  270. 						</div>
    271. 

  271. 					</div>
    272. 

  272. 					<h3 class="name name-method" id="getRaycaster" translate="no">.<a href="#getRaycaster">getRaycaster</a><span class="signature">()</span><span class="type-signature"> : <a href="Raycaster.html">Raycaster</a></span> </h3>
    273. 

  273. 					<div class="method">
    274. 

  274. 						<div class="description">
    275. 

  275. 							<p>Returns the raycaster that is used for user interaction. This object is shared between all
    276. 

  276. instances of <code>ArcballControls</code>.</p>
    277. 

  277. 						</div>
    278. 

  278. 						<dl class="details">
    279. 

  279. 							<dt class="tag-returns"><strong>Returns:</strong> The internal raycaster.</dt>
    280. 

  280. 						</dl>
    281. 

  281. 					</div>
    282. 

  282. 					<h3 class="name name-method" id="pasteState" translate="no">.<a href="#pasteState">pasteState</a><span class="signature">()</span> </h3>
    283. 

  283. 					<div class="method">
    284. 

  284. 						<div class="description">
    285. 

  285. 							<p>Set the controls state from the clipboard, assumes that the clipboard stores a JSON
    286. 

  286. text as saved from <code>copyState()</code>.</p>
    287. 

  287. 						</div>
    288. 

  288. 					</div>
    289. 

  289. 					<h3 class="name name-method" id="reset" translate="no">.<a href="#reset">reset</a><span class="signature">()</span> </h3>
    290. 

  290. 					<div class="method">
    291. 

  291. 						<div class="description">
    292. 

  292. 							<p>Resets the controls.</p>
    293. 

  293. 						</div>
    294. 

  294. 					</div>
    295. 

  295. 					<h3 class="name name-method" id="saveState" translate="no">.<a href="#saveState">saveState</a><span class="signature">()</span> </h3>
    296. 

  296. 					<div class="method">
    297. 

  297. 						<div class="description">
    298. 

  298. 							<p>Saves the current state of the control. This can later be recover with <code>reset()</code>.</p>
    299. 

  299. 						</div>
    300. 

  300. 					</div>
    301. 

  301. 					<h3 class="name name-method" id="setCamera" translate="no">.<a href="#setCamera">setCamera</a><span class="signature">( camera : <span class="param-type"><a href="Camera.html">Camera</a></span> )</span> </h3>
    302. 

  302. 					<div class="method">
    303. 

  303. 						<div class="description">
    304. 

  304. 							<p>Sets the camera to be controlled.  Must be called in order to set a new camera to be controlled.</p>
    305. 

  305. 						</div>
    306. 

  306. 						<table class="params">
    307. 

  307. 							<tbody>
    308. 

  308. 								<tr>
    309. 

  309. 									<td class="name">
    310. 

  310. 										<strong>camera</strong>
    311. 

  311. 									</td>
    312. 

  312. 									<td class="description last">
    313. 

  313. 										<p>The camera to be controlled.</p>
    314. 

  314. 									</td>
    315. 

  315. 								</tr>
    316. 

  316. 							</tbody>
    317. 

  317. 						</table>
    318. 

  318. 					</div>
    319. 

  319. 					<h3 class="name name-method" id="setGizmosVisible" translate="no">.<a href="#setGizmosVisible">setGizmosVisible</a><span class="signature">( value : <span class="param-type">boolean</span> )</span> </h3>
    320. 

  320. 					<div class="method">
    321. 

  321. 						<div class="description">
    322. 

  322. 							<p>Sets gizmos visibility.</p>
    323. 

  323. 						</div>
    324. 

  324. 						<table class="params">
    325. 

  325. 							<tbody>
    326. 

  326. 								<tr>
    327. 

  327. 									<td class="name">
    328. 

  328. 										<strong>value</strong>
    329. 

  329. 									</td>
    330. 

  330. 									<td class="description last">
    331. 

  331. 										<p>Value of gizmos visibility.</p>
    332. 

  332. 									</td>
    333. 

  333. 								</tr>
    334. 

  334. 							</tbody>
    335. 

  335. 						</table>
    336. 

  336. 					</div>
    337. 

  337. 					<h3 class="name name-method" id="setMouseAction" translate="no">.<a href="#setMouseAction">setMouseAction</a><span class="signature">( operation : <span class="param-type">'PAN' | 'ROTATE' | 'ZOOM' | 'FOV'</span>, mouse : <span class="param-type">0 | 1 | 2 | 'WHEEL'</span>, key : <span class="param-type">'CTRL' | 'SHIFT'</span> )</span><span class="type-signature"> : boolean</span> </h3>
    338. 

  338. 					<div class="method">
    339. 

  339. 						<div class="description">
    340. 

  340. 							<p>Set a new mouse action by specifying the operation to be performed and a mouse/key combination. In case of conflict, replaces the existing one.</p>
    341. 

  341. 						</div>
    342. 

  342. 						<table class="params">
    343. 

  343. 							<tbody>
    344. 

  344. 								<tr>
    345. 

  345. 									<td class="name">
    346. 

  346. 										<strong>operation</strong>
    347. 

  347. 									</td>
    348. 

  348. 									<td class="description last">
    349. 

  349. 										<p>The operation to be performed ('PAN', 'ROTATE', 'ZOOM', 'FOV').</p>
    350. 

  350. 									</td>
    351. 

  351. 								</tr>
    352. 

  352. 								<tr>
    353. 

  353. 									<td class="name">
    354. 

  354. 										<strong>mouse</strong>
    355. 

  355. 									</td>
    356. 

  356. 									<td class="description last">
    357. 

  357. 										<p>A mouse button (0, 1, 2) or 'WHEEL' for wheel notches.</p>
    358. 

  358. 									</td>
    359. 

  359. 								</tr>
    360. 

  360. 								<tr>
    361. 

  361. 									<td class="name">
    362. 

  362. 										<strong>key</strong>
    363. 

  363. 									</td>
    364. 

  364. 									<td class="description last">
    365. 

  365. 										<p>The keyboard modifier ('CTRL', 'SHIFT') or null if key is not needed.</p>
    366. 

  366. 										<p>Default is <code>null</code>.</p>
    367. 

  367. 									</td>
    368. 

  368. 								</tr>
    369. 

  369. 							</tbody>
    370. 

  370. 						</table>
    371. 

  371. 						<dl class="details">
    372. 

  372. 							<dt class="tag-returns"><strong>Returns:</strong> <code>true</code> if the mouse action has been successfully added, <code>false</code> otherwise.</dt>
    373. 

  373. 						</dl>
    374. 

  374. 					</div>
    375. 

  375. 					<h3 class="name name-method" id="setTbRadius" translate="no">.<a href="#setTbRadius">setTbRadius</a><span class="signature">( value : <span class="param-type">number</span> )</span> </h3>
    376. 

  376. 					<div class="method">
    377. 

  377. 						<div class="description">
    378. 

  378. 							<p>Sets gizmos radius factor and redraws gizmos.</p>
    379. 

  379. 						</div>
    380. 

  380. 						<table class="params">
    381. 

  381. 							<tbody>
    382. 

  382. 								<tr>
    383. 

  383. 									<td class="name">
    384. 

  384. 										<strong>value</strong>
    385. 

  385. 									</td>
    386. 

  386. 									<td class="description last">
    387. 

  387. 										<p>Value of radius factor.</p>
    388. 

  388. 									</td>
    389. 

  389. 								</tr>
    390. 

  390. 							</tbody>
    391. 

  391. 						</table>
    392. 

  392. 					</div>
    393. 

  393. 					<h3 class="name name-method" id="unsetMouseAction" translate="no">.<a href="#unsetMouseAction">unsetMouseAction</a><span class="signature">( mouse : <span class="param-type">0 | 1 | 2 | 'WHEEL'</span>, key : <span class="param-type">'CTRL' | 'SHIFT'</span> )</span><span class="type-signature"> : boolean</span> </h3>
    394. 

  394. 					<div class="method">
    395. 

  395. 						<div class="description">
    396. 

  396. 							<p>Remove a mouse action by specifying its mouse/key combination.</p>
    397. 

  397. 						</div>
    398. 

  398. 						<table class="params">
    399. 

  399. 							<tbody>
    400. 

  400. 								<tr>
    401. 

  401. 									<td class="name">
    402. 

  402. 										<strong>mouse</strong>
    403. 

  403. 									</td>
    404. 

  404. 									<td class="description last">
    405. 

  405. 										<p>A mouse button (0, 1, 2) or 'WHEEL' for wheel notches.</p>
    406. 

  406. 									</td>
    407. 

  407. 								</tr>
    408. 

  408. 								<tr>
    409. 

  409. 									<td class="name">
    410. 

  410. 										<strong>key</strong>
    411. 

  411. 									</td>
    412. 

  412. 									<td class="description last">
    413. 

  413. 										<p>The keyboard modifier ('CTRL', 'SHIFT') or null if key is not needed.</p>
    414. 

  414. 										<p>Default is <code>null</code>.</p>
    415. 

  415. 									</td>
    416. 

  416. 								</tr>
    417. 

  417. 							</tbody>
    418. 

  418. 						</table>
    419. 

  419. 						<dl class="details">
    420. 

  420. 							<dt class="tag-returns"><strong>Returns:</strong> <code>true</code> if the operation has been successfully removed, <code>false</code> otherwise.</dt>
    421. 

  421. 						</dl>
    422. 

  422. 					</div>
    423. 

  423. 				<h2 class="subsection-title">Events</h2>
    424. 

  424. 					<h3 class="name name-method" id="event:change" translate="no">.<a href="#event:change">change</a> </h3>
    425. 

  425. 					<div class="method">
    426. 

  426. 						<div class="description">
    427. 

  427. 							<p>Fires when the camera has been transformed by the controls.</p>
    428. 

  428. 						</div>
    429. 

  429. 						<h5>Type:</h5>
    430. 

  430. 						<ul>
    431. 

  431. 							<li>
    432. 

  432. <span class="param-type">Object</span>
    433. 

  433. 							</li>
    434. 

  434. 						</ul>
    435. 

  435. 					</div>
    436. 

  436. 					<h3 class="name name-method" id="event:end" translate="no">.<a href="#event:end">end</a> </h3>
    437. 

  437. 					<div class="method">
    438. 

  438. 						<div class="description">
    439. 

  439. 							<p>Fires when an interaction has finished.</p>
    440. 

  440. 						</div>
    441. 

  441. 						<h5>Type:</h5>
    442. 

  442. 						<ul>
    443. 

  443. 							<li>
    444. 

  444. <span class="param-type">Object</span>
    445. 

  445. 							</li>
    446. 

  446. 						</ul>
    447. 

  447. 					</div>
    448. 

  448. 					<h3 class="name name-method" id="event:start" translate="no">.<a href="#event:start">start</a> </h3>
    449. 

  449. 					<div class="method">
    450. 

  450. 						<div class="description">
    451. 

  451. 							<p>Fires when an interaction was initiated.</p>
    452. 

  452. 						</div>
    453. 

  453. 						<h5>Type:</h5>
    454. 

  454. 						<ul>
    455. 

  455. 							<li>
    456. 

  456. <span class="param-type">Object</span>
    457. 

  457. 							</li>
    458. 

  458. 						</ul>
    459. 

  459. 					</div>
    460. 

  460. 				<h2 class="subsection-title">Source</h2>
    461. 

  461. 				<p>
    462. 

  462. 					<a href="https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/ArcballControls.js" translate="no" target="_blank" rel="noopener">examples/jsm/controls/ArcballControls.js</a>
    463. 

  463. 				</p>
    464. 

  464. 			</article>
    465. 

  465. 		</section>
    466. 

  466. <script src="../scripts/linenumber.js"></script>
    467. 

  467. <script src="../scripts/page.js"></script>
    468. 

  468. </body>
    469. 

  469. </html>
    470.
粤ICP备19079148号