Skip to content

Commit 6d01823

Browse files
authored
Docs:ArcballControls translation (#28643)
1 parent b30715a commit 6d01823

File tree

2 files changed

+286
-0
lines changed

2 files changed

+286
-0
lines changed
Lines changed: 285 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,285 @@
1+
<!DOCTYPE html>
2+
<html lang="ko">
3+
4+
<head>
5+
<meta charset="utf-8" />
6+
<base href="../../../" />
7+
<script src="page.js"></script>
8+
<link type="text/css" rel="stylesheet" href="page.css" />
9+
</head>
10+
11+
<body>
12+
[page:EventDispatcher] &rarr;
13+
14+
<h1>슬라이드 볼 컨트롤러([name])</h1>
15+
16+
<p class="desc">
17+
ArcballControls 완전한 터치 지원과 고급 내비게이션 기능을 갖춘 가상 궤적구를 통해 카메라를 제어할 수 있습니다.<br>
18+
커서/손가락 위치와 움직임은 작은 컨트롤로 표시된 가상 궤적구의 표면에 직관적이고 일관된 카메라 이동에 반사됩니다.커서를 드래그하거나 손가락을 드래그하면 사진기가 공의 중심을 중심으로 안정적으로 회전합니다. (원점으로 돌아가면 사진기가 원래 방향으로 돌아가게 됩니다).<br><br>
19+
20+
패닝, 확대/축소, 반공 제스처 지원 외에도 arcballcontrols는 두 번의 클릭/클릭을 통해 <i> 포커싱 </i> 기능을 제공하여, 오브젝트의 관심 지점을 가상 트랙볼의 중심으로 직관적으로 이동시킨다.초점은 복잡한 환경에서도 더 나은 검사와 방향을 제공한다.그밖에
21+
arcballcontrols는 fov 동작 (아찔한 동작)과 z 축 회전을 허용한다.또한 클립보드를 통해 카메라 상태를 저장하고 복원할 수 있다 (ctrl+c, ctrl+v 단축키를 사용하여 복사 및 붙여넣기 상태).<br><br>
22+
23+
[page:orbitcontrols], [page:trackballcontrols]와 달리 [name]은 애니메이션이 열릴 때 외부에서 호출될 필요가 없다 [page:.update].<br><br>
24+
25+
26+
이 기능을 사용하려면/examples 디렉터리에 있는 모든 파일과 마찬가지로 html 안에 별도로 포함시켜야 한다.。
27+
</p>
28+
29+
<h2>수입</h2>
30+
31+
<p>
32+
[name] 는 애드온이며 명시적으로 가져와야 합니다.
33+
See [link:#manual/introduction/Installation Installation / Addons]。
34+
</p>
35+
36+
<code>
37+
import { ArcballControls } from 'three/addons/controls/ArcballControls.js';
38+
</code>
39+
40+
<h2>코드 예시</h2>
41+
42+
<code>
43+
const renderer = new THREE.WebGLRenderer();
44+
renderer.setSize( window.innerWidth, window.innerHeight );
45+
document.body.appendChild( renderer.domElement );
46+
47+
const scene = new THREE.Scene();
48+
49+
const camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
50+
51+
const controls = new ArcballControls( camera, renderer.domElement, scene );
52+
53+
controls.addEventListener( 'change', function () {
54+
55+
renderer.render( scene, camera );
56+
57+
} );
58+
59+
//controls.update() must be called after any manual changes to the camera's transform
60+
camera.position.set( 0, 20, 100 );
61+
controls.update();
62+
</code>
63+
64+
<h2>예시</h2>
65+
66+
<p>[example:misc_controls_arcball misc / controls / arcball ]</p>
67+
68+
<h2>생성자</h2>
69+
70+
<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement], [param:Scene scene] )</h3>
71+
<p>
72+
[page:Camera camera]:(필수) 제어해야 할 카메라입니다.객체가 장면 자체가 아닌 한 카메라는 다른 객체의 하위 객체가 될 수 없습니다.<br><br>
73+
74+
[page:HTMLDOMElement domElement]: 이벤트 리스너를 위한 HTML 요소.<br><br>
75+
76+
[page:Scene scene]:카메라가 렌더링한 장면입니다.표시되지 않으면 위젯을 표시할 수 없습니다.
77+
</p>
78+
79+
<h2>이벤트</h2>
80+
81+
<h3>change</h3>
82+
<p>
83+
작은 컨트롤이 카메라를 변경할 때 작동합니다.
84+
</p>
85+
86+
<h3>start</h3>
87+
<p>
88+
상호작용이 시작될 때 촉발된다.
89+
</p>
90+
91+
<h3>end</h3>
92+
<p>
93+
상호 작용이 완료되었을 때 촉발된다.
94+
</p>
95+
96+
<h2>특성</h2>
97+
98+
<h3>[property:Boolean adjustNearFar]</h3>
99+
<p>
100+
true 라면 확대/축소할 때마다 카메라의 근거리 엔드와 원격 엔드를 조정하여 원래의 근거리 엔드와 원격 엔드의 보이는 부분을 동일하게 유지하려고 한다 ([page:PerspectiveCamera] 제한).기본값은 false입니다.
101+
102+
</p>
103+
104+
<h3>[property:Camera camera]</h3>
105+
<p>
106+
카메라가 조종됩니다.
107+
</p>
108+
109+
<h3>[property:Boolean cursorZoom]</h3>
110+
<p>
111+
크기 조정을 조정하려면 true로 설정했습니다.
112+
</p>
113+
114+
<h3>
115+
[property:Float dampingFactor]</h3>
116+
<p>
117+
[page:.enableanimations] 가 true인 경우 감쇠 관성을 사용한다.
118+
</p>
119+
120+
<h3>[property:HTMLDOMElement domElement]</h3>
121+
<p>
122+
HTMLDOMElement 마우스/터치 이벤트를 듣는 데 사용합니다.이것은 생성자 (생성자)에 전달되어야 한다.여기에서 변경하면 새 이벤트 리스너가 설정되지 않습니다.
123+
</p>
124+
125+
<h3>[property:Boolean enabled]</h3>
126+
<p>
127+
'false'로 설정되면 작은 컨트롤은 더 이상 사용자 상호작용에 응답하지 않습니다.기본값은'true'이다.
128+
</p>
129+
130+
<h3>[property:Boolean enableAnimations]</h3>
131+
<p>
132+
true로 설정하여 회전 (감쇠)과 초점 맞추기 동작을 위한 애니메이션을 활성화합니다.기본값은 true입니다.
133+
</p>
134+
135+
<h3>[property:Boolean enableGrid]</h3>
136+
<p>
137+
true로 설정하면 패닝 동작을 할 때 모드가 나타날 것입니다 (데스크톱 상호 작용할 때만).기본값은 false입니다.
138+
</p>
139+
140+
<h3>[property:Boolean enablePan]</h3>
141+
<p>
142+
카메라 펴기를 사용하거나 사용하지 않습니다.기본값은 true입니다.
143+
</p>
144+
145+
<h3>[property:Boolean enableRotate]</h3>
146+
<p>
147+
카메라 회전을 사용하거나 사용하지 않습니다.기본값은 true입니다.
148+
</p>
149+
150+
<h3>[property:Boolean enableZoom]</h3>
151+
<p>
152+
카메라 줌을 사용하거나 사용하지 않습니다.
153+
</p>
154+
155+
<h3>[property:Float focusAnimationTime]</h3>
156+
<p>
157+
초점 애니메이션의 지속 시간입니다.
158+
</p>
159+
160+
<h3>[property:Float maxDistance]</h3>
161+
<p>
162+
최대 이동 거리(다만 [page:PerspectiveCamera]).무한대로 묵인하다.
163+
</p>
164+
165+
<h3>[property:Float maxZoom]</h3>
166+
<p>
167+
최대 배율 값입니다(다만 [page:OrthographicCamera]).무한대로 묵인하다.
168+
</p>
169+
170+
<h3>[property:Float minDistance]</h3>
171+
<p>
172+
최소 이동 거리(다만 [page:PerspectiveCamera])。기본값은 0입니다。
173+
</p>
174+
175+
<h3>[property:Float minZoom]</h3>
176+
<p>
177+
최소 크기 조정(다만 [page:OrthographicCamera] )。기본값은 0입니다。
178+
</p>
179+
180+
<h3>[property:Float radiusFactor]</h3>
181+
<p>
182+
화면 너비와 높이에 대한 위젯의 크기입니다. 기본값은 0.67이다。
183+
</p>
184+
185+
<h3>[property:Float rotateSpeed]</h3>
186+
<p>
187+
회전 속도.기본값은 1입니다.
188+
</p>
189+
190+
<h3>[property:Float scaleFactor]</h3>
191+
<p>
192+
확대/축소 작업을 수행할 때 사용할 확대/축소 요인입니다.
193+
</p>
194+
195+
<h3>[property:Scene scene]</h3>
196+
<p>
197+
카메라가 렌더링한 장면입니다.
198+
</p>
199+
200+
<h3>[property:Float wMax]</h3>
201+
<p>
202+
회전 애니메이션을 시작할 때 허용되는 최대 각속도입니다.
203+
</p>
204+
205+
206+
<h2>메소드</h2>
207+
208+
<h3>[method:undefined activateGizmos] ( [param:Boolean isActive] )</h3>
209+
<p>
210+
작은 컨트롤을 어느 정도 보이게 합니다.
211+
</p>
212+
213+
<h3>[method:undefined copyState] ()</h3>
214+
<p>
215+
현재 상태를 클립보드에 복사 (읽을 수 있는 json 텍스트로).
216+
</p>
217+
218+
<h3>[method:undefined dispose] ()</h3>
219+
<p>
220+
모든 이벤트 리스너를 삭제하고, 처리할 애니메이션을 취소하며, 장면에서 작은 컨트롤과 그리드를 지운다.
221+
</p>
222+
223+
<h3>[method:undefined pasteState] ()</h3>
224+
<p>
225+
클립보드에서 컨트롤 상태를 설정합니다. 클립보드가 [page:.copyState]에서 저장된 json 텍스트를 저장한다고 가정한다.
226+
</p>
227+
228+
<h3>[method:undefined reset] ()</h3>
229+
위젯을 마지막 호출 [page:. saveState] 때의 상태나 원래 상태로 초기화합니다.
230+
</p>
231+
232+
<h3>[method:undefined saveState] ()</h3>
233+
<p>
234+
컨트롤의 현재 상태를 저장합니다.나중에 [page:.reset]을 통해 다시 시작할 수 있다.
235+
</p>
236+
237+
<h3>[method:undefined setCamera] ( [param:Camera camera] )</h3>
238+
<p>
239+
컨트롤할 카메라를 설정합니다.새 카메라를 제어하려면 호출되어야 합니다.
240+
</p>
241+
242+
<h3>[method:undefined setGizmosVisible] ( [param:Boolean value] )</h3>
243+
<p>
244+
작은 컨트롤의 보이는 속성을 설정합니다.
245+
</p>
246+
247+
<h3>[method:undefined setTbRadius] ( [param:Float value] )</h3>
248+
<p>
249+
`radiusFactor` 값을 업데이트하고, 작은 위젯을 다시 그리고 `changeEvent` 를 시각적으로 보낸다.
250+
</p>
251+
252+
<h3>[method:Boolean setMouseAction] ( [param:String operation], mouse, key )</h3>
253+
<p>
254+
실행할 동작과 마우스/키 조합을 지정하여 새로운 마우스 동작을 설정합니다.충돌이 발생하면 기존 것을 대체합니다.<br><br>
255+
작업은'rotate','pan','fov','zoom'으로 지정할 수 있다.<br>
256+
마우스 입력은 마우스 버튼 0, 1, 2 또는'휠'로 지정할 수 있다.<br>
257+
키보드 수정자는'ctrl','shift'또는 null(더 이상 필요하지 않을 경우)로 지정할 수 있다.
258+
</p>
259+
260+
<h3>[method:Boolean unsetMouseAction] ( mouse, key )</h3>
261+
<p>
262+
마우스/키 조합을 지정하여 마우스 동작을 삭제합니다.<br><br>
263+
마우스 입력은 마우스 버튼 0, 1, 2 또는'휠'로 지정할 수 있다.<br>
264+
키보드 수정자는'ctrl','shift'또는 null(더 이상 필요하지 않을 경우)로 지정할 수 있다.
265+
</p>
266+
267+
<h3>[method:undefined update] ()</h3>
268+
<p>
269+
컨트롤 업데이트.수동으로 카메라 변경을 한 후에 호출되어야 합니다.
270+
</p>
271+
272+
<h3>[method:Raycaster getRaycaster] ()</h3>
273+
<p>
274+
사용자 상호 작용을 위한 [page:raycaster] 객체를 되돌려준다.[name]의 [page:object3d.layer.layers] 속성이 설정되어 있으면 일치하는 값을 사용해야 한다. [page:raycaster.layers
275+
layers]의 [page:raycaster] 속성, 그렇지 않으면 [name]이 작동되지 않는다.
276+
</p>
277+
278+
<h2>Source</h2>
279+
280+
<p>
281+
[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/ArcballControls.js examples/jsm/controls/ArcballControls.js]
282+
</p>
283+
</body>
284+
285+
</html>

docs/list.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1352,6 +1352,7 @@
13521352
"Addons": {
13531353

13541354
"컨트롤": {
1355+
"ArcballControls": "examples/ko/controls/ArcballControls",
13551356
"DragControls": "examples/ko/controls/DragControls",
13561357
"FirstPersonControls": "examples/ko/controls/FirstPersonControls",
13571358
"FlyControls": "examples/ko/controls/FlyControls",

0 commit comments

Comments
 (0)