未验证 提交 79fc09be 编写于 作者: H harehare 提交者: GitHub

Docs: docs/api/ko/extras korean documents (#21807)

* bufer_1

* core

* buffergeometry

* 0430

* 0504

* 0504

* api-core-korean

* 0507

* 0511
Co-authored-by: Nhareha <maiel@naver.com>
上级 5f5e881b
......@@ -51,16 +51,16 @@
<h2>Properties</h2>
<p>See the base [page:Curve] class for common properties.</p>
<h3>[property:Vector2 v0]</h3>
<h3>[property:Vector3 v0]</h3>
<p>The starting point.</p>
<h3>[property:Vector2 v1]</h3>
<h3>[property:Vector3 v1]</h3>
<p>The first control point.</p>
<h3>[property:Vector2 v2]</h3>
<h3>[property:Vector3 v2]</h3>
<p>The second control point.</p>
<h3>[property:Vector2 v3]</h3>
<h3>[property:Vector3 v3]</h3>
<p>The ending point.</p>
......
<!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>
<h3>[method:Number toHalfFloat]( [param:Number val] )</h3>
<p>
val --단일 부동 소수점 값입니다.<br /><br />
unit16 값으로 표현되는 반정밀 부동소수점 값을 리턴합니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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">
이어컷 폴리곤 삼각측량 알고리즘 구현입니다. 이 코드는 [link:https://github.com/mapbox/earcut mapbox/earcut]의 일부입니다.
</p>
<h2>메서드</h2>
<h3>[method:Array triangulate]( data, holeIndices, dim )</h3>
<p>
data -- 꼭짓점 좌표를 가진 평면 배열입니다.<br />
holeIndices -- 확인 가능한 hole 인덱스의 배열입니다.<br />
dim -- 인풋 배열의 꼭짓점 당 좌표의 수입니다.<br /><br />
전달받은 모양의 정의를 바탕으로 삼각측량을 통해 삼각형 배열을 리턴합니다. 삼각형은 꼭짓점을 나타내는 연속된 세 개의 정수 인덱스들로 정의됩니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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>
<h3>[method:String getDataURL]( [param:HTMLCanvasElement image] | [param:HTMLImageElement image] | [param:ImageBitmap image] )</h3>
<p>
image -- 이미지 오브젝트입니다.<br /><br />
전달받은 이미지를 표현하는 데이터 URI를 리턴합니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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">
이 클래스는 큐브맵 환경 텍스처로부터 사전 필터링된 Mipmap Radiance Environment Map(PMREM)을 생성합니다.
이를 통해 재질의 거칠기에 따라 다양한 수준의 블러를 빠르게 적용할 수 있습니다. RGBE와 같은 비선형 형식을 지원할 수 있도록 사용자 지정 보간을 수행할 수 있는 특수 CubeUV 형식으로 포장되어 있습니다.
기존의 mipmap 체인과는 달리, LOD_MIN 수준까지만 내려가며(위), 더 높은 거칠기 수준과 연관된 동일한 LOD_MIN 해상도에서 훨씬 더 많은 필터링된 'mips'를 생성합니다.
이러한 방법으로 샘플링 계산을 제한하면서 확산 조명을 부드럽게 보간하기 위한 해상도를 유지합니다.
</p>
<h2>생성자</h2>
<h3>[name]( [param:WebGLRenderer renderer] )</h3>
<p>
새 [name]를 만드는 생성자입니다.
</p>
<h2>메서드</h2>
<h3>[method:WebGLRenderTarget fromScene]( [param:Scene scene], [param:Number sigma], [param:Number near], [param:Number far] )</h3>
<p>
[page:Scene scene] - 전달받은 장면입니다.<br>
[page:Number sigma] - (생략가능) PMREM 생성 전에 장면에 적용할 블러 반지름을 설정합니다. 기본값은 *0*입니다.<br>
[page:Number near] - (생략가능) 근평면 값입니다. 기본값은 *0.1*입니다.<br>
[page:Number far] - (생략가능) 원평면 값입니다. 기본값은 *100*입니다.<br /><br />
전달받은 장면에서 PMREM을 생성합니다. 이는 네트워크 대역폭이 낮은 경우 이미지를 사용하는 것보다 빠를 수 있습니다.
장면 전체를 렌더링할 수 있도록 가까운 평면과 먼 평면을 선택할 수 있습니다(cubeCamera는 원래 위치에 배치됨).
</p>
<h3>[method:WebGLRenderTarget fromEquirectangular]( [param:Texture equirectangular] )</h3>
<p>
[page:Texture equirectangular] - 등장방형 텍스쳐입니다.<br /><br />
LDR(RGBFormat) 또는 HDR(RGBEFormat)일 수 있는 등장방형 텍스처로부터 PMREM을 생성합니다.
이상적인 입력 이미지 크기는 1k(1024 x 512)로, 256 x 256 큐브 맵 출력과 가장 잘 일치합니다.
</p>
<h3>[method:WebGLRenderTarget fromCubemap]( [param:CubeTexture cubemap] )</h3>
<p>
[page:CubeTexture cubemap] - 큐브맵 텍스쳐입니다.<br /><br />
LDR(RGBFormat) 또는 HDR(RGBEFormat)일 수 있는 큐브맵 텍스처로부터 PMREM을 생성합니다.
이상적인 입력 이미지 크기는 1k(1024 x 512)로, 256 x 256 큐브 맵 출력과 가장 잘 일치합니다.
</p>
<h3>[method:void compileCubemapShader]()</h3>
<p>
큐브 맵 셰이더를 미리 컴파일합니다. 동시성을 높이기 위해 텍스쳐의 네트워크 로딩 중에 이 메서드를 호출하여 더 빨리 시작할 수 있습니다.
</p>
<h3>[method:void compileEquirectangularShader]()</h3>
<p>
등장방형 셰이더를 미리 컴파일합니다. 동시성을 높이기 위해 텍스쳐의 네트워크 로딩 중에 이 메서드를 호출하여 더 빨리 시작할 수 있습니다.
</p>
<h3>[method:void dispose]()</h3>
<p>
PMREM 제너레이터의 내장 메모리를 폐기합니다.
PMREMGenerator는 정적 클래스이므로 두 개 이상의 PMREMGenerator 개체가 필요하지 않습니다.
이 경우 둘 중 하나에 대해 dispose()를 호출하면 다른 항목도 사용할 수 없게 됩니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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">
shape에 대한 기능 함수를 포함하는 클래스입니다.<br /><br />
이 함수들은 모두 일차함수이므로 벡터의 x, y(z, w 가 있는 경우 해당포함) 컴포넌트에 대해 별도로 계산할 필요가 있습니다.
</p>
<h2>메서드</h2>
<h3>[method:Number area]( contour )</h3>
<p>
contour -- 2D 폴리곤입니다. THREE.Vector2() 배열입니다.<br /><br />
( 2D ) 윤곽 폴리곤의 면적을 계산합니다.
</p>
<h3>[method:Boolean isClockWise]( pts )</h3>
<p>
pts -- 2D 폴리곤을 정의하는 점들입니다<br /><br />
일차함수이므로 벡터의 x, y 컴포넌트에 대해 별도로 계산해야 하는 점에 주의해주세요.<br /><br />
[page:Path Path], [page:ExtrudeGeometry ExtrudeGeometry] 및 [page:ShapeGeometry ShapeGeometry]에서 내부적으로 사용됩니다.
</p>
<h3>[method:Array triangulateShape]( contour, holes )</h3>
<p>
contour -- 2D 폴리곤.<br />
holes -- holes 배열<br /><br />
[page:ExtrudeGeometry ExtrudeGeometry] 및 [page:ShapeGeometry ShapeGeometry]에서 내부적으로 holes와 함께 shape의 면을 계산하기 위해 사용됩니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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] 객체를 만들기 위한 기본 추상 클래스입니다.
[name]의 배열은 [page:CurvePath]를 참고하세요.
</p>
<h2>생성자</h2>
<h3>[name]()</h3>
<p>
새 [name]를 만드는 생성자입니다.
</p>
<h2>프로퍼티</h2>
<h3>[property:Integer arcLengthDivisions]</h3>
<p>이 값은 곡선의 누적 세그먼트 길이를 계산할 때 [page:.getLengths]를 통해 분할할 양을 결정합니다.
[page:.getSpacedPoints]같은 메서드를 사용할 때 정확도를 위해, 곡선이 아주 크다면 [page:.arcLengthDivisions]를 올리는 것을 추천합니다. 기본값은 200입니다.</p>
<h2>메서드</h2>
<h3>[method:Vector getPoint]( [param:Float t], [param:Vector optionalTarget] )</h3>
<p>
[page:Float t] - 곡선의 위치입니다. [ 0, 1 ] 사이에 있어야 합니다. <br>
[page:Vector optionalTarget] — (생략가능) 값이 지정되면, 결과값이 이 벡터에 복제될 것이고 생략되면 새 Vector가 생성됩니다.<br /><br />
곡선의 위치 벡터를 리턴합니다.
</p>
<h3>[method:Vector getPointAt]( [param:Float u], [param:Vector optionalTarget] )</h3>
<p>
[page:Float u] - 원호 길이에 따른 곡선의 위치입니다. [ 0, 1 ] 사이에 있어야 합니다. <br>
[page:Vector optionalTarget] — (생략가능) 값이 지정되면, 결과값이 이 벡터에 복제될 것이고 생략되면 새 Vector가 생성됩니다.<br /><br />
원호 길이에 따른 곡선의 위치 벡터를 리턴합니다.
</p>
<h3>[method:Array getPoints]( [param:Integer divisions] )</h3>
<p>
divisions -- 곡선을 몇 조각으로 나눌지 결정합니다. 기본값은 *5*입니다.<br /><br />
getPoint( t )를 사용하는 divisions + 1 세트를 리턴합니다.
</p>
<h3>[method:Array getSpacedPoints]( [param:Integer divisions] )</h3>
<p>
divisions -- 곡선을 몇 조각으로 나눌지 결정합니다. 기본값은 *5*입니다.<br /><br />
getPointAt( u )를 사용하는 균등 분할된 divisions + 1 세트를 리턴합니다.
</p>
<h3>[method:Float getLength]()</h3>
<p>총 곡선 원호 길이를 가져옵니다.</p>
<h3>[method:Array getLengths]( [param:Integer divisions] )</h3>
<p>누적 세그먼트 길이 목록을 가져옵니다.</p>
<h3>[method:null updateArcLengths]()</h3>
<p>누적 세그먼트 거리 캐시를 업데이트합니다.</p>
<h3>[method:Float getUtoTmapping]( [param:Float u], [param:Float distance] )</h3>
<p>
( 0 .. 1 ) 범위의 u 를 받아, 마찬가지로 ( 0 .. 1 ) 범위의 [page:Float t] 를 리턴합니다.
[page:.getPoint]를 사용해 u와 t는 곡선의 끝에서 등거리인 점을 확인하는 데 사용할 수 있습니다.
</p>
<h3>[method:Vector getTangent]( [param:Float t], [param:Vector optionalTarget] )</h3>
<p>
[page:Float t] - 곡선의 위치입니다 [ 0, 1 ] 범위여야합니다. <br>
[page:Vector optionalTarget] — (생략가능) 값이 지정되면, 결과값이 이 벡터에 복제될 것이고 생략되면 새 Vector가 생성됩니다. <br /><br />
t에서 접선하는 단위 벡터를 반환합니다.
파생 곡선이 접선 유도법을 구현하지 않는 경우, 작은 델타 간격의 두 점이 합리적인 근사치의 기울기를 찾는 데 사용됩니다.
</p>
<h3>[method:Vector getTangentAt]( [param:Float u], [param:Vector optionalTarget] )</h3>
<p>
[page:Float u] - 원호 길이에 따른 곡선의 위치. [0, 1] 범위에 있어야 합니다. <br>
[page:Vector optionalTarget] — (생략가능) 값이 지정되면, 결과값이 이 벡터에 복제될 것이고 생략되면 새 Vector가 생성됩니다. <br /><br />
[page:.getTangent]에 지정된 점에서 곡선의 끝과의 거리가 동일한 접선의 점을 반환합니다.
</p>
<h3>[method:Object computeFrenetFrames]( [param:Integer segments], [param:Boolean closed] )</h3>
<p>
프레닛 프레임을 생성합니다. 3D 스페이스에 곡선 정의가 필요합니다. [page:TubeGeometry] 혹은 [page:ExtrudeGeometry] 같은 기하학에 사용됩니다.
</p>
<h3>[method:Curve clone]()</h3>
<p>이 인스턴스의 사본을 만듭니다.</p>
<h3>[method:Curve copy]( [param:Curve source] )</h3>
<p>다른 [name] 객체를 이 인스턴스에 복사합니다.</p>
<h3>[method:Object toJSON]()</h3>
<p>이 인스턴스의 JSON 객체 표현을 리턴합니다.</p>
<h3>[method:Curve fromJSON]( [param:Object json] )</h3>
<p>JSON 객체에서 이 인스턴스로 데이터를 복사합니다.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">
[page:Curve]를 확장하는 추상 기본 클래스입니다. A CurvePath는 단순히 연결된 곡선의 배열이지만, curve의 api를 유지하고 있습니다.
</p>
<h2>생성자</h2>
<h3>[name]()</h3>
<p>
생성자에서는 파라미터를 받지 않습니다.
</p>
<h2>프로퍼티</h2>
<p>일빈 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Array curves]</h3>
<p>[page:Curve Curves]의 배열입니다.</p>
<h3>[property:Boolean autoClose]</h3>
<p>path를 자동으로 닫을지 말지를 결정합니다.</p>
<h2>메서드</h2>
<p>일빈 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[method:null add]( [param:Curve curve] )</h3>
<p>[page:.curves] 배열에 곡선을 추가합니다.</p>
<h3>[method:null closePath]()</h3>
<p>path를 닫기위해 [page:LineCurve lineCurve]를 추가합니다.</p>
<h3>[method:Array getCurveLengths]()</h3>
<p>[page:.curves] 배열에 있는 곡선들의 누적 곡선 길이 목록을 가져옵니다.</p>
<h3>[method:Vector getPoint]( [param:Float t] )</h3>
<p>
[page:Float t] - 곡선의 위치입니다. [ 0, 1 ]범위 안에 있어야 합니다. <br><br />
곡선 path에 있는 위치 벡터를 리턴합니다.
</p>
<h3>[method:Array getPoints]( [param:Integer divisions] )</h3>
<p>
divisions -- 곡선을 나눌 조각 수입니다. 기본값은 *12*입니다.<br /><br />
곡선 시퀀스를 나타내는 점 배열을 반환합니다.
*divisions* 파라미터는 각 곡선이 분할되는 조각 수를 정의합니다.
하지만 최적화 및 품질 목적을 위해 각 곡선의 실제 표본 해상도는 유형에 따라 달라집니다.
예를 들어 [page:LineCurve]의 경우, 반환되는 점 수는 항상 2개입니다.
</p>
<h3>[method:Array getSpacedPoints]( [param:Integer divisions] )</h3>
<p>
divisions -- 곡선을 나눌 조각 수입니다. 기본값은 *40*입니다.<br /><br />
getPointAt( u )를 사용하는 divisions + 1 의 균등하게 분할된 점을 리턴합니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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">
JSON 포맷으로 로드된 폰트를 표현하는 [page:Shape Shapes] 세트를 만듭니다.<br /><br />
[page:FontLoader]에서 내부적으로 사용됩니다.
</p>
<h2>예제</h2>
<p>
[example:webgl_geometry_text_shapes geometry / text / shapes ]
</p>
<h2>생성자</h2>
<h3>[name]( data )</h3>
<p>
data -- 폰트를 표현하는 JSON 데이터입니다.<br /><br />
이 생성자는 [page:Shape Shapes] 배열의 새 [name]를 만듭니다.
</p>
<h2>프로퍼티</h2>
<h3>[property:Array data]</h3>
<p>생성자에 전달되는 JSON 데이터입니다.</p>
<h2>메서드</h2>
<h3>[method:null generateShapes]( [param:String text], [param:Float size] )</h3>
<p>
[page:String text] -- 텍스트 문자열입니다.<br />
[page:Float size] -- (생략가능) [page:Shape Shapes]의 크기입니다. 기본값은 *100*입니다.<br />
폰트에서 텍스트를 표현하는 [page:Shape Shapes] 배열을 만듭니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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]은 구상 곡선 클래스에서 사용되는 스플라인 및 베지어 함수를 포함하고 있습니다.
</p>
<h2>메서드</h2>
<h3>[method:Float CatmullRom]( [param:Float t], [param:Float p0], [param:Float p1], [param:Float p2], [param:Float p3] )</h3>
<p>
t -- 보간 가중치.<br />
p0, p1, p2, p3 -- 스플라인 곡선을 정의하는 점입니다.<br /><br />
[page:SplineCurve SplineCurve]에서 내부적으로 사용됩니다.
</p>
<h3>[method:Float QuadraticBezier]( [param:Float t], [param:Float p0], [param:Float p1], [param:Float p2] )</h3>
<p>
t -- 보간 가중치.<br />
p0, p1, p2 -- 곡선을 정의하는 시작, 조절, 끝 점입니다.<br /><br />
[page:QuadraticBezierCurve3 QuadraticBezierCurve3], [page:QuadraticBezierCurve QuadraticBezierCurve] 및 [page:Font Font]에서 내부적으로 사용됩니다.
</p>
<h3>[method:Float CubicBezier]( [param:Float t], [param:Float p0], [param:Float p1], [param:Float p2], [param:Float p3] )</h3>
<p>
t -- 보간 가중치.<br />
p0, p1, p2, p3 -- 곡선을 정의하는 시작, 조절(두 번), 끝 점입니다.<br /><br />
[page:CubicBezierCurve3 CubicBezierCurve3], [page:CubicBezierCurve CubicBezierCurve] 및 [page:Font Font]에서 내부적으로 사용됩니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr; [page:CurvePath] &rarr;
<h1>[name]</h1>
<p class="desc">
2D path 표현입니다. 이 클래스는 2D Canvas API와 유사한 2D 도형의 path 및 윤곽선을 만드는 방법을 제공합니다.
</p>
<h2>코드 예제</h2>
<code>
const path = new THREE.Path();
path.lineTo( 0, 0.8 );
path.quadraticCurveTo( 0, 1, 0.2, 1 );
path.lineTo( 1, 1 );
const points = path.getPoints();
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color: 0xffffff } );
const line = new THREE.Line( geometry, material );
scene.add( line );
</code>
<h2>생성자</h2>
<h3>[name]( [param:Array points] )</h3>
<p>
points -- (생략가능) [page:Vector2 Vector2s] 배열.<br /><br />
점들로 path를 만듭니다. 첫 점은 오프셋을 정의하고 이어지는 점들은 [page:LineCurve LineCurves]로
[page:CurvePath.curves curves] 배열에 추가됩니다.<br /><br />
점이 지정되지 않으면, 빈 path가 만들어지며 [page:.currentPoint]가 기본값으로 설정됩니다.
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:CurvePath] 클래스를 참고하세요.</p>
<h3>[property:Array currentPoint]</h3>
<p>path의 현재 오프셋입니다. 새 [page:Curve]들은 여기서부터 시작될 것입니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:CurvePath] 클래스를 참고하세요.</p>
<h3>[method:this absarc]( [param:Float x], [param:Float y], [param:Float radius], [param:Float startAngle], [param:Float endAngle], [param:Boolean clockwise] )</h3>
<p>
x, y -- 호의 절대중심입니다.<br />
radius -- 호의 반지름입니다.<br />
startAngle -- 라디안 시작 각도입니다.<br />
endAngle -- 라디안 끝 각도입니다.<br />
clockwise -- 호를 시계방향으로 회전합니다. 기본값은 *false*입니다.<br /><br />
절대 위치를 가진 [page:EllipseCurve EllipseCurve]를 path에 추가합니다.
</p>
<h3>[method:this absellipse]( [param:Float x], [param:Float y], [param:Float xRadius], [param:Float yRadius], [param:Float startAngle], [param:Float endAngle], [param:Boolean clockwise], [param:Float rotation] )</h3>
<p>
x, y -- 타원의 절대중심입니다.<br />
xRadius -- 타원의 x 축 반지름입니다.<br />
yRadius -- 타원의 y 축 반지름입니다..<br />
startAngle -- 라디안 시작 각도입니다.<br />
endAngle -- 라디안 끝 각도입니다.<br />
clockwise -- 타원을 시계방향으로 회전합니다. 기본값은 *false*입니다.<br />
rotation -- 타원의 라디안 회전각도이며 양수 x축의 반시계방향입니다. 생략 가능하며 기본값은 0입니다.<br /><br />
path에 절대 위치를 가진 [page:EllipseCurve EllipseCurve]를 추가합니다.
</p>
<h3>[method:this arc]( [param:Float x], [param:Float y], [param:Float radius], [param:Float startAngle], [param:Float endAngle], [param:Boolean clockwise] )</h3>
<p>
x, y -- 마지막 호출의 호의 오프셋의 중심입니다.<br />
radius -- 호의 반지름입니다.<br />
startAngle -- 라디안 시작 각도입니다.<br />
endAngle -- 라디안 끝 각도입니다.<br />
clockwise -- 호를 시계방향으로 회전합니다. 기본값은 *false*입니다.<br /><br />
[page:.currentPoint]에 대한 상대위치를 가지는 [page:EllipseCurve EllipseCurve]를 path에 추가합니다.
</p>
<h3>[method:this bezierCurveTo]( [param:Float cp1X], [param:Float cp1Y], [param:Float cp2X], [param:Float cp2Y], [param:Float x], [param:Float y] )</h3>
<p>This creates a bezier curve from [page:.currentPoint] with (cp1X, cp1Y) and (cp2X, cp2Y) as control points and updates [page:.currentPoint] to x and y.</p>
<h3>[method:this ellipse]( [param:Float x], [param:Float y], [param:Float xRadius], [param:Float yRadius], [param:Float startAngle], [param:Float endAngle], [param:Boolean clockwise], [param:Float rotation] )</h3>
<p>
x, y -- 마지막 호출의 타원의 오프셋의 중심입니다.<br />
xRadius -- 타원의 x 축 반지름입니다.<br />
yRadius -- 타원의 y 축 반지름입니다..<br />
startAngle -- 라디안 시작 각도입니다.<br />
endAngle -- 라디안 끝 각도입니다.<br />
clockwise -- 타원을 시계방향으로 회전합니다. 기본값은 *false*입니다.<br />
rotation -- 타원의 라디안 회전각도이며 양수 x축의 반시계방향입니다. 생략 가능하며 기본값은 0입니다.<br /><br />
[page:.currentPoint]에 대한 상대위치를 가지는 [page:EllipseCurve EllipseCurve]를 path에 추가합니다.
</p>
<h3>[method:this lineTo]( [param:Float x], [param:Float y] )</h3>
<p>path 위에 [page:.currentPoint]에서 x, y로 [page:LineCurve]를 연결합니다.</p>
<h3>[method:this moveTo]( [param:Float x], [param:Float y] )</h3>
<p>[page:.currentPoint]를 x, y로 이동시킵니다.</p>
<h3>[method:this quadraticCurveTo]( [param:Float cpX], [param:Float cpY], [param:Float x], [param:Float y] )</h3>
<p>조절점 cpX 와 cpY의 [page:.currentPoint]로부터 이차곡선을 만들고 [page:.currentPoint]를 x 와 y로 업데이트합니다.</p>
<h3>[method:this setFromPoints]( [param:Array vector2s] )</h3>
<p>
points -- [page:Vector2 Vector2s] 배열.<br /><br />
점들은 [page:CurvePath.curves curves] 배열에 [page:LineCurve LineCurves]로 추가됩니다.
</p>
<h3>[method:this splineThru] ( [param:Array points] ) </h3>
<p>
points - [page:Vector2 Vector2s] 배열.<br /><br />
path에 새 [page:SplineCurve]를 추가합니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr; [page:CurvePath] &rarr; [page:Path] &rarr;
<h1>[name]</h1>
<p class="desc">
임의의 holes가 있는 path를 사용하여 임의 2d shape 평면을 정의합니다. [page:ExtrudeGeometry] 및 [page:ShapeGeometry]와 함께 사용할 수 있으며, 점을 가져오거나 삼각형의 면을 가져옵니다.
</p>
<h2>코드 예제</h2>
<code>
const heartShape = new THREE.Shape();
heartShape.moveTo( 25, 25 );
heartShape.bezierCurveTo( 25, 25, 20, 0, 0, 0 );
heartShape.bezierCurveTo( 30, 0, 30, 35,30,35 );
heartShape.bezierCurveTo( 30, 55, 10, 77, 25, 95 );
heartShape.bezierCurveTo( 60, 77, 80, 55, 80, 35 );
heartShape.bezierCurveTo( 80, 35, 80, 0, 50, 0 );
heartShape.bezierCurveTo( 35, 0, 25, 25, 25, 25 );
const extrudeSettings = { amount: 8, bevelEnabled: true, bevelSegments: 2, steps: 2, bevelSize: 1, bevelThickness: 1 };
const geometry = new THREE.ExtrudeGeometry( heartShape, extrudeSettings );
const mesh = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial() );
</code>
<h2>예제</h2>
<p>
[example:webgl_geometry_shapes geometry / shapes ]<br/>
[example:webgl_geometry_extrude_shapes geometry / extrude / shapes ]<br/>
[example:webgl_geometry_extrude_shapes2 geometry / extrude / shapes2 ]<br/>
</p>
<h2>생성자</h2>
<h3>[name]( [param:Array points] )</h3>
<p>
points -- (생략가능) [page:Vector2 Vector2s] 배열입니다.<br /><br />
점을 기반으로 Shape를 만듭니다. 첫 번째 점은 오프셋을 정의하고 이어지는 점들은 [page:CurvePath.curves curves] 배열에 [page:LineCurve LineCurves]로 추가됩니다.<br /><br />
점이 지정되지 않으면, 빈 path가 만들어지며 [page:.currentPoint]가 기본값으로 설정됩니다.
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Path] 클래스를 참고하세요.</p>
<h3>[property:String uuid]</h3>
<p>
인스턴스의 [link:http://en.wikipedia.org/wiki/Universally_unique_identifier UUID]입니다. 자동으로 할당되며 수정할 수 없습니다.
</p>
<h3>[property:Array holes]</h3>
<p>shape의 holes를 정의하는 [page:Path paths] 배열입니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Path] 클래스를 참고하세요.</p>
<h3>[method:Array extractPoints]( [param:Integer divisions] )</h3>
<p>
divisions -- 결과값의 정밀도입니다.<br /><br />
shape와 [page:.holes]배열에서 [page:Curve.getPoints getPoints]를 호출하며, 다음과 같은 객체를 리턴합니다:
<code>
{
shape
holes
}
</code>
shape 와 holes 는 [page:Vector2 Vector2s]의 배열입니다.
</p>
<h3>[method:Array getPointsHoles]( [param:Integer divisions] )</h3>
<p>
divisions -- 결과값의 정밀도입니다.<br /><br />
shape 안의 holes를 표현하는 [page:Vector2 Vector2s] 배열을 가져옵니다.
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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">
This class is used to convert 이 클래스는 연속된 shape들을 [page:Path] 배열로 바꾸는데에 사용되며, 일례로 SVG shape를 path로 바꾸는 것이 있습니다.(아래 예제를 확인하세요).
[page:Font]에서 내부적으로 JSON 포맷의 폰드를 path 시리즈로 만드는 데에 사용됩니다.
</p>
<h2>예제</h2>
<p>
[example:webgl_geometry_extrude_shapes2 geometry / extrude / shapes2]
</p>
<h2>생성자</h2>
<h3>[name]( )</h3>
<p>
새 ShapePath를 만듭니다. [page:Path]와 달리, 점들이 ShapePath로 전달되지 않으며 생성 이후에 작동되게 설계되었습니다.
</p>
<h2>프로퍼티</h2>
<h3>[property:Array subPaths]</h3>
<p>
[page:Path]들의 배열입니다.
</p>
<h3>[property:Array currentPath]</h3>
<p>
현재 생성된 [page:Path]입니다.
</p>
<h3>[property:Color color]</h3>
<p>shape의 [page:Color]이며, 기본값은 흰 색입니다(0xffffff).</p>
<h2>메서드</h2>
<h3>[method:this moveTo]( [param:Float x], [param:Float y] )</h3>
<p>
새 [page:Path]를 시작하고 해당 [page:Path]에 [page:Path.moveTo]( x, y )를 호출합니다.
[page:ShapePath.currentPath currentPath] 점도 해당 [page:Path]에 호출합니다.
</p>
<h3>[method:this lineTo]( [param:Float x], [param:Float y] )</h3>
<p>[page:ShapePath.currentPath currentPath]의 오프셋에서 X 및 Y로 선을 생성하고 오프셋을 X와 Y로 업데이트합니다.</p>
<h3>[method:this quadraticCurveTo]( [param:Float cpX], [param:Float cpY], [param:Float x], [param:Float y] )</h3>
<p>[page:ShapePath.currentPath currentPath]의 오프셋에서 조절점 cpX 와 cpY 및 x 와 y로 이차곡선을 만들고 [page:ShapePath.currentPath currentPath]의 오프셋을 x 와 y로 업데이트합니다.</p>
<h3>[method:this bezierCurveTo]( [param:Float cp1X], [param:Float cp1Y], [param:Float cp2X], [param:Float cp2Y], [param:Float x], [param:Float y] )</h3>
<p>[page:ShapePath.currentPath currentPath]의 오프셋에서 조절점 cpX 와 cpY 및 x 와 y로 베지어곡선을 만들고 [page:ShapePath.currentPath currentPath]의 오프셋을 x 와 y로 업데이트합니다.</p>
<h3>[method:this splineThru] ( [param:Array points] ) </h3>
<p>points - [page:Vector2]들의 배열</p>
<p>[page:ShapePath.currentPath currentPath] 위에 새 [page:SplineCurve]를 연결합니다.</p>
<h3>[method:Array toShapes]( [param:Boolean isCCW], [param:Boolean noHoles] )</h3>
<p>
isCCW -- solids와 holes가 생성되는 방식을 변경합니다<br/>
noHoles -- holes를 생성할지 안 할지를 설정합니다.
</p>
<p>
[page:ShapePath.subPaths subPaths] 배열을 Shapes 배열로 변환합니다. 기본값으로 solid shapes는 시계방향(CW)이고 holes는 반시계방향(CCW)입니다.
isCCW가 true면, 이 값들이 반대가 됩니다.
noHoles 파라미터가 true면 모든 path들은 solid shapes로 설정되고 isCCW는 무시됩니다.
<br/>
</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/extras/core/ShapePath.js src/extras/core/ShapePath.js]
</p>
</body>
</html>
<!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:Curve] &rarr; [page:EllipseCurve] &rarr;
<h1>[name]</h1>
<p class="desc">[page:EllipseCurve]의 다른 이름입니다.</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:EllipseCurve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">[link:https://en.wikipedia.org/wiki/Centripetal_Catmull-Rom_spline Catmull-Rom] 알고리즘을 사용하여 일련의 점으로부터 매끄러운 3D 스플라인 곡선을 생성합니다.</p>
<h2>코드 예제</h2>
<code>
//Create a closed wavey loop
const curve = new THREE.CatmullRomCurve3( [
new THREE.Vector3( -10, 0, 10 ),
new THREE.Vector3( -5, 5, 5 ),
new THREE.Vector3( 0, 0, 0 ),
new THREE.Vector3( 5, -5, 5 ),
new THREE.Vector3( 10, 0, 10 )
] );
const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
// Create the final object to add to the scene
const curveObject = new THREE.Line( geometry, material );
</code>
<h2>예제</h2>
<p>
[example:webgl_geometry_extrude_splines WebGL / geometry / extrude / splines]
</p>
<h2>생성자</h2>
<h3>[name]( [param:Array points], [param:Boolean closed], [param:String curveType], [param:Float tension] )</h3>
<p>
points – [page:Vector3] 점들의 배열입니다<br/>
closed – 곡선이 닫히는지 아닌지를 결정합니다. 기본값은 *false*입니다.<br/>
curveType – 곡선의 타입입니다. 기본값은 *centripetal*입니다.<br/>
tension – 곡선의 탄성입니다. 기본값은 *0.5*입니다.
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Array points]</h3>
<p>곡선을 정의하는 [page:Vector3] 점들입니다. 적어도 두 개의 개체가 필요합니다.</p>
<h3>[property:Boolean closed]</h3>
<p>이 값이 true면 곡선은 스스로에게 되돌아옵니다.</p>
<h3>[property:String curveType]</h3>
<p>가능한 값은 *centripetal*, *chordal* 및 *catmullrom* 입니다.</p>
<h3>[property:Float tension]</h3>
<p>[page:.curveType]가 *catmullrom*이면, 캣멀롬 탄성을 정의합니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">
시작점, 종착점, 두 개의 조절점을 통해 매끄러운 2d
<a href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve#mediaviewer/File:Bezier_curve.svg" target="_blank">베지에 곡선</a>을 만듭니다.
</p>
<h2>코드 예제</h2>
<code>
const curve = new THREE.CubicBezierCurve(
new THREE.Vector2( -10, 0 ),
new THREE.Vector2( -5, 15 ),
new THREE.Vector2( 20, 15 ),
new THREE.Vector2( 10, 0 )
);
const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
// Create the final object to add to the scene
const curveObject = new THREE.Line( geometry, material );
</code>
<h2>생성자</h2>
<h3>[name] ( [param:Vector2 v0], [param:Vector2 v1], [param:Vector2 v2], [param:Vector2 v3] )</h3>
<p>
[page:Vector2 v0] – 시작점.<br/>
[page:Vector2 v1] – 첫 번째 조절점.<br/>
[page:Vector2 v2] – 두 번째 조절점.<br/>
[page:Vector2 v3] – 종착점.
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Vector2 v0]</h3>
<p>시작점입니다.</p>
<h3>[property:Vector2 v1]</h3>
<p>첫 번째 조절점입니다.</p>
<h3>[property:Vector2 v2]</h3>
<p>두 번째 조절점입니다.</p>
<h3>[property:Vector2 v3]</h3>
<p>종착점입니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">
시작점, 종착점, 두 개의 조절점을 통해 매끄러운 3d
<a href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve#mediaviewer/File:Bezier_curve.svg" target="_blank">베지에 곡선</a>을 만듭니다.
</p>
<h2>코드 예제</h2>
<code>
const curve = new THREE.CubicBezierCurve3(
new THREE.Vector3( -10, 0, 0 ),
new THREE.Vector3( -5, 15, 0 ),
new THREE.Vector3( 20, 15, 0 ),
new THREE.Vector3( 10, 0, 0 )
);
const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
// Create the final object to add to the scene
const curveObject = new THREE.Line( geometry, material );
</code>
<h2>생성자</h2>
<h3>[name]( [param:Vector3 v0], [param:Vector3 v1], [param:Vector3 v2], [param:Vector3 v3] )</h3>
<p>
[page:Vector3 v0] – 시작점.<br/>
[page:Vector3 v1] – 첫 번째 조절점.<br/>
[page:Vector3 v2] – 두 번째 조절점.<br/>
[page:Vector3 v3] – 종착점.
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Vector3 v0]</h3>
<p>시작점입니다.</p>
<h3>[property:Vector3 v1]</h3>
<p>첫 번째 조절점입니다.</p>
<h3>[property:Vector3 v2]</h3>
<p>두 번째 조절점입니다.</p>
<h3>[property:Vector3 v3]</h3>
<p>종착점입니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">
타원 모양의 2d 곡선을 생성합니다.
[page:Number xRadius]를 [page:Number yRadius]과 같게 설정하면 원이 됩니다.
</p>
<h2>코드 예제</h2>
<code>
const curve = new THREE.EllipseCurve(
0, 0, // ax, aY
10, 10, // xRadius, yRadius
0, 2 * Math.PI, // aStartAngle, aEndAngle
false, // aClockwise
0 // aRotation
);
const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
// Create the final object to add to the scene
const ellipse = new THREE.Line( geometry, material );
</code>
<h2>생성자</h2>
<h3>[name]( [param:Float aX], [param:Float aY], [param:Float xRadius], [param:Float yRadius], [param:Radians aStartAngle], [param:Radians aEndAngle], [param:Boolean aClockwise], [param:Radians aRotation] )</h3>
<p>
[page:Float aX] – 타원의 X 중앙입니다. 기본값은 *0*입니다.<br/>
[page:Float aY] – 타원의 Y 중앙입니다. 기본값은 *0*입니다.<br/>
[page:Float xRadius] – 타원의 x방향 반지름입니다. 기본값은 *1*입니다.<br/>
[page:Float yRadius] – 타원의 y방향 반지름입니다. 기본값은 *1*입니다.<br/>
[page:Radians aStartAngle] – 양수 X 축에서 시작하는 곡선의 라디안 시작각도입니다. 기본값은 *0*입니다.<br/>
[page:Radians aEndAngle] – 양수 X 축에서 시작하는 곡선의 라디안 종착각도입니다. 기본값은 *2 x Math.PI*입니다.<br/>
[page:Boolean aClockwise] – 타원이 시계방향으로 그려질지에 대한 값입니다. 기본값은 *false*입니다.<br/>
[page:Radians aRotation] – 타원의 회전 라디안 각도이며 양수 X 축의 반시계방향입니다(선택가능). 기본값은 *0*입니다.<br/><br/>
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Float aX]</h3>
<p>타원의 X 중앙입니다.</p>
<h3>[property:Float aY]</h3>
<p>타원의 Y 중앙입니다.</p>
<h3>[property:Radians xRadius]</h3>
<p>타원의 x방향 각도입니다.</p>
<h3>[property:Radians yRadius]</h3>
<p>타원의 y방향 각도입니다.</p>
<h3>[property:Float aStartAngle]</h3>
<p>우측 중앙에서 시작하는 라디안 시작각도입니다.</p>
<h3>[property:Float aEndAngle]</h3>
<p>우측 중앙에서 시작하는 라디안 종착각도입니다.</p>
<h3>[property:Boolean aClockwise]</h3>
<p>타원이 시계방향으로 그려질지에 대한 값입니다.</p>
<h3>[property:Float aRotation]</h3>
<p>타원의 회전 라디안 각도이며 양수 X 축의 반시계방향입니다(선택가능). 기본값은 *0*입니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">2d 선 세그먼트를 그리는 커브입니다.</p>
<h2>생성자</h2>
<h3>[name]( [param:Vector2 v1], [param:Vector2 v2] )</h3>
<p>
[page:Vector2 v1] – 시작점입니다.<br/>
[page:Vector2 v2] - 종착점입니다.
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Vector2 v1]</h3>
<p>시작점입니다.</p>
<h3>[property:Vector2 v2]</h3>
<p>종착점입니다</p>
<h2>메서드</h2>
<p>S일반 메서드는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">3d 선 세그먼트를 그리는 커브입니다.</p>
<h2>생성자</h2>
<h3>[name]( [param:Vector3 v1], [param:Vector3 v2] )</h3>
<p>
[page:Vector3 v1] – 시작점입니다.<br/>
[page:Vector3 v2] - 종착점입니다.
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Vector3 v1]</h3>
<p>시작점입니다.</p>
<h3>[property:Vector3 v2]</h3>
<p>종착점입니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">
시작점, 종착점, 두 개의 조절점을 통해 매끄러운 2d
<a href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve#mediaviewer/File:B%C3%A9zier_2_big.gif" target="_blank">이차 베지어 곡선</a>을 만듭니다.
</p>
<h2>코드 예제</h2>
<code>
const curve = new THREE.QuadraticBezierCurve(
new THREE.Vector2( -10, 0 ),
new THREE.Vector2( 20, 15 ),
new THREE.Vector2( 10, 0 )
);
const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
// Create the final object to add to the scene
const curveObject = new THREE.Line( geometry, material );
</code>
<h2>생성자</h2>
<h3>[name]( [param:Vector2 v0], [param:Vector2 v1], [param:Vector2 v2] )</h3>
<p>
[page:Vector2 v0] – 시작점입니다.<br/>
[page:Vector2 v1] – 조절점입니다.<br/>
[page:Vector2 v2] – 종착점입니다.
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Vector2 v0]</h3>
<p>시작점입니다.</p>
<h3>[property:Vector2 v1]</h3>
<p>조절점입니다.</p>
<h3>[property:Vector2 v2]</h3>
<p>종착점입니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">
시작점, 종착점, 두 개의 조절점을 통해 매끄러운 3d
<a href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve#mediaviewer/File:B%C3%A9zier_2_big.gif" target="_blank">이차 베지에 곡선</a>을 만듭니다.
</p>
<h2>코드 예제</h2>
<code>
const curve = new THREE.QuadraticBezierCurve3(
new THREE.Vector3( -10, 0, 0 ),
new THREE.Vector3( 20, 15, 0 ),
new THREE.Vector3( 10, 0, 0 )
);
const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
// Create the final object to add to the scene
const curveObject = new THREE.Line( geometry, material );
</code>
<h2>생성자</h2>
<h3>[name]( [param:Vector3 v0], [param:Vector3 v1], [param:Vector3 v2] )</h3>
<p>
[page:Vector3 v0] – 시작점입니다.<br/>
[page:Vector3 v1] – 중앙 조절점입니다.<br/>
[page:Vector3 v2] – 종착점입니다.<br/>
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Vector3 v0]</h3>
<p>시작점입니다.</p>
<h3>[property:Vector3 v1]</h3>
<p>조절점입니다.</p>
<h3>[property:Vector3 v2]</h3>
<p>종착점입니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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:Curve] &rarr;
<h1>[name]</h1>
<p class="desc">
연속된 점들로부터 매끄러운 2d 곡선을 만듭니다. 내부적으로 [page:Interpolations.CatmullRom]을 사용해 곡선을 만듭니다.
</p>
<h2>코드 예제</h2>
<code>
// Create a sine-like wave
const curve = new THREE.SplineCurve( [
new THREE.Vector2( -10, 0 ),
new THREE.Vector2( -5, 5 ),
new THREE.Vector2( 0, 0 ),
new THREE.Vector2( 5, -5 ),
new THREE.Vector2( 10, 0 )
] );
const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
// Create the final object to add to the scene
const splineObject = new THREE.Line( geometry, material );
</code>
<h2>생성자</h2>
<h3>[name]( [param:Array points] )</h3>
<p>points – [page:Vector2] 배열의 점으로 곡선을 정의합니다.</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼티는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h3>[property:Array points]</h3>
<p>곡선을 정의하는 [page:Vector2] 점들의 배열입니다.</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Curve] 클래스를 참고하세요.</p>
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
<!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">
이 실험 클래스는 자주 업데이트되는 기하학 데이터로 메쉬를 렌더링하기 위한 빠른 코드 패스를 제공합니다. 렌더러가 [name]의 인스턴스를 만나면, 가장 원시적인 렌더링 작업(예: 바인딩 꼭짓점 속성, 정확한 셰이더 프로그램 결정 또는 실제 드로우 콜 수행)에만 신경을 씁니다. 뷰 펑퍼텀 도금, 와이어프레임 렌더링 또는 다중 재료 사용과 같은 기능은 지원되지 않습니다. [name]은 삼각형을 렌더링하는 데에만 사용할 수 있습니다.
</p>
<p class="desc">
[name]는 [page:BufferGeometry] 인스턴스와 함께 작동되지 않습니다. 원시 기하학 데이터가 [name]의 프로퍼티로 저장돼야 합니다.
</p>
<p class="desc">
[name]은 기하학 데이터를 프레임마다 업데이트할 때만 작동합니다. 기본 메쉬 렌더링 로직에 비해 빠른 코드 패스를 경험할 수 있습니다.
</p>
<h2>예제</h2>
<p>
[example:webgl_marchingcubes Marching Cubes]
</p>
<h2>생성자</h2>
<h3>[name]( [param:Material material] )</h3>
<p>
[page:Material material] — [name]의 재질.
</p>
<h2>프로퍼티</h2>
<p>일반 프로퍼니틑 기본 [page:Object3D] 클래스를 참고하세요.</p>
<h3>[property:Boolean material]</h3>
<p>
[name]의 재질. 여러 재질을 할당하는 것은 지원되지 않습니다.
</p>
<h3>[property:Boolean hasPositions]</h3>
<p>
위치 데이터가 정의되었는지입니다. 기본값은 *false*입니다.
</p>
<h3>[property:Boolean hasNormals]</h3>
<p>
법선 데이터가 정의되었는지입니다. 기본값은 *false*입니다.
</p>
<h3>[property:Boolean hasColors]</h3>
<p>
색상 데이터가 정의되었는지입니다. 기본값은 *false*입니다.
</p>
<h3>[property:Boolean hasUvs]</h3>
<p>
텍스쳐 좌표가 정의되었는지입니다. 기본값은 *false*입니다.
</p>
<h3>[property:Float32Array positionArray]</h3>
<p>
위치 데이터를 담고 있는 버퍼입니다. 기본값은 *null*입니다.
</p>
<h3>[property:Float32Array normalArray]</h3>
<p>
법선 데이터를 담고 있는 버퍼입니다. 기본값은 *null*입니다.
</p>
<h3>[property:Float32Array colorArray]</h3>
<p>
색상 데이터를 담고 있는 버퍼입니다. 기본값은 *null*입니다.
</p>
<h3>[property:Float32Array uvArray]</h3>
<p>
텍스쳐 좌표를 담고 있는 버퍼입니다. 기본값은 *null*입니다.
</p>
<h3>[property:Integer count]</h3>
<p>
렌더링될 개체의 수입니다. 기본값은 *0*입니다.
매 렌더링 이후에 이 프로퍼티는 *0*으로 설정될 것이기 때문에 [page:.render]() 실행 범위 안에 주로 설정하곤 합니다.
</p>
<h2>메서드</h2>
<p>일반 메서드는 기본 [page:Object3D] 클래스를 참고하세요.</p>
<h3>[method:null render]([param:Function renderCallback])</h3>
<p>
renderCallback -- 생성된 기하학 데이터를 렌더링하는 함수입니다.
</p>
<p>
이 메서드는 [name]의 파생클래스에서 상속받아야합니다. 일반적으로 실행 마지막 부분에 꼭짓점 버퍼 업데이트 로직을 구현하고 *renderCallback*을 사용합니다.
<h2>소스코드</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册