Răsfoiți Sursa

Merge pull request #20877 from kijunkim9/dev

docs: korean translation
Mr.doob 4 ani în urmă
părinte
comite
8b8e0c32b5

+ 339 - 0
docs/api/ko/animation/AnimationAction.html

@@ -0,0 +1,339 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+		<h1>[name]</h1>
+
+		<p class="desc">
+			AnimationActions는 [page:AnimationClip AnimationClips]에 저장된 애니메이션을 예약하는 데 사용됩니다.
+			<br /><br />
+
+			참고: 대부분의 애니메이션 액션 메소드들은 체인으로 연결되어 있습니다.<br /><br />
+
+			three.js 애니메이션 시스템 엘리먼트에 대한 개요들은 매뉴얼의 "Next Steps" 섹션에 있는 "애니메이션 시스템" 글을 참조하세요.
+		</p>
+
+
+		<h2>생성자</h2>
+
+
+		<h3>[name]( [param:AnimationMixer mixer], [param:AnimationClip clip], [param:Object3D localRoot] )</h3>
+		<p>
+			[page:AnimationMixer mixer] - 애니메이션 믹서는 애니메이션 액션에 의해 제어됩니다.<br />
+			[page:AnimationClip clip] - 애니메이션 클립은 애니메이션 액션에 대한 애니메이션 데이터를 보유하고 있습니다.<br />
+			[page:Object3D localRoot] - 루트 오브젝트는 애니메이션 액션을 수행합니다.<br /><br />
+
+			참고: 해당 생성자를 직접 호출하는 대신 [page:AnimationMixer.clipAction] 으로 AnimationAction을 인스턴스화 해야합니다. 해당 메소드는 더 나은 성능을 위한 캐싱을 제공하기 때문입니다.
+		</p>
+
+
+		<h2>속성</h2>
+
+
+		<h3>[property:Boolean clampWhenFinished]</h3>
+		<p>
+			*clampWhenFinished* 가 true로 설정 되었을 경우 자동으로 애니메이션의 마지막 프레임에서 [page:.paused paused] 됩니다.
+			<br /><br />
+
+			*clampWhenFinished* 가 false로 설정 되었을 경우 마지막 루프의 작업이 완료 될 때 [page:.enabled enabled]을 자동으로 false로 전환되어, 더이상 작업에 영향을 주지 않습니다. <br /><br />
+
+			초기값은 *false* 입니다.<br /><br />
+
+			참고: *clampWhenFinished* 는 작업이 중단될 경우 아무런 영향을 주지 않습니다 (마지막 루프를 실제로 완료된 경우에만 효과가 있음).
+			
+		</p>
+
+		<h3>[property:Boolean enabled]</h3>
+		<p>
+			*enabled* 를 *false* 로 설정하면 작업이 비활성화 되어 아무런 영향을 주지 않습니다. 기본값은 *true* 입니다. <br /><br />
+
+			애니메이션 액션이 다시 활성화되면, 현재 [page:.time time] 부터 연속적으로 애니메이션이 활성화 됩니다 (*enabled* 를 *false* 로 설정하면 애니메이션 액션이 초기화 되지 않습니다).<br /><br />
+
+			참고: *enabled* 를 *true* 로 설정해도 자동적으로 애니메이션이 재시작하지 않습니다. *enabled* 를 *true* 로 설정하면 다음 조건이 충족되는 경우에만 즉시 애니메이션을 시작합니다: 
+			[page:.paused paused] 가 *false* 인 경우, - 그동안 애니메이션 액션은 비활성화 되지 않습니다 
+			( [page:.stop stop] 또는 [page:.reset reset] 명령을 실행하여) 그리고 [page:.weight weight], [page:.timeScale timeScale] 는 둘 다 0 이 아닙니다.
+
+		</p>
+
+		<h3>[property:Number loop]</h3>
+		<p>
+			반복 모드 ([page:.setLoop setLoop] 으로 변경할 수 있습니다). 기본값은 [page:Animation THREE.LoopRepeat] ([page:.repetitions repetitions] 는 무한한 수를 포함)
+			<br /><br />
+
+			다음의 상수값 중 하나여야 함:<br /><br />
+			[page:Animation THREE.LoopOnce] - 클립 한번 재생 <br />
+			[page:Animation THREE.LoopRepeat] - 클립의 끝에서 시작 부분으로 즉시 이동할 때마다 선택한 *repetitions* 수 만큼 클립 재생 <br />
+			[page:Animation THREE.LoopPingPong] - 선택한 *repetitions* 수 만큼 클립을 앞뒤로 재생
+		</p>
+  
+			애니메이션 액션에서 수행된 [page:AnimationClip] 의 반복 횟수입니다.
+			[page:.setLoop setLoop]을 통해 설정할 수 있습니다. 기본값은 *무한대* 입니다. <br /><br />
+			[page:. loop loop mode] 가 [page:animation THREE.LoopOnce] 로 설정되어 있으면 숫자를 설정해도 아무런 영향을 미치지 않습니다.
+			
+		</p>
+
+		<h3>[property:Number time]</h3>
+		<p>
+			애니메이션 액션의 로컬 시간 속성 (초 단위, 0부터 시작).<br /><br />
+
+			시간 속성은 값이 고정 되거나, 반복 상태에 따라 0 ... clip.duration 으로 래핑 됩니다. 
+			[page:.timeScale timeScale] 을 변경하여 글로벌 믹서 타임을 상대적으로 확장할 수 있습니다 
+			([page:.setEffectiveTimeScale setEffectiveTimeScale] 또는 [page:.setDuration setDuration] 을 이용하여) <br />
+		</p>
+
+		<h3>[property:Number timeScale]</h3>
+		<p>
+			[page:.time time] 에 대한 스케일 팩터 속성입니다. 값이 0 일 경우 애니메이션은 중지됩니다.
+			음수 값 일 경우 애니메이션은 뒤로 재생 됩니다. 기본값은 *1* 입니다. <br /><br />
+			*timeScale* 과 관련된 속성/메소드는:
+			[page:.getEffectiveTimeScale getEffectiveTimeScale],
+			[page:.halt halt],
+			[page:.paused paused],
+			[page:.setDuration setDuration],
+			[page:.setEffectiveTimeScale setEffectiveTimeScale],
+			[page:.stopWarping stopWarping],
+			[page:.syncWith syncWith],
+			[page:.warp warp] 입니다.
+		</p>
+
+		<h3>[property:Number weight]</h3>
+		<p>
+			애니메이션 액션의 중요도에 대한 속성입니다 ([0,1] 간격). 
+			값은 *0* (영향 없음) 과 *1* (최대 영향) 사이의 값을 사용할 수 있고, 여러 액션들을 혼합해서 사용할 수 있습니다.
+			기본값은 *1* 입니다. <br /><br />
+			
+			*weight* 와 관련된 속성/메소드는:
+			[page:.crossFadeFrom crossFadeFrom],
+			[page:.crossFadeTo crossFadeTo],
+			[page:.enabled enabled],
+			[page:.fadeIn fadeIn],
+			[page:.fadeOut fadeOut],
+			[page:.getEffectiveWeight getEffectiveWeight],
+			[page:.setEffectiveWeight setEffectiveWeight],
+			[page:.stopFading stopFading] 입니다.
+		</p>
+
+		<h3>[property:Boolean zeroSlopeAtEnd]</h3>
+		<p>
+			시작, 루프 및 종료에 대해 별도의 클립없이 부드러운 보간이 가능합니다. 기본값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Boolean zeroSlopeAtStart]</h3>
+		<p>
+			시작, 루프 및 종료에 대해 별도의 클립없이 부드러운 보간이 가능합니다. 기본값은 *true* 입니다.
+		</p>
+
+
+		<h2>메소드</h2>
+
+
+		<h3>[method:AnimationAction crossFadeFrom]( [param:AnimationAction fadeOutAction], [param:Number durationInSeconds], [param:Boolean warpBoolean] )</h3>
+		<p>
+			해당 메소드는 [page:.fadeIn fade in] 을 수행하게 되고, 전달 된 시간 간격 내에서 동시에 다른 작업을 페이드 아웃을 수행합니다.
+			해당 메소드는 체인으로 연결될 수 있습니다. <br /><br />
+
+			만약 warpBoolean 이 true 일 경우, 추가적으로 [page.warp warping] 이 적용될 것입니다 (time scales 만큼 점차적으로 변경). <br /><br />
+
+			참고: *fadeIn*/*fadeOut* 처럼, 페이딩의 시작/종료의 가중치 값이 1일 때 동작됩니다.
+
+		</p>
+
+		<h3>[method:AnimationAction crossFadeTo]( [param:AnimationAction fadeInAction], [param:Number durationInSeconds], [param:Boolean warpBoolean] )</h3>
+		<p>
+			해당 메소드는 [page:.fadeOut fade out] 을 수행하게 되고, 전달 된 시간 간격 내에서 동시에 다른 작업을 페이드 인을 수행합니다.
+			해당 메소드는 체인으로 연결될 수 있습니다. <br /><br />
+			
+			만약 warpBoolean 이 true 일 경우, 추가적으로 [page.warp warping] 이 적용될 것입니다 (time scales 만큼 점차적으로 변경). <br /><br />
+			
+			참고: *fadeIn*/*fadeOut* 처럼, 페이딩의 시작/종료의 가중치 값이 1일 때 동작됩니다.
+
+		</p>
+
+		<h3>[method:AnimationAction fadeIn]( [param:Number durationInSeconds] )</h3>
+		<p>
+			전달된 시간 간격 내에서 페이드 인의 [page:.weight weight] 의 값을 0 에서 1으로 점차적으로 증가합니다. 
+			해당 메소드는 체인으로 연결할 수 있습니다.
+		</p>
+
+		<h3>[method:AnimationAction fadeOut]( [param:Number durationInSeconds] )</h3>
+		<p>
+			전달된 시간 간격 내에서 페이드 아웃의 [page:.weight weight] 의 값을 1 에서 0으로 점차적으로 감소합니다.
+			해당 메소드는 체인으로 연결할 수 있습니다.
+		</p>
+
+		<h3>[method:Number getEffectiveTimeScale]()</h3>
+		<p>
+			실질적인 타임 스케일을 반환합니다. (현재 워핑 상태 및 [page:.paused paused] 을 고려해야합니다).
+			
+		</p>
+
+		<h3>[method:number getEffectiveWeight]()</h3>
+		<p>
+			실질적인 가중치를 반환합니다. (현재 페이딩 상태 및 [page:.enabled enabled] 을 고려해야합니다).
+		</p>
+
+		<h3>[method:AnimationClip getClip]()</h3>
+		<p>
+			애니메이션 액션에 대한 애니메이션 데이터를 보관하는 클립을 반환합니다.
+		</p>
+
+		<h3>[method:AnimationMixer getMixer]()</h3>
+		<p>
+			애니메이션 액션을 재생할 애니메이션 믹서를 반환합니다.
+		</p>
+
+		<h3>[method:Object3D getRoot]()</h3>
+		<p>
+			애니메이션 액션이 수행되는 루트 객체를 반환합니다.
+		</p>
+
+		<h3>[method:AnimationAction halt]( [param:Number durationInSeconds] )</h3>
+		<p>
+			전달 된 시간 간격 내에서 [page:.timeScale timeScale]을 점차적으로 애니메이션 속도를 0으로 감소시킵니다(현재 값에서부터 시작).
+			해당 메소드는 체인으로 연결할 수 있습니다.
+		</p>
+
+		<h3>[method:Boolean isRunning]()</h3>
+		<p>
+			애니메이션 액션이 현재 [page:.time time] 동작중일 경우 true 을 반환합니다. <br /><br />
+
+			추가적으로 믹서에서 활성화되는 것 이외에 ([page:.isScheduled isScheduled] 참조) 다음 조건을 충족해야 합니다:
+			[page:.paused paused] 는 false 조건을 충족해야 합니다,
+			[page:.enabled enabled] 는 true 조건을 충족해야 합니다,
+			[page:.timeScale timeScale] 는 0이 아니여야 하고, ([page:.startAt start] 지연되지 않아야 합니다. <br /><br />
+
+			참고: *isRunning* 이 true 이여도 애니메이션이 실제 동작한다는 것을 의미하지는 않습니다.
+			[page : .weight weight] 가 0이 아닌 값으로 추가로 설정된 경우에만 해당됩니다.
+			
+		</p>
+
+		<h3>[method:Boolean isScheduled]()</h3>
+		<p>
+			만약 애니메이션 액션이 믹서에서 활성화 될 경우 true 를 반환합니다. <br /><br />
+			
+			참고: 해당 메소드는 애니메이션이 실제로 동작하고 있음을 의미하지는 않습니다. ([page:.isRunning isRunning] 에 대한 추가적인 비교 조건이 필요)
+			
+		</p>
+
+		<h3>[method:AnimationAction play]()</h3>
+		<p>
+			믹서에 애니메이션 액션을 활성화하도록 요청합니다. 해당 메소드는 체인으로 연결할 수 있습니다. <br /><br />
+
+			참고: 해당 메소드를 활성화 할 경우 반드시 애니메이션이 실행되는 것을 의미하지는 않습니다: 
+			만약 애니메이션 액션 작업이 이미 완료되었거나 (마지막 루프의 끝에 도달하여), 지연된 시작 시간이 설정된 경우([page:.startAt startAt] 을 통해), 먼저 [page:.reset rest]을 처음으로 실행해야 합니다.
+			일부 다른 설정 ([page:.paused paused] = true, [page:.enabled enabled] = false, [page:.weight weight] = 0, [page:.timeScale timeScale] = 0) 으로 인해 애니메이션이 재생되지 않을 수 있습니다.
+		</p>
+
+		<h3>[method:AnimationAction reset]()</h3>
+		<p>
+			애니메이션 액션을 재설정 합니다. 해당 메소드는 체인으로 연결할 수 있습니다. <br /><br />
+
+			해당 메소드는 
+			[page:.paused paused] 를 false로 설정합니다,
+			[page:.enabled enabled] 를 true로 설정합니다,
+			[page:.time time] 을 0으로 설정합니다,
+			미리 예약된 페이딩 및 워핑을 중단하고 내부 루프 수를 제거하고 시작을 지연시킵니다. <br /><br />
+
+			참고: *.reset* 은 항상 [page:.stop stop] 에 의해 호출됩니다 그러나, *reset* 은 스스로 *stop* 을 호출하지는 않습니다. <br/>
+			기술: 만약 당신이 *stop* 과 *reset* 둘다 호출하기를 원하면, *reset* 은 호출하지 말고 *stop* 을 해야합니다. <br/>
+		</p>
+
+		<h3>[method:AnimationAction setDuration]( [param:Number durationInSeconds] )</h3>
+		<p>
+			애니메이션 액션의 단일 루프의 기간을 설정합니다 ([page:.timeScale timeScale] 을 조정하고, 미리 예약된 워핑을 중단).
+			해당 메소드는 체인으로 연결할 수 있습니다.
+			
+		</p>
+
+		<h3>[method:AnimationAction setEffectiveTimeScale]( [param:Number timeScale] )</h3>
+		<p>
+			[page:.timeScale timeScale] 을 설정하고 예약된 워핑을 중단합니다. 해당 메소드는 체인으로 연결할 수 있습니다. <br /><br />
+
+			만약 [page:.paused paused] 가 false 일 경우, 실질적인 타임 스케일 (내부 속성) 값은 해당 timeScale 값으로 설정됩니다;
+			그렇지 않으면, 실질적인 타임 스케일 (현재 애니메이션에 직접적으로 영향을 미치는) 값은 0으로 설정됩니다. <br /><br />
+
+			참고: 해당 메소드로 인해 *timeScale* 의 값이 0 으로 설정 되어도 .*paused* 값은 자동적으로 *true* 로 변경되지 않습니다.
+			
+		</p>
+
+		<h3>[method:AnimationAction setEffectiveWeight]( [param:Number weight] )</h3>
+		<p>
+			[page:.weight weight] 이 설정되고 예약된 페이딩을 중지 합니다. 해당 메소드는 체인으로 연결할 수 있습니다. <br /><br />
+
+			만약 [page:..enabled enabled] 이 true 일 경우, 실질적인 가중치 (내부 속성* 값은 해당 weight 값으로 설정됩니다;
+			그렇지 않으면, 실질적인 가중치 (현재 애니메이션에 직접적으로 영향을 미치는) 값은 0으로 설정됩니다. <br /><br />
+	
+			참고: 해당 메소드로 인해 *weight* 의 값이 0 으로 설정 되어도 .*enabled* 값은 자동적으로 *false*로 변경되지 않습니다.
+		</p>
+
+		<h3>[method:AnimationAction setLoop]( [param:Number loopMode], [param:Number repetitions] )</h3>
+		<p>
+			[page:.loop loop mode] 및 [page:.repetitions repetitions] 의 횟수를 설정합니다. 해당 메소드는 체인으로 연결할 수 있습니다.
+		</p>
+
+		<h3>[method:AnimationAction startAt]( [param:Number startTimeInSeconds] )</h3>
+		<p>
+			
+			지연된 시작 이벤트를 정의합니다 (일반적으로 AnimationMixer.time + deltaTimeInSeconds에서 전달됨). 해당 메소드는 체인으로 연결할 수 있습니다. <br /><br />
+
+			참고: .[page:.startAt startAt] 메소드가 [page:.play play] 메소드와 함께 연결되어 있거나 애니메이션이 믹서에서 활성화 된 경우 (중지 또는 재설정없이 .*play* 를 먼저 호출하여) 애니메이션은 지정된 시간에만 시작됩니다.
+		</p>
+
+		<h3>[method:AnimationAction stop]()</h3>
+		<p>
+			믹서에게 애니메이션 액션을 비활성화하도록 설정합니다. 해당 메소드는 체인으로 연결할 수 있습니다. <br /><br />
+
+			해당 메소드를 실행하면 작업이 즉시 중단되고 완전히 재설정 [page:.rest rest] 됩니다. <br /><br />
+
+			참고: [page:.AnimationMixer.stopAllAction mixer.stopAllAction] 을 통해 같은 믹서에 있는 모든 활성된 작업들을 한번에 종료할 수 있습니다.
+
+		</p>
+
+		<h3>[method:AnimationAction stopFading]()</h3>
+		<p>
+			애니메이션 액션에 적용되어 있는 [page:.fadeIn fading] 을 종료합니다. 해당 메소드는 체인으로 연결할 수 있습니다.
+		</p>
+
+		<h3>[method:AnimationAction stopWarping]()</h3>
+		<p>
+			애니메이션 액션에 적용되어 있는 [page:.warp warping] 을 종료합니다. 해당 메소드는 체인으로 연결할 수 있습니다.
+		</p>
+
+		<h3>[method:AnimationAction syncWith]( [param:AnimationAction otherAction] )</h3>
+		<p>
+			애니메이션 액션을 전달된 다른 작업과 함께 동기화를 합니다. 해당 메소드는 체인으로 연결할 수 있습니다. <br /><br />
+
+			애니메이션 액션의 동기화는 [page:.time time] 및 [page:.timeScale timeScale] 값을 다른 작업의 값으로 대응되어 설정됩니다 (예약 된 워핑 중지). <br /><br />
+
+			참고: 다른 작업들의 *time* 및 *timeScale* 의  향후 변경 사항은 감지되지 않습니다.
+		</p>
+
+		<h3>[method:AnimationAction warp]( [param:Number startTimeScale], [param:Number endTimeScale], [param:Number durationInSeconds] )</h3>
+		<p>
+			들어오는 이벤트 간격에서 [page:.timeScale timeScale] 을 *startTimeScale* 에서 *endTimeScale* 로 점차적으로 재생 속도를 변경합니다. 해당 메소드는 체인으로 연결할 수 있습니다.
+		</p>
+
+
+		<h2>이벤트</h2>
+
+
+		<p class="desc">
+			단일 루프의 끝과 전체 작업의 ​​끝을 나타내는 두 가지 이벤트가 있습니다. 당신은 다음과 같이 응답 할 수 있습니다.
+		</p>
+		<code>
+		mixer.addEventListener( 'loop', function( e ) { …} ); // properties of e: type, action and loopDelta
+		mixer.addEventListener( 'finished', function( e ) { …} ); // properties of e: type, action and direction
+		</code>
+
+		<h2>소스</h2>
+
+		<p>
+			[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
+		</p>
+	</body>
+</html>

+ 95 - 0
docs/examples/ko/controls/DeviceOrientationControls.html

@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+
+		<h1>[name]</h1>
+
+		<p class="desc">
+			모바일 장치의 방향에 따라 카메라 방향을 조정하는 데 사용 됩니다.
+		</p>
+
+		<h2>예시</h2>
+
+		<p>[example:misc_controls_deviceorientation misc / controls / deviceorientation ]</p>
+
+		<h2>생성자</h2>
+
+		<h3>[name]( [param:Camera object] )</h3>
+		<p>
+			<p>
+				[page:Camera object]: 제어 할 카메라 객체 입니다.
+			</p>
+			<p>
+				 새로운 [name] 객체를 생성합니다.
+			</p>
+		</p>
+
+		<h2>이벤트</h2>
+
+		<h3>change</h3>
+		<p>
+			컨트롤에 의해 카메라가 변환되면 실행합니다.
+		</p>
+
+		<h2>속성</h2>
+
+		<h3>[property:Number alphaOffset]</h3>
+		<p>
+			알파 값의 오프셋의 단위는 라디안 입니다. 초기값은 0으로 지정됩니다.
+		</p>
+
+		<h3>[property:Object deviceOrientation]</h3>
+		<p>
+			현재 deviceorientation 이벤트 객체입니다.
+		</p>
+
+		<h3>[property:Boolean enabled]</h3>
+		<p>
+			컨트롤의 활성화 여부를 지정합니다.
+		</p>
+
+		<h3>[property:Camera object]</h3>
+		<p>
+			제어 할 카메라입니다.
+		</p>
+
+		<h3>[property:Number screenOrientation]</h3>
+		<p>
+			장치의 실제 방향을 기준으로 뷰포트의 방향을 지정합니다(90도 단위 기준). 초기값은 *0* 입니다.
+		</p>
+
+		<h2>메소드</h2>
+
+		<h3>[method:null connect] ()</h3>
+		<p>
+			컨트롤의 이벤트 리스너에 추가한 다음 활성화 합니다.
+		</p>
+
+		<h3>[method:null disconnect] ()</h3>
+		<p>
+			컨트롤의 이벤트 리스너에 제거한 다음 비활성화 합니다.
+		</p>
+
+		<h3>[method:null dispose] ()</h3>
+		<p>
+			컨트롤을 더이상 필요하지 않을 경우 호출해야 합니다.
+		</p>
+
+		<h3>[method:null update] ()</h3>
+		<p>
+			컨트롤을 업데이트 합니다. 보통 애니메이션 루프에서 호출 됩니다.
+		</p>
+
+		<h2>Source</h2>
+
+		<p>
+			[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/DeviceOrientationControls.js examples/jsm/controls/DeviceOrientationControls.js]
+		</p>
+	</body>
+</html>

+ 131 - 0
docs/examples/ko/controls/DragControls.html

@@ -0,0 +1,131 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<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>
+
+		<h2>코드 예시</h2>
+
+		<code>
+		const controls = new DragControls( objects, camera, renderer.domElement );
+
+		// 이벤트 리스너에 드래그 될 대상을 추가합니다.
+
+		controls.addEventListener( 'dragstart', function ( event ) {
+
+			event.object.material.emissive.set( 0xaaaaaa );
+
+		} );
+
+		controls.addEventListener( 'dragend', function ( event ) {
+
+			event.object.material.emissive.set( 0x000000 );
+
+		} );
+		</code>
+
+		<h2>예시</h2>
+
+		<p>[example:misc_controls_drag misc / controls / drag ]</p>
+
+		<h2>생성자</h2>
+
+		<h3>[name]( [param:Array objects], [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
+		<p>
+			<p>
+				[page:Array objects]: 드래그 가능한 3D 객체의 배열 입니다.
+			</p>
+			<p>
+			[page:Camera camera]: 렌더링 된 장면의 카메라입니다.
+			</p>
+			<p>
+			[page:HTMLDOMElement domElement]: 이벤트 리스너에 사용되는 HTML 엘리먼트입니다.
+			</p>
+			<p>
+				새로운 [name] 객체를 생성합니다.
+			</p>
+		</p>
+
+		<h2>이벤트</h2>
+
+		<h3>dragstart</h3>
+		<p>
+			사용자가 3D 객체를 첫번째로 드래그 할 경우 호출 됩니다.
+		</p>
+
+		<h3>drag</h3>
+		<p>
+			사용자가 3D 객체를 드래그 할 경우 호출 됩니다.
+		</p>
+
+		<h3>dragend</h3>
+		<p>
+			사용자가 3D 객체를 드래그를 완료하면 호출 됩니다.
+		</p>
+
+		<h3>hoveron</h3>
+		<p>
+			마우스 포인터가 3D 객체 위에 오거나, 자식 객체 위에 올 경우 호출 됩니다.
+		</p>
+
+		<h3>hoveroff</h3>
+		<p>
+			포인터가 3D 객체 밖으로 이동할 경우 호출 됩니다.
+		</p>
+
+		<h2>속성</h2>
+
+		<h3>[property:Boolean enabled]</h3>
+		<p>
+			컨트롤의 활성화 여부를 지정합니다.
+		</p>
+
+		<h3>[property:Boolean transformGroup]</h3>
+		<p>
+		
+			해당 속성은 [page:DragControls.objects] 배열에 드래그 가능한 단일 그룹 객체가 포함된 경우에만 작동합니다.
+			*true* 값으로 설정 되어있다면, [name]은 개별 객체가 아닌 전체 그룹은 드래그 합니다. 기본 값은 *false* 입니다.
+		</p>
+
+		<h2>메소드</h2>
+
+		<p>일반적인 메소드는 [page:EventDispatcher] 클래스를 참조하세요.</p>
+
+		<h3>[method:null activate] ()</h3>
+		<p>
+			컨트롤에 이벤트 리스너를 추가합니다.
+		</p>
+
+		<h3>[method:null deactivate] ()</h3>
+		<p>
+			컨트롤에 추가된 이벤트 리스너를 제거합니다.
+		</p>
+
+		<h3>[method:null dispose] ()</h3>
+		<p>
+			컨트롤이 더 이상 필요하지 않을 경우 호출해야 합니다.
+		</p>
+
+		<h3>[method:Array getObjects] ()</h3>
+		<p>
+			드래그 가능한 객체 배열을 반환 합니다.
+		</p>
+
+		<h2>Source</h2>
+
+		<p>
+			[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/DragControls.js examples/jsm/controls/DragControls.js]
+		</p>
+	</body>
+</html>

+ 164 - 0
docs/examples/ko/controls/FirstPersonControls.html

@@ -0,0 +1,164 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+
+		<h1>[name]</h1>
+
+		<p class="desc">
+			해당 클래스는 [page:FlyControls] 의 대안적인 구현 방법입니다.
+		</p>
+
+		<h2>예시</h2>
+
+		<p>[example:webgl_geometry_terrain webgl / geometry / terrain ]</p>
+
+		<h2>생성자</h2>
+
+		<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
+		<p>
+			<p>
+				[page:Camera object]: 제어 할 카메라 객체 입니다.
+			</p>
+			<p>
+				[page:HTMLDOMElement domElement]: 이벤트 리스너에 사용되는 HTML 엘리먼트입니다.
+			</p>
+			<p>
+				새로운 [name] 객체를 생성합니다.
+			</p>
+		</p>
+
+		<h2>속성</h2>
+
+		<h3>[property:Boolean activeLook]</h3>
+		<p>
+			주위를 둘러 볼 수 있는지 설정합니다. 기본 값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Boolean autoForward]</h3>
+		<p>
+			카메라가 자동으로 앞으로 이동 할 수 있는지 설정합니다. 기본 값은 *false* 입니다.
+		</p>
+
+		<h3>[property:Boolean constrainVertical]</h3>
+		<p>
+			[[page:.verticalMin], [page:verticalMax]]값을 수직으로 카메라를 고정할 수 있습니다. 기본 값은 *false* 입니다.
+		</p>
+
+		<h3>[property:HTMLDOMElement domElement]</h3>
+		<p>
+			마우스 / 터치 이벤트를 수신하는 데 사용되는 HTMLDOMElement입니다. 이것은 생성자에 의해 설정되어야 합니다; 
+			생성자를 통해 설정되지 않을 경우 새 이벤트 리스너에 설정되지 않습니다.
+		</p>
+
+		<h3>[property:Boolean enabled]</h3>
+		<p>
+			컨트롤의 활성화 여부를 설정합니다. 기본 값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Number heightCoef]</h3>
+		<p>
+			y-컴포넌트가 [page:.heightMax]에 가까울 경우 카메라가 얼마만큼 빠르게 움직이는 지 설정 합니다. 기본 값은 *1* 입니다.
+		</p>
+
+		<h3>[property:Number heightMax]</h3>
+		<p>
+			속도 조절에 사용되는 상단 카메라 높이를 설정합니다. 기본 값은 *1* 입니다.
+		</p>
+
+		<h3>[property:Number heightMin]</h3>
+		<p>
+			속도 조절에 사용되는 하단 카메라 높이를 설정합니다. 기본 값은 *0* 입니다.
+		</p>
+
+		<h3>[property:Boolean heightSpeed]</h3>
+		<p>
+			카메라의 높이가 이동 속도에 영향을 주는지 설정합니다. 기본 값은 *false* 입니다.
+			해당 속성을 사용하기 위해서는 [page:.heightCoef], [page:.heightMin] and [page:.heightMax]를 설정해야 합니다.
+		</p>
+
+		<h3>[property:Boolean lookVertical]</h3>
+		<p>
+			세로 축을 기준으로 주위를 둘러 볼 수 있는지 설정합니다. 기본 값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Number lookSpeed]</h3>
+		<p>
+			카메라의 look around 속도를 설정합니다. 기본 값은 *0.005* 입니다.
+		</p>
+
+		<h3>[property:Boolean mouseDragOn]</h3>
+		<p>
+			마우스를 눌러진 상태인지 나타냅니다. 해당 프로퍼티는 읽기 전용 입니다.
+		</p>
+
+		<h3>[property:Number movementSpeed]</h3>
+		<p>
+			카메라의 이동속도를 설정합니다. 기본 값은 *1* 입니다.
+		</p>
+
+		<h3>[property:Camera object]</h3>
+		<p>
+			제어 할 카메라 객체 입니다.
+		</p>
+
+		<h3>[property:Number verticalMax]</h3>
+		<p>
+			수직으로 주위를 둘러볼 수 있는 상한 범위를 지정합니다. 0 부터 Math.PI.radians 의 범위를 가집니다. 기본 값은 *Math.PI* 입니다.
+		</p>
+
+		<h3>[property:Number verticalMin]</h3>
+		<p>
+			수직으로 주위를 둘러볼 수 있는 하한 범위를 지정합니다. 0 부터 Math.PI.radians 의 범위를 가집니다. 기본 값은 *0* 입니다.
+		</p>
+
+		<h2>메소드</h2>
+
+		<h3>[method:null dispose] ()</h3>
+		<p>
+			컨트롤이 더 이상 필요하지 않을 경우 호출해야 합니다.
+		</p>
+
+		<h3>[method:null handleResize] ()</h3>
+		<p>
+			어플리케이션의 창 크기를 조절 하려면 호출해야 합니다.
+		</p>
+
+		<h3>[method:FirstPersonControls lookAt]( [param:Vector3 vector] )<br />
+		[method:FirstPersonControls lookAt]( [param:Float x], [param:Float y], [param:Float z] )</h3>
+		<p>
+			<p>
+				<p>
+					vector - 타겟 좌표를 설정합니다.
+				</p>
+				<p>
+					Optionally, x,y,z 컴포넌트는 특정 월드 좌표계 위치를 설정합니다.
+				</p>
+			</p>
+			<p>
+				카메라는 정의 된 타겟 좌표 쪽으로 가리키도록 합니다.
+			</p>
+		</p>
+
+		<h3>[method:null update] ( [param:Number delta] )</h3>
+		<p>
+			<p>
+				[page:Number delta]: 변화할 시간 값 입니다.
+			</p>
+			<p>
+				컨트롤을 업데이트 합니다. 보통 애니메이션 루프에서 호출 됩니다.
+			</p>
+		</p>
+
+		<h2>Source</h2>
+
+		<p>
+			[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/FirstPersonControls.js examples/jsm/controls/FirstPersonControls.js]
+		</p>
+	</body>
+</html>

+ 100 - 0
docs/examples/ko/controls/FlyControls.html

@@ -0,0 +1,100 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+
+		<h1>[name]</h1>
+
+		<p class="desc">
+			[name]는 DCC 툴인 블렌더의 비행 모드와 유사한 항해 시스템을 사용할 수 있습니다. 3D 공간에서 제한 없이 카메라를 임의로 변환할 수 있습니다. (e.g. 특정 타겟을 가리킬 때)
+	
+		</p>
+
+		<h2>예시</h2>
+
+		<p>[example:misc_controls_fly misc / controls / fly ]</p>
+
+		<h2>생성자</h2>
+
+		<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
+		<p>
+			<p>
+				[page:Camera object]: 제어 할 카메라 객체 입니다.
+			</p>
+			<p>
+				[page:HTMLDOMElement domElement]:이벤트 리스너에 사용되는 HTML 엘리먼트입니다.
+			</p>
+			<p>
+				새로운 [name] 객체를 생성합니다.
+			</p>
+		</p>
+
+		<h2>이벤트</h2>
+
+		<h3>change</h3>
+		<p>
+			컨트롤에 의해 카메라가 변환되면 호출됩니다.
+		</p>
+
+		<h2>특성</h2>
+
+		<h3>[property:Boolean autoForward]</h3>
+		<p>
+			*true* 으로 설정되어 있을 경우, 처음 변환이 될 때 카메라가 자동으로 앞으로 이동합니다(정지되지 않음). 기본값은 *false* 입니다.
+		</p>
+
+		<h3>[property:HTMLDOMElement domElement]</h3>
+		<p>
+			마우스 / 터치 이벤트를 수신하는 데 사용되는 HTMLDOMElement입니다. 이것은 생성자에 의해 설정되어야 합니다; 
+			생성자를 통해 설정되지 않을 경우 새 이벤트 리스너에 설정되지 않습니다.
+		</p>
+
+		<h3>[property:Boolean dragToLook]</h3>
+		<p>
+			*true* 으로 설정되어 있을 경우, 드래그 상호 작용을 수행해야만 주변을 둘러볼 수 있습니다. 기본값은 *false* 입니다.
+		</p>
+
+		<h3>[property:Number movementSpeed]</h3>
+		<p>
+			이동 속도를 설정할 수 있습니다. 기본값은 *1* 입니다.
+		</p>
+
+		<h3>[property:Camera object]</h3>
+		<p>
+			제어 할 카메라를 객체 입니다.
+		</p>
+
+		<h3>[property:Number rollSpeed]</h3>
+		<p>
+			회전 속도를 설정합니다. 기본값은 *0.005* 입니다.
+		</p>
+
+		<h2>메소드</h2>
+
+		<h3>[method:null dispose] ()</h3>
+		<p>
+			컨트롤을 더이상 필요하지 않을 경우 호출해야 합니다.
+		</p>
+
+		<h3>[method:null update] ( [param:Number delta] )</h3>
+		<p>
+			<p>
+				[page:Number delta]: 변화할 시간값.
+			</p>
+			<p>
+				컨트롤을 업데이트 합니다. 보통 애니메이션 루프에서 호출됩니다.
+			</p>
+		</p>
+
+		<h2>Source</h2>
+
+		<p>
+			[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/FlyControls.js examples/jsm/controls/FlyControls.js]
+		</p>
+	</body>
+</html>

+ 307 - 0
docs/examples/ko/controls/OrbitControls.html

@@ -0,0 +1,307 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+		<h1>[name]</h1>
+
+		<p class="desc">
+		궤도 컨트롤을 사용하면 카메라가 대상 주위를 공전 할 수 있습니다.<br>
+
+		이것을 사용하려면, / examples 디렉토리의 모든 파일들이 HTML에 별도의 파일을 포함해야합니다.
+
+		</p>
+
+		<h2>코드 예시</h2>
+
+		<code>
+		const renderer = new THREE.WebGLRenderer();
+		renderer.setSize( window.innerWidth, window.innerHeight );
+		document.body.appendChild( renderer.domElement );
+
+		const scene = new THREE.Scene();
+
+		const camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
+
+		const controls = new OrbitControls( camera, renderer.domElement );
+
+		//controls.update()는 카메라 변환설정을 수동으로 변경한 후에 호출해야 합니다.
+		camera.position.set( 0, 20, 100 );
+		controls.update();
+
+		function animate() {
+
+			requestAnimationFrame( animate );
+
+			// 만약 controls.enableDamping, controls.autoRotate 둘 중 하나라도 true로 설정될 경우 필수로 호출되어야 합니다.
+			controls.update();
+
+			renderer.render( scene, camera );
+
+		}
+		</code>
+
+		<h2>예시</h2>
+
+		<p>[example:misc_controls_orbit misc / controls / orbit ]</p>
+
+		<h2>생성자</h2>
+
+		<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
+		<p>
+			[page:Camera object]: (필수) 제어할 카메라 객체 입니다. 해당 객체가 장면에 포함되지 않을 경우 다른 객체의 자식이 아니여야 합니다..<br><br>
+
+			[page:HTMLDOMElement domElement]: 이벤트 리스너에 사용되는 HTML 엘리먼트입니다.
+		</p>
+
+		<h2>이벤트</h2>
+
+		<h3>change</h3>
+		<p>
+			컨트롤에 의해 카메라가 변환되면 호출됩니다.
+		</p>
+
+		<h3>start</h3>
+		<p>
+			상호 작용이 시작되면 호출됩니다.
+		</p>
+
+		<h3>end</h3>
+		<p>
+			상호 작용이 끝나면 호출됩니다.
+		</p>
+
+		<h2>특성</h2>
+
+		<h3>[property:Boolean autoRotate]</h3>
+		<p>
+			대상 주위를 자동으로 회전하려면 true로 설정합니다.<br> autoRotate를 활성할 경우, 애니메이션 루프에서 [page:.update()]를 호출해야 합니다.
+			
+		</p>
+
+		<h3>[property:Float autoRotateSpeed]</h3>
+		<p>
+			[page:.autoRotate]가 true일 경우, 타겟을 기준으로 주위의 회전 속도를 설정합니다. 기본값은 2.0 이고, 60fps에서 회전 당 30초에 해당합니다.
+			<br>만약 [page:.autoRotate]를 활성할 경우, 에니메이션 루프에서 [page:.update]를 호출해야 합니다.
+		</p>
+
+		<h3>
+			[property:Float dampingFactor]</h3>
+		<p> [page:.enableDamping]이 true일 경우 에니메이션 루프에서 [page:.update]()를 호출해야만 감쇠 관성를 사용할 수 있습니다.
+		</p>
+
+		<h3>[property:HTMLDOMElement domElement]</h3>
+		<p>
+			마우스 / 터치 이벤트를 수신하는 데 사용되는 HTMLDOMElement입니다. 이것은 생성자에 의해 설정되어야 합니다; 생성자를 통해 설정되지 않을 경우 새 이벤트 리스너에 설정되지 않습니다.
+		</p>
+
+		<h3>[property:Boolean enabled]</h3>
+		<p>
+			*false*로 설정할 경우, 컨트롤은 사용자 입력에 응답하지 못합니다. 기본값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Boolean enableDamping]</h3>
+		<p>
+			컨트롤의 가중치를 부여하는 데 사용할 수있는 댐핑 (관성)을 활성화하려면 true로 설정합니다.<br>
+			만약 enableDamping을 활성화 할 경우, 애니메이션 루프에서 [page:.update]를 호출해야 합니다.
+		</p>
+
+		<h3>[property:Boolean enableKeys]</h3>
+		<p>
+			키보드 컨트롤의 활성화 또는 비활성화를 설정합니다. 기본값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Boolean enablePan]</h3>
+		<p>
+			카매라 패닝의 활성화 또는 비활성화를 설정합니다. 기본값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Boolean enableRotate]</h3>
+		<p>
+			카메라의 수직 및 수평 회전의 활성화 또는 비활성화를 설정합니다. 기본값은 *true* 입니다.<br>
+			[page:.minPolarAngle polar angle] 또는 page:.minAzimuthAngle azimuth angle]의 최소 및 최대를 동일한 값으로 설정하여 단일 축을 비활성화 할 수 있습니다. 
+			그러면 수직 또는 수평 회전이 해당 값으로 고정됩니다.
+			
+		</p>
+
+		<h3>[property:Boolean enableZoom]</h3>
+		<p>
+			카메라 확대 / 축소 (dollying)를 활성화 또는 비활성화를 설정합니다.
+		</p>
+
+		<h3>[property:Float keyPanSpeed]</h3>
+		<p>
+			키보드를 사용할 때 카메라를 패닝하는 속도를 설정합니다. 기본값은 키 누름 당 7.0 픽셀입니다.
+		</p>
+
+		<h3>[property:Object keys]</h3>
+		<p>
+			해당 객체는 카메라 패닝을 제어하기위한 키 코드에 대한 참조를 포함합니다. 기본값은 4 개의 화살표 키입니다.
+			<code>
+controls.keys = {
+	LEFT: 37, // 왼쪽 화살표
+	UP: 38, // 위쪽 화살표
+	RIGHT: 39, // 오른쪽 화살표
+	BOTTOM: 40 // 아래쪽 화살표
+}
+			 </code> 
+			 전체 키코드 목록은 [link:https://developer.mozilla.org/ko/docs/Web/API/KeyboardEvent/keyCode this page] 를 참조하세요.
+		</p>
+
+		<h3>[property:Float maxAzimuthAngle]</h3>
+		<p>
+			수평으로 궤도를 얼마나 돌 수 있는지 상한을 설정합니다. [ min, max ] 	의 간격은 ( max - min < 2 PI ) 와 함께 ( max - min < 2 PI ) 의 하위 간격이어야 합니다. 기본값은 무한대입니다.
+		</p>
+
+		<h3>[property:Float maxDistance]</h3>
+		<p>
+			달리 아웃(dolly out)할 수 있는 최대 거리를 설정합니다. ([page:PerspectiveCamera] only). 기본값은 무한대입니다.
+		</p>
+
+		<h3>[property:Float maxPolarAngle]</h3>
+		<p>
+			수직으로 궤도를 얼마나 돌 수 있는지 상한을 설정합니다. 0 부터 Math.PI radians 까지 범위를 가질 수 있습니다. 기본값은 Math.PI 입니다.
+		</p>
+
+		<h3>[property:Float maxZoom]</h3>
+		<p>
+			축소 할 수 있는 범위를 설정합니다.( [page:OrthographicCamera] only ). 기본값은 무한대입니다.
+		</p>
+
+		<h3>[property:Float minAzimuthAngle]</h3>
+		<p>
+			수평으로 궤도를 얼마나 돌 수 있는지 하한을 설정합니다. [ min, max ] 의 간격은 ( max - min < 2 PI ) 와 함께 ( max - min < 2 PI ) 의 하위 간격이어야 합니다. 기본값은 무한대입니다.
+		</p>
+
+		<h3>[property:Float minDistance]</h3>
+		<p>
+			달리 인(dolly in)할 수 있는 최소 거리를 설정합니다. ([page:PerspectiveCamera] only). 기본값은 0 입니다.
+		</p>
+
+		<h3>[property:Float minPolarAngle]</h3>
+		<p>
+			수직으로 궤도를 얼마나 돌 수 있는지 하한을 설정합니다. 0 부터 Math.PI radians 까지 범위를 가질 수 있습니다. 기본값은 0 입니다.
+		</p>
+
+		<h3>[property:Float minZoom]</h3>
+		<p>
+			확대 할 수 있는 범위를 설정합니다. ( [page:OrthographicCamera] only ). 기본값은 0 입니다.
+		</p>
+
+		<h3>
+			[property:Object mouseButtons]</h3>
+		<p>
+			해당 객체는 컨트롤에서 사용하는 마우스 동작에 대한 참조를 포함합니다.
+			<code>
+controls.mouseButtons = {
+	LEFT: THREE.MOUSE.ROTATE,
+	MIDDLE: THREE.MOUSE.DOLLY,
+	RIGHT: THREE.MOUSE.PAN
+}
+			</code>
+		</p>
+
+		<h3>[property:Camera object]</h3>
+		<p>
+			제어할 카메라 객체입니다.
+		</p>
+
+		<h3>[property:Float panSpeed]</h3>
+		<p>
+			패닝 속도를 설정합니다. 기본값은 1입니다.
+		</p>
+
+		<h3>[property:Vector3 position0]</h3>
+		<p>
+			해당 프로퍼티는 [method:saveState] 및 [method:reset] 메서드에서 내부적으로 사용합니다.
+		</p>
+
+		<h3>[property:Float rotateSpeed]</h3>
+		<p>
+			회전 속도를 설정합니다. 기본값은 1입니다.
+		</p>
+
+		<h3>[property:Boolean screenSpacePanning]</h3>
+		<p>
+		패닝할 떄, 카메라 위치가 변환되는 방식를 정의합니다. 만약 true일 경우, 카메라가 화면 공간에서 이동합니다.
+		Otherwise, the camera pans in the plane orthogonal to the camera's up direction.
+		OrbitControls의 경우 기본값은 true 이고, MapControls의 경우 기본값은 false 입니다.
+		</p>
+
+		<h3>[property:Vector3 target0]</h3>
+		<p>
+			[method:saveState] 및 [method:rest] 메서드에서 내부적으로 사용합니다.
+		</p>
+
+		<h3>[property:Vector3 target]</h3>
+		<p>
+			컨트롤의 중요 포인트는, [page:.object] 를 중심으로 회전하는 것입니다. 컨트롤의 중요 포인트는 언제든지 수동으로 변경할 수 있습니다.
+		</p>
+
+		<h3>[property:Object touches]</h3>
+		<p>
+			해당 객체는 컨트롤에 사용되는 터치 동작에 대한 참조를 포함합니다.
+			<code>
+controls.touches = {
+	ONE: THREE.TOUCH.ROTATE,
+	TWO: THREE.TOUCH.DOLLY_PAN
+}
+			</code>
+		</p>
+
+		<h3>[property:Float zoom0]</h3>
+		<p>
+			[method:saveState] 및 [method:reset] 메서드에서 내부적으로 사용합니다.
+		</p>
+
+		<h3>[property:Float zoomSpeed]</h3>
+		<p>
+			줌잉(Zooming)과 달링(Dollying)의 속도를 설정합니다. 기본값은 1 입니다.
+		</p>
+
+
+
+		<h2>메서드</h2>
+
+		<h3>[method:null dispose] ()</h3>
+		<p>
+			모든 이벤트 리스너를 삭제합니다.
+			Remove all the event listeners.
+		</p>
+
+		<h3>[method:radians getAzimuthalAngle] ()</h3>
+		<p>
+			라디안 단위로 현재 수평 회전값을 가져옵니다.
+		</p>
+
+		<h3>[method:radians getPolarAngle] ()</h3>
+		<p>
+			라디안 단위로 현재 수직 회전값을 가져옵니다.
+		</p>
+
+		<h3>[method:null reset] ()</h3>
+		<p>
+			컨트롤이 마지막으로 호출된 [page:.saveState] 시점으로 돌리거나, 초기상태로 재설정합니다.
+		</p>
+
+		<h3>[method:null saveState] ()</h3>
+		<p>
+			컨트롤의 현재 상태를 저장합니다. 나중에 [page:.rest]을 이용하여 현재 상태로 복구할 수 있습니다.
+		</p>
+
+		<h3>[method:Boolean update] ()</h3>
+		<p>
+			컨트롤을 업데이트합니다. 카메라를 수동으로 변환하거나, [page:.autoRotate] 또는 [page:.enableDamping]을 설정할 경우 업데이트 루프에서 호출해야 합니다.
+		</p>
+
+		<h2>Source</h2>
+
+		<p>
+			[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/OrbitControls.js examples/jsm/controls/OrbitControls.js]
+		</p>
+	</body>
+</html>

+ 158 - 0
docs/examples/ko/controls/PointerLockControls.html

@@ -0,0 +1,158 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<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">
+		해당 클래스의 구현은 [link:https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API Pointer Lock API] 를 기반으로 합니다. [name] 은 1 인칭 3D 게임을 위한 완벽한 선택입니다.
+		</p>
+
+		<h2>Code Example</h2>
+
+		<code>
+		const controls = new PointerLockControls( camera, document.body );
+
+		// UI를 표시하거나 숨기기 위해 이벤트 리스너를 추가합니다. (예시: 게임 메뉴)
+
+		controls.addEventListener( 'lock', function () {
+
+			menu.style.display = 'none';
+
+		} );
+
+		controls.addEventListener( 'unlock', function () {
+
+			menu.style.display = 'block';
+
+		} );
+		</code>
+
+		<h2>예시</h2>
+
+		<p>[example:misc_controls_pointerlock misc / controls / pointerlock ]</p>
+
+		<h2>생성자</h2>
+
+		<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
+		<p>
+			<p>
+			[page:Camera camera]: 렌더링 된 장면의 카메라입니다.
+			</p>
+			<p>
+			[page:HTMLDOMElement domElement]: 이벤트 리스너에 사용되는 HTML 엘리먼트입니다.
+			</p>
+			<p>
+				새로운 [name] 객체를 생성합니다.
+			</p>
+		</p>
+
+		<h2>이벤트</h2>
+
+		<h3>change</h3>
+		<p>
+			사용자 마우스가 움직일 떄 호출됩니다.
+		</p>
+
+		<h3>lock</h3>
+		<p>
+			포인터의 잠금 상태가 "잠김" 일 때 호출됩니다 (in other words: the mouse is captured).
+		</p>
+
+		<h3>unlock</h3>
+		<p>
+			포인터의 잠금 상태가 "잠금 해제" 일 때 호출됩니다. (in other words: the mouse is not captured anymore)
+		</p>
+
+		<h2>특성</h2>
+
+		<h3>[property:HTMLDOMElement domElement]</h3>
+		<p>
+			마우스 / 터치 이벤트를 수신하는 데 사용되는 HTMLDOMElement입니다. 이것은 생성자에 의해 설정되어야 합니다; 
+			생성자를 통해 설정되지 않을 경우 새 이벤트 리스너에 설정되지 않습니다.
+		</p>
+
+
+		<h3>[property:Boolean isLocked]</h3>
+		<p>
+			컨트롤의 잠김 여부를 설정합니다.
+		</p>
+
+		<h3>[property:Float maxPolarAngle]</h3>
+		<p>
+			카메라 피치(pitch)의 상한값을 설정합니다. 0 부터 Math.PI 라디안까지 범위를 가질 수 있습니다. 기본값은 Math.PI 입니다.
+		</p>
+
+		<h3>[property:Float minPolarAngle]</h3>
+		<p>
+			카메라 피치(pitch)의 하한값을 설정합니다. 0 부터 Math.PI 라디안까지 범위를 가질 수 있습니다. 기본값은 0 입니다.
+		</p>
+
+		<h2>메소드</h2>
+		<p>일반적인 메소드는 [page:EventDispatcher] 클래스를 참조하세요.</p>
+		
+
+		<h3>[method:null connect] ()</h3>
+		<p>
+			컨트롤의 이벤트 리스너를 추가합니다.			
+		</p>
+
+		<h3>[method:null disconnect] ()</h3>
+		<p>
+			컨트롤의 이벤트 리스너를 제거합니다.
+		</p>
+
+		<h3>[method:Vector3 getDirection] ( [param:Vector3 target] )</h3>
+		<p>
+			<p>
+				[page:Vector3 target]: 타겟 벡터를 의미합니다.
+			</p>
+			<p>
+				카메라가 보고있는 방향을 반환합니다.
+			</p>
+		</p>
+
+		<h3>[method:null lock] ()</h3>
+		<p>
+			포인터 잠금을 활성화합니다.
+		</p>
+
+		<h3>[method:null moveForward] ( [param:Number distance] )</h3>
+		<p>
+			<p>
+				[page:Number distance]: 앞으로 이동할 거리를 설정합니다.
+			</p>
+			<p>
+				카메라를 xz-평면에 평행하게 앞으로 이동합니다. camera.up을 y-up이라고 가정합니다.
+			</p>
+		</p>
+
+		<h3>[method:null moveRight] ( [param:Number distance] )</h3>
+		<p>
+			<p>
+				[page:Number distance]: 오른쪽으로 이동할 거리를 설정합니다.
+			</p>
+			<p>
+				카메라를 xz 평면에 평행하게 옆으로 이동합니다.
+			</p>
+		</p>
+
+		<h3>[method:null unlock] ()</h3>
+		<p>
+			포인터 잠금을 종료합니다.
+		</p>
+
+		<h2>Source</h2>
+
+		<p>
+			[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/PointerLockControls.js examples/jsm/controls/PointerLockControls.js]
+		</p>
+	</body>
+</html>

+ 208 - 0
docs/examples/ko/controls/TrackballControls.html

@@ -0,0 +1,208 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+		[page:EventDispatcher] &rarr;
+
+		<h1>[name]</h1>
+
+		<p class="desc">
+			<p>
+				[name] 는 [page:OrbitControls] 와 유사하지만, 카메라의 일정한 [page:Object3D.up up] vector 값을 유지하지 않습니다.
+				이 말인즉슨, 카메라가 위쪽 방향이나 아럐쪽 방향으로 회전할 경우, "오른쪽을 위로" 유지하기 위해 뒤집을 수 없습니다.
+			</p>
+		</p>
+
+		<h2>예시</h2>
+
+		<p>[example:misc_controls_trackball misc / controls / trackball ]</p>
+
+		<h2>생성자</h2>
+
+		<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
+		<p>
+			<p>
+				[page:Camera camera]: 렌더링 된 장면의 카메라입니다.
+			</p>
+			<p>
+				[page:HTMLDOMElement domElement]: 이벤트 리스너에 사용되는 HTML 엘리먼트입니다.
+			</p>
+			<p>
+				새로운 [name] 객체를 생성합니다.
+			</p>
+		</p>
+
+		<h2>이벤트</h2>
+
+		<h3>change</h3>
+		<p>
+			컨트롤에 의해 카메라가 변환될 경우 호출됩니다.
+		</p>
+
+		<h3>start</h3>
+		<p>
+			처음으로 상호 작용이 실행되면 호출됩니다. (e.g. 터치패드)
+		</p>
+
+		<h3>end</h3>
+		<p>
+			상호 작용이 완료되면 호출됩니다.
+		</p>
+
+		<h2>특성</h2>
+
+		<h3>[property:HTMLDOMElement domElement]</h3>
+		<p>
+			마우스 / 터치 이벤트를 수신하는 데 사용되는 HTMLDOMElement입니다. 이것은 생성자에 의해 설정되어야 합니다; 생성자를 통해 설정되지 않을 경우 새 이벤트 리스너에 설정되지 않습니다.
+		</p>
+
+		<h3>[property:Number dynamicDampingFactor]</h3>
+		<p>
+			댐핑의 강도를 조절합니다. [page:.staticMoving staticMoving] 이 * false * 로 설정된 경우에만 고려됩니다. 기본값은 *0.2* 입니다.
+		</p>
+
+		<h3>[property:Boolean enabled]</h3>
+		<p>
+			컨트롤을 활성화 여부를 설정합니다.
+		</p>
+
+		<h3>[property:Array keys]</h3>
+		<p>
+			이 배열은 상호 작용을 제어하기위한 키 코드를 보유합니다.
+			<ul>
+				<li>처음 정의 된 키를 누르면 모든 마우스 상호 작용 (왼쪽, 가운데, 오른쪽)이 궤도를 회전합니다.</li>
+				<li>두 번째로 정의 된 키를 누르면 모든 마우스 상호 작용 (왼쪽, 가운데, 오른쪽)이 확대 / 축소를 수행합니다.</li>
+				<li>세 번째로 정의 된 키를 누르면 모든 마우스 상호 작용 (왼쪽, 가운데, 오른쪽)이 패닝을 수행합니다.</li>
+			</ul>
+			기본값은 A, S, D를 나타내는 * 65, 83, 68 *입니다.
+		</p>
+
+		<h3>[property:Number maxDistance]</h3>
+		<p>
+			축소할 수 있는 범위를 설정합니다. 기본값은 *무한대* 입니다.
+		</p>
+
+		<h3>[property:Number minDistance]</h3>
+		<p>
+			확대할 수 있는 범위를 설정합니다. 기본값은 *0* 입니다.
+		</p>
+
+		<h3>
+			[property:Object mouseButtons]</h3>
+		<p>
+			해당 객체는 컨트롤에서 사용하는 마우스 동작에 대한 참조를 포함합니다.
+			<ul>
+				<li>.LEFT 는 *THREE.MOUSE>ROTATE* 에 대입됩니다.</li>
+				<li>.MIDDLE 은 *THREE.MOUSE.ZOOM* 에 대입됩니다.</li>
+				<li>.RIGHT 는 *THREE.MOUSE.PAN* 에 대입됩니다.</li>
+			</ul>
+		</p>
+
+		<h3>[property:Boolean noPan]</h3>
+		<p>
+			패닝의 비활성화 여부를 설정합니다. 기본값은 *false* 입니다.
+		</p>
+
+		<h3>[property:Boolean noRotate]</h3>
+		<p>
+			회전의 비활성화 여부를 설정합니다. 기본값은 *false* 입니다.
+		</p>
+
+		<h3>[property:Boolean noZoom]</h3>
+		<p>
+			줌잉의 비활성화 여부를 설정합니다. 기본값은 *false* 입니다.
+		</p>
+
+		<h3>[property:Camera object]</h3>
+		<p>
+			제어할 카메라 객체입니다.
+		</p>
+
+		<h3>[property:Number panSpeed]</h3>
+		<p>
+			확대 속도를 설정합니다. 기본값은 *0.3* 입니다.
+		</p>
+
+		<h3>[property:Number rotateSpeed]</h3>
+		<p>
+			회전 속도를 설정합니다. 기본값은 *1.0* 입니다.
+		</p>
+
+		<h3>[property:Object screen]</h3>
+		<p>
+			화면 속성을 나타냅니다. [page:.handleResize handleResize]()을 호출할 시 자동적으로 설정됩니다.
+			<ul>
+				<li>왼쪽: 화면의 왼쪽 경계면의 오프셋을 픽셀 단위로 나타냅니다.</li>
+				<li>상단: 화면의 상단 경계면의 오프셋을 픽셀 단위로 나타냅니다.</li>
+				<li>넓이: 화면의 넓이를 픽셀 단위로 나타냅니다.</li>
+				<li>높이: 화면의 높이를 픽셀 단위로 나타냅니다.</li>
+			</ul>
+		</p>
+
+		<h3>[property:Boolean staticMoving]</h3>
+		<p>
+			댐핑의 비활성화 여부를 설정합니다. 기본값은 *false* 입니다.
+		</p>
+
+		<h3>[property:Number zoomSpeed]</h3>
+		<p>
+			줌 속도를 설정합니다. 기본값은 *1.2* 입니다.
+		</p>
+
+		<h2>메소드</h2>
+
+		<h3>[method:null checkDistances] ()</h3>
+		<p>
+			컨트롤이 [minDistance, maxDistance] 범위내에 있는지 확인합니다. [page:.update update]() 에 의해 호출됩니다.
+			
+		</p>
+
+		<h3>[method:null dispose] ()</h3>
+		<p>
+			컨트롤이 더 이상 필요하지 않을 경우 호출해야 합니다.
+
+		</p>
+
+		<h3>[method:null handleResize] ()</h3>
+		<p>
+			어플리케이션의 창 크기를 조절 하려면 호출해야 합니다.
+
+		</p>
+
+		<h3>[method:null panCamera] ()</h3>
+		<p>
+			패닝이 필요한 경우 [page:.update update]() 을 호출하여 수행합니다.
+		</p>
+
+		<h3>[method:null reset] ()</h3>
+		<p>
+			컨트롤을 초기 상태로 전환합니다.
+		</p>
+
+		<h3>[method:null rotateCamera] ()</h3>
+		<p>
+			카메라의 회전이 필요한 경우 [page:.update update]() 을 호출하여 수행합니다.
+		</p>
+
+		<h3>[method:null update] ()</h3>
+		<p>
+			컨트롤을 업데이트합니다. 보통은 애니메이션 루프에서 수행합니다.
+		</p>
+
+		<h3>[method:null zoomCamera] ()</h3>
+		<p>
+			줌잉이 필요항 경우 [page:.update update]() 을 호출하여 수행합니다.
+		</p>
+
+		<h2>Source</h2>
+
+		<p>
+			[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/TrackballControls.js examples/jsm/controls/TrackballControls.js]
+		</p>
+	</body>
+</html>

+ 223 - 0
docs/examples/ko/controls/TransformControls.html

@@ -0,0 +1,223 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+		[page:Object3D] &rarr;
+
+		<h1>[name]</h1>
+
+		<p class="desc">
+			해당 클래스는 DCC 툴인 블렌더의 상호 작용 모델과 비슷한 기능을 3D 공간에서 객체를 변환하는데 사용할 수 있습니다.
+			다른 컨트롤과 달리, 해당 기능은 카메라의 장면 변환을 의미하지 않습니다.<br /><br />
+
+			[name] 는 연결된 3D 객체가 씬(scene) 그래프의 일부 입니다.
+		
+		</p>
+
+		<h2>예시</h2>
+
+		<p>[example:misc_controls_transform misc / controls / transform ]</p>
+
+		<h2>생성자</h2>
+
+		<h3>[name]( [param:Camera camera], [param:HTMLDOMElement domElement] )</h3>
+		<p>
+			<p>
+				[page:Camera camera]: 렌더링 된 장면의 카메라입니다.
+			</p>
+			<p>
+				[page:HTMLDOMElement domElement]: 이벤트 리스너에 사용되는 HTML 엘리먼트입니다.
+			<p>
+				새로운 [name] 객체를 생성합니다.
+			</p>
+		</p>
+
+		<h2>이벤트</h2>
+
+		<h3>change</h3>
+		<p>
+			어떤 유형 (객체 또는 속성 변경) 의 변경이 수행할 경우 호출됩니다. 속성 변경은 이벤트 리스너를 추가 할 수 있는 별도의 이벤트입니다. 
+			이벤트의 타입은 "propertyname-changed" 입니다.
+		</p>
+
+		<h3>mouseDown</h3>
+		<p>
+			포인터 (마우스 / 터치)가 활성화되면 호출됩니다.
+		</p>
+
+		<h3>mouseUp</h3>
+		<p>
+			포인터 (마우스 / 터치)가 활성화되지 않으면 호출됩니다.
+		</p>
+
+		<h3>objectChange</h3>
+		<p>
+			제어 된 3D 객체가 변경되면 호출됩니다.
+		</p>
+
+		<h2>속성</h2>
+
+		<p>공통 속성은 [page: Object3D] 클래스를 참조하세요.</p>
+
+		<h3>[property:String axis]</h3>
+		<p>
+			현재 변환 축을 지정합니다.
+		</p>
+
+		<h3>[property:Camera camera]</h3>
+		<p>
+			렌더링 된 장면의 카메라를 지정합니다.
+		</p>
+
+		<h3>[property:HTMLDOMElement domElement]</h3>
+		<p>
+			HTMLDOMElement는 마우스 / 터치 이벤트를 사용하는데 이용됩니다. 이것은 생성자에 의해 설정되어야 합니다; 
+			생성자를 통해 설정되지 않을 경우 새 이벤트 리스너에 설정되지 않습니다.
+		</p>
+
+		<h3>[property:Boolean dragging]</h3>
+		<p>
+			현재 드래그를 수행할건지 여부를 지정합니다. 해당 속성은 읽기전용 입니다.
+		</p>
+
+		<h3>[property:Boolean enabled]</h3>
+		<p>
+			컨트롤의 활성화 여부를 지정합니다.
+		</p>
+
+		<h3>[property:String mode]</h3>
+		<p>
+			현재 변환 모드를 지정합니다. 해당 속성은 "translate", "roate" 및 "scale" 의 값을 지정할 수 있습니다. 기본값은 *translate* 입니다.
+		</p>
+
+		<h3>[property:Object3D object]</h3>
+		<p>
+			제어 될 3D 객체를 지정합니다.
+		</p>
+
+		<h3>[property:Number rotationSnap]</h3>
+		<p>
+			기본적으로, 3D 객체는 연속적으로 회전합니다. 해당 프로퍼티에 값을 설정하면 (라디안), 3D 객체를 각 단계별로 회전 할 때마다 정의할 수 있습니다. 기본값은 *null* 입니다.
+		</p>
+
+		<h3>[property:Boolean showX]</h3>
+		<p>
+			x축 헬퍼의 표시 여부를 결정합니다. 기본값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Boolean showY]</h3>
+		<p>
+			y축 헬퍼의 표시 여부를 결정합니다. 기본값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Boolean showZ]</h3>
+		<p>
+			z축 헬퍼의 표시 여부를 결정합니다. 기본값은 *true* 입니다.
+		</p>
+
+		<h3>[property:Number size]</h3>
+		<p>
+			helper UI의 크기를 조절합니다 (축/면). 기본값은 *1* 입니다.
+		</p>
+
+		<h3>[property:String space]</h3>
+		<p>
+			좌표 변환을 수행 되어질 공간을 지정합니다. 해당 속성은 "world" 및 "local" 의 값을 지정할 수 있습니다. 기본값은 *world* 입니다.
+		</p>
+
+		<h3>[property:Number translationSnap]</h3>
+		<p>
+			일반적으로, 3D 객체는 연속적으로 변환됩니다. 해당 프로퍼티에 값을 설정하면 (월드 단위), 3D 객체를 각 단계별로 변환 할 때마다 정의할 수 있습니다. 기본값은 *null* 입니다.
+		</p>
+
+		<h2>메소드</h2>
+
+		<p>일반적인 메소드는 [page:Object3D] 클래스를 참조하세요.</p>
+
+		<h3>[method:TransformControls attach] ( [param:Object3D object] )</h3>
+		<p>
+			<p>
+				[page:Object3D object]: 변환 되어지는 3D 객체 입니다.
+			</p>
+			<p>
+				변환해야하는 3D 객체를 설정하고 컨트롤 UI가 표시되도록합니다.
+			</p>
+		</p>
+
+		<h3>[method:TransformControls detach] ()</h3>
+		<p>
+			컨트롤에서 현재 3D 객체를 제거하고 helper UI를 보이지 않게합니다.
+		</p>
+
+		<h3>[method:null dispose] ()</h3>
+		<p>
+			컨트롤을 더이상 필요하지 않을 경우 호출해야 합니다.
+		</p>
+
+		<h3>[method:String getMode] ()</h3>
+		<p>
+			변환 모드를 반환합니다.
+		</p>
+
+		<h3>[method:null setMode] ( [param:String mode] )</h3>
+		<p>
+			<p>
+				[page:String mode]: 변환 모드를 가리킵니다.
+			</p>
+			<p>
+				변환 모드를 설정합니다.
+			</p>
+		</p>
+
+		<h3>[method:null setRotationSnap] ( [param:Number rotationSnap] )</h3>
+		<p>
+			<p>
+				[page:Number rotationSnap]: 회전 스냅를 가리킵니다.
+			</p>
+			<p>
+				회전 스냅를 설정합니다.
+			</p>
+		</p>
+
+		<h3>[method:null setSize] ( [param:Number size] )</h3>
+		<p>
+			<p>
+				[page:Number size]: helper UI의 크기를 가리킵니다.
+			</p>
+			<p>
+				helper UI의 크기를 설정합니다.
+			</p>
+		</p>
+
+		<h3>[method:null setSpace] ( [param:String space] )</h3>
+		<p>
+			<p>
+				[page:String space]: 어떤 좌표 공간으로 변환을 적용합니다.
+			</p>
+			<p>
+				변환될 좌표 공간을 설정합니다.
+			</p>
+		</p>
+
+		<h3>[method:null setTranslationSnap] ( [param:Number translationSnap] )</h3>
+		<p>
+			<p>
+				[page:Number translationSnap]: 변환 스냅을 가리킵니다.
+			</p>
+			<p>
+				변환 스냅을 설정합니다.
+			</p>
+		</p>
+
+		<h2>Source</h2>
+
+		<p>
+			[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/TransformControls.js examples/jsm/controls/TransformControls.js]
+		</p>
+	</body>
+</html>

+ 24 - 2
docs/list.json

@@ -999,7 +999,7 @@
 		}
 		}
 
 
 	},
 	},
-
+  
 	"ko": {
 	"ko": {
 	
 	
 		"매뉴얼": {
 		"매뉴얼": {
@@ -1032,8 +1032,30 @@
 				
 				
 			}
 			}
 	
 	
+		},
+
+		"레퍼런스": {
+
+			"애니메이션": {
+				"AnimationAction": "api/ko/animation/AnimationAction",
+
+			},
+
+		"예제": {
+
+			"컨트롤": {
+				"DeviceOrientationControls": "examples/ko/controls/DeviceOrientationControls",
+				"DragControls": "examples/ko/controls/DragControls",
+				"FirstPersonControls": "examples/ko/controls/FirstPersonControls",
+				"FlyControls": "examples/ko/controls/FlyControls",
+				"OrbitControls": "examples/ko/controls/OrbitControls",
+				"PointerLockControls": "examples/ko/controls/PointerLockControls",
+				"TrackballControls": "examples/ko/controls/TrackballControls",
+				"TransformControls": "examples/ko/controls/TransformControls"
+			}
+	
 		}
 		}
-		
+
 	}
 	}
 
 
 }
 }