提交 1659408c 编写于 作者: M Mr.doob

Merge branch 'dev' into geometry

# Conflicts:
#	examples/js/geometries/ConvexGeometry.js
#	examples/jsm/geometries/ConvexGeometry.js
#	src/Three.Legacy.js
#	test/unit/src/core/Geometry.tests.js
...@@ -39,7 +39,7 @@ function init() { ...@@ -39,7 +39,7 @@ function init() {
scene = new THREE.Scene(); scene = new THREE.Scene();
geometry = new THREE.BoxBufferGeometry( 0.2, 0.2, 0.2 ); geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );
material = new THREE.MeshNormalMaterial(); material = new THREE.MeshNormalMaterial();
mesh = new THREE.Mesh( geometry, material ); mesh = new THREE.Mesh( geometry, material );
...@@ -62,7 +62,7 @@ function animation( time ) { ...@@ -62,7 +62,7 @@ function animation( time ) {
} }
``` ```
If everything went well, you should see [this](https://jsfiddle.net/9v7eqwu1/). If everything went well, you should see [this](https://jsfiddle.net/zdjankqw/).
### Cloning this repository ### ### Cloning this repository ###
......
此差异已折叠。
此差异已折叠。
此差异已折叠。
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
}); });
// create an object for the sound to play from // create an object for the sound to play from
const sphere = new THREE.SphereBufferGeometry( 20, 32, 16 ); const sphere = new THREE.SphereGeometry( 20, 32, 16 );
const material = new THREE.MeshPhongMaterial( { color: 0xff2200 } ); const material = new THREE.MeshPhongMaterial( { color: 0xff2200 } );
const mesh = new THREE.Mesh( sphere, material ); const mesh = new THREE.Mesh( sphere, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
}); });
// create an object for the sound to play from // create an object for the sound to play from
const sphere = new THREE.SphereBufferGeometry( 20, 32, 16 ); const sphere = new THREE.SphereGeometry( 20, 32, 16 );
const material = new THREE.MeshPhongMaterial( { color: 0xff2200 } ); const material = new THREE.MeshPhongMaterial( { color: 0xff2200 } );
const mesh = new THREE.Mesh( sphere, material ); const mesh = new THREE.Mesh( sphere, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
const extrudeSettings = { amount: 8, bevelEnabled: true, bevelSegments: 2, steps: 2, bevelSize: 1, bevelThickness: 1 }; const extrudeSettings = { amount: 8, bevelEnabled: true, bevelSegments: 2, steps: 2, bevelSize: 1, bevelThickness: 1 };
const geometry = new THREE.ExtrudeBufferGeometry( heartShape, extrudeSettings ); const geometry = new THREE.ExtrudeGeometry( heartShape, extrudeSettings );
const mesh = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial() ); const mesh = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial() );
</code> </code>
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
On creation, the cuboid is centred on the origin, with each edge parallel to one of the axes. On creation, the cuboid is centred on the origin, with each edge parallel to one of the axes.
</p> </p>
<iframe id="scene" src="scenes/geometry-browser.html#BoxBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#BoxGeometry"></iframe>
<script> <script>
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code>const geometry = new THREE.BoxBufferGeometry( 1, 1, 1 ); <code>const geometry = new THREE.BoxGeometry( 1, 1, 1 );
const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} ); const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
......
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
It can also be used to create regular polygons, where the number of segments determines the number of sides. It can also be used to create regular polygons, where the number of segments determines the number of sides.
</p> </p>
<iframe id="scene" src="scenes/geometry-browser.html#CircleBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#CircleGeometry"></iframe>
<script> <script>
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.CircleBufferGeometry( 5, 32 ); const geometry = new THREE.CircleGeometry( 5, 32 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const circle = new THREE.Mesh( geometry, material ); const circle = new THREE.Mesh( geometry, material );
scene.add( circle ); scene.add( circle );
......
...@@ -7,13 +7,13 @@ ...@@ -7,13 +7,13 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:BufferGeometry] &rarr; [page:CylinderBufferGeometry] &rarr; [page:BufferGeometry] &rarr; [page:CylinderGeometry] &rarr;
<h1>[name]</h1> <h1>[name]</h1>
<p class="desc">A class for generating cone geometries.</p> <p class="desc">A class for generating cone geometries.</p>
<iframe id="scene" src="scenes/geometry-browser.html#ConeBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#ConeGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code>const geometry = new THREE.ConeBufferGeometry( 5, 20, 32 ); <code>const geometry = new THREE.ConeGeometry( 5, 20, 32 );
const material = new THREE.MeshBasicMaterial( {color: 0xffff00} ); const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
const cone = new THREE.Mesh( geometry, material ); const cone = new THREE.Mesh( geometry, material );
scene.add( cone ); scene.add( cone );
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
</p> </p>
<h2>Properties</h2> <h2>Properties</h2>
<p>See the base [page:CylinderBufferGeometry] class for common properties.</p> <p>See the base [page:CylinderGeometry] class for common properties.</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -61,7 +61,7 @@ ...@@ -61,7 +61,7 @@
</p> </p>
<h2>Methods</h2> <h2>Methods</h2>
<p>See the base [page:CylinderBufferGeometry] class for common methods.</p> <p>See the base [page:CylinderGeometry] class for common methods.</p>
<h2>Source</h2> <h2>Source</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">A class for generating cylinder geometries.</p> <p class="desc">A class for generating cylinder geometries.</p>
<iframe id="scene" src="scenes/geometry-browser.html#CylinderBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#CylinderGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code>const geometry = new THREE.CylinderBufferGeometry( 5, 5, 20, 32 ); <code>const geometry = new THREE.CylinderGeometry( 5, 5, 20, 32 );
const material = new THREE.MeshBasicMaterial( {color: 0xffff00} ); const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
const cylinder = new THREE.Mesh( geometry, material ); const cylinder = new THREE.Mesh( geometry, material );
scene.add( cylinder ); scene.add( cylinder );
......
...@@ -7,13 +7,13 @@ ...@@ -7,13 +7,13 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:BufferGeometry] &rarr; [page:PolyhedronBufferGeometry] &rarr; [page:BufferGeometry] &rarr; [page:PolyhedronGeometry] &rarr;
<h1>[name]</h1> <h1>[name]</h1>
<p class="desc">A class for generating a dodecahedron geometries.</p> <p class="desc">A class for generating a dodecahedron geometries.</p>
<iframe id="scene" src="scenes/geometry-browser.html#DodecahedronBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#DodecahedronGeometry"></iframe>
<script> <script>
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
</p> </p>
<h2>Properties</h2> <h2>Properties</h2>
<p>See the base [page:PolyhedronBufferGeometry] class for common properties.</p> <p>See the base [page:PolyhedronGeometry] class for common properties.</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
</p> </p>
<h2>Methods</h2> <h2>Methods</h2>
<p>See the base [page:PolyhedronBufferGeometry] class for common methods.</p> <p>See the base [page:PolyhedronGeometry] class for common methods.</p>
<h2>Source</h2> <h2>Source</h2>
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 100, 100, 100 ); const geometry = new THREE.BoxGeometry( 100, 100, 100 );
const edges = new THREE.EdgesGeometry( geometry ); const edges = new THREE.EdgesGeometry( geometry );
const line = new THREE.LineSegments( edges, new THREE.LineBasicMaterial( { color: 0xffffff } ) ); const line = new THREE.LineSegments( edges, new THREE.LineBasicMaterial( { color: 0xffffff } ) );
scene.add( line ); scene.add( line );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">Creates extruded geometry from a path shape.</p> <p class="desc">Creates extruded geometry from a path shape.</p>
<iframe id="scene" src="scenes/geometry-browser.html#ExtrudeBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#ExtrudeGeometry"></iframe>
<script> <script>
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
bevelSegments: 1 bevelSegments: 1
}; };
const geometry = new THREE.ExtrudeBufferGeometry( shape, extrudeSettings ); const geometry = new THREE.ExtrudeGeometry( shape, extrudeSettings );
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const mesh = new THREE.Mesh( geometry, material ) ; const mesh = new THREE.Mesh( geometry, material ) ;
scene.add( mesh ); scene.add( mesh );
......
...@@ -7,12 +7,12 @@ ...@@ -7,12 +7,12 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:BufferGeometry] &rarr; [page:PolyhedronBufferGeometry] &rarr; [page:BufferGeometry] &rarr; [page:PolyhedronGeometry] &rarr;
<h1>[name]</h1> <h1>[name]</h1>
<p class="desc">A class for generating an icosahedron geometry.</p> <p class="desc">A class for generating an icosahedron geometry.</p>
<iframe id="scene" src="scenes/geometry-browser.html#IcosahedronBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#IcosahedronGeometry"></iframe>
<script> <script>
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
</p> </p>
<h2>Properties</h2> <h2>Properties</h2>
<p>See the base [page:PolyhedronBufferGeometry] class for common properties.</p> <p>See the base [page:PolyhedronGeometry] class for common properties.</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
</p> </p>
<h2>Methods</h2> <h2>Methods</h2>
<p>See the base [page:PolyhedronBufferGeometry] class for common methods.</p> <p>See the base [page:PolyhedronGeometry] class for common methods.</p>
<h2>Source</h2> <h2>Source</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">Creates meshes with axial symmetry like vases. The lathe rotates around the Y axis.</p> <p class="desc">Creates meshes with axial symmetry like vases. The lathe rotates around the Y axis.</p>
<iframe id="scene" src="scenes/geometry-browser.html#LatheBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#LatheGeometry"></iframe>
<script> <script>
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
for ( let i = 0; i < 10; i ++ ) { for ( let i = 0; i < 10; i ++ ) {
points.push( new THREE.Vector2( Math.sin( i * 0.2 ) * 10 + 5, ( i - 5 ) * 2 ) ); points.push( new THREE.Vector2( Math.sin( i * 0.2 ) * 10 + 5, ( i - 5 ) * 2 ) );
} }
const geometry = new THREE.LatheBufferGeometry( points ); const geometry = new THREE.LatheGeometry( points );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const lathe = new THREE.Mesh( geometry, material ); const lathe = new THREE.Mesh( geometry, material );
scene.add( lathe ); scene.add( lathe );
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
phiLength — the radian (0 to 2PI) range of the lathed section 2PI is a closed lathe, less than 2PI is a portion. Default is 2PI. phiLength — the radian (0 to 2PI) range of the lathed section 2PI is a closed lathe, less than 2PI is a portion. Default is 2PI.
</p> </p>
<p> <p>
This creates a LatheBufferGeometry based on the parameters. This creates a [name] based on the parameters.
</p> </p>
<h2>Properties</h2> <h2>Properties</h2>
......
...@@ -7,12 +7,12 @@ ...@@ -7,12 +7,12 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:BufferGeometry] &rarr; [page:PolyhedronBufferGeometry] &rarr; [page:BufferGeometry] &rarr; [page:PolyhedronGeometry] &rarr;
<h1>[name]</h1> <h1>[name]</h1>
<p class="desc">A class for generating an octahedron geometry.</p> <p class="desc">A class for generating an octahedron geometry.</p>
<iframe id="scene" src="scenes/geometry-browser.html#OctahedronBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#OctahedronGeometry"></iframe>
<script> <script>
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
</p> </p>
<h2>Properties</h2> <h2>Properties</h2>
<p>See the base [page:PolyhedronBufferGeometry] class for common properties.</p> <p>See the base [page:PolyhedronGeometry] class for common properties.</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
</p> </p>
<h2>Methods</h2> <h2>Methods</h2>
<p>See the base [page:PolyhedronBufferGeometry] class for common methods.</p> <p>See the base [page:PolyhedronGeometry] class for common methods.</p>
<h2>Source</h2> <h2>Source</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">Generate geometry representing a parametric surface.</p> <p class="desc">Generate geometry representing a parametric surface.</p>
<iframe id="scene" src="scenes/geometry-browser.html#ParametricBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#ParametricGeometry"></iframe>
<script> <script>
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.ParametricBufferGeometry( THREE.ParametricGeometries.klein, 25, 25 ); const geometry = new THREE.ParametricGeometry( THREE.ParametricGeometries.klein, 25, 25 );
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const klein = new THREE.Mesh( geometry, material ); const klein = new THREE.Mesh( geometry, material );
scene.add( klein ); scene.add( klein );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">A class for generating plane geometries.</p> <p class="desc">A class for generating plane geometries.</p>
<iframe id="scene" src="scenes/geometry-browser.html#PlaneBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#PlaneGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code>const geometry = new THREE.PlaneBufferGeometry( 5, 20, 32 ); <code>const geometry = new THREE.PlaneGeometry( 5, 20, 32 );
const material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} ); const material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} );
const plane = new THREE.Mesh( geometry, material ); const plane = new THREE.Mesh( geometry, material );
scene.add( plane ); scene.add( plane );
......
...@@ -14,8 +14,8 @@ ...@@ -14,8 +14,8 @@
<p class="desc"> <p class="desc">
A polyhedron is a solid in three dimensions with flat faces. This class will take an array of vertices, A polyhedron is a solid in three dimensions with flat faces. This class will take an array of vertices,
project them onto a sphere, and then divide them up to the desired level of detail. This class is used project them onto a sphere, and then divide them up to the desired level of detail. This class is used
by [page:DodecahedronBufferGeometry], [page:IcosahedronBufferGeometry], [page:OctahedronBufferGeometry], by [page:DodecahedronGeometry], [page:IcosahedronGeometry], [page:OctahedronGeometry],
and [page:TetrahedronBufferGeometry] to generate their respective geometries. and [page:TetrahedronGeometry] to generate their respective geometries.
</p> </p>
<h2>Code Example</h2> <h2>Code Example</h2>
...@@ -34,7 +34,7 @@ const indicesOfFaces = [ ...@@ -34,7 +34,7 @@ const indicesOfFaces = [
4,5,6, 6,7,4 4,5,6, 6,7,4
]; ];
const geometry = new THREE.PolyhedronBufferGeometry( verticesOfCube, indicesOfFaces, 6, 2 ); const geometry = new THREE.PolyhedronGeometry( verticesOfCube, indicesOfFaces, 6, 2 );
</code> </code>
<h2>Constructor</h2> <h2>Constructor</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">A class for generating a two-dimensional ring geometry.</p> <p class="desc">A class for generating a two-dimensional ring geometry.</p>
<iframe id="scene" src="scenes/geometry-browser.html#RingBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#RingGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code>const geometry = new THREE.RingBufferGeometry( 1, 5, 32 ); <code>const geometry = new THREE.RingGeometry( 1, 5, 32 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } );
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">Creates an one-sided polygonal geometry from one or more path shapes.</p> <p class="desc">Creates an one-sided polygonal geometry from one or more path shapes.</p>
<iframe id="scene" src="scenes/geometry-browser.html#ShapeBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#ShapeGeometry"></iframe>
<script> <script>
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
heartShape.bezierCurveTo( x + 16, y + 7, x + 16, y, x + 10, y ); heartShape.bezierCurveTo( x + 16, y + 7, x + 16, y, x + 10, y );
heartShape.bezierCurveTo( x + 7, y, x + 5, y + 5, x + 5, y + 5 ); heartShape.bezierCurveTo( x + 7, y, x + 5, y + 5, x + 5, y + 5 );
const geometry = new THREE.ShapeBufferGeometry( heartShape ); const geometry = new THREE.ShapeGeometry( heartShape );
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const mesh = new THREE.Mesh( geometry, material ) ; const mesh = new THREE.Mesh( geometry, material ) ;
scene.add( mesh ); scene.add( mesh );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">A class for generating sphere geometries.</p> <p class="desc">A class for generating sphere geometries.</p>
<iframe id="scene" src="scenes/geometry-browser.html#SphereBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#SphereGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code>const geometry = new THREE.SphereBufferGeometry( 5, 32, 32 ); <code>const geometry = new THREE.SphereGeometry( 5, 32, 32 );
const material = new THREE.MeshBasicMaterial( {color: 0xffff00} ); const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
const sphere = new THREE.Mesh( geometry, material ); const sphere = new THREE.Mesh( geometry, material );
scene.add( sphere ); scene.add( sphere );
......
...@@ -7,13 +7,13 @@ ...@@ -7,13 +7,13 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:BufferGeometry] &rarr; [page:PolyhedronBufferGeometry] &rarr; [page:BufferGeometry] &rarr; [page:PolyhedronGeometry] &rarr;
<h1>[name]</h1> <h1>[name]</h1>
<p class="desc">A class for generating a tetrahedron geometries.</p> <p class="desc">A class for generating a tetrahedron geometries.</p>
<iframe id="scene" src="scenes/geometry-browser.html#TetrahedronBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TetrahedronGeometry"></iframe>
<script> <script>
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
</p> </p>
<h2>Properties</h2> <h2>Properties</h2>
<p>See the base [page:PolyhedronBufferGeometry] class for common properties.</p> <p>See the base [page:PolyhedronGeometry] class for common properties.</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
</p> </p>
<h2>Methods</h2> <h2>Methods</h2>
<p>See the base [page:PolyhedronBufferGeometry] class for common methods.</p> <p>See the base [page:PolyhedronGeometry] class for common methods.</p>
<h2>Source</h2> <h2>Source</h2>
......
...@@ -7,17 +7,17 @@ ...@@ -7,17 +7,17 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:BufferGeometry] &rarr; [page:ExtrudeBufferGeometry] &rarr; [page:BufferGeometry] &rarr; [page:ExtrudeGeometry] &rarr;
<h1>[name]</h1> <h1>[name]</h1>
<p class="desc"> <p class="desc">
A class for generating text as a single geometry. It is constructed by providing a string of text, and a hash of A class for generating text as a single geometry. It is constructed by providing a string of text, and a hash of
parameters consisting of a loaded [page:Font] and settings for the geometry's parent [page:ExtrudeBufferGeometry]. parameters consisting of a loaded [page:Font] and settings for the geometry's parent [page:ExtrudeGeometry].
See the [page:Font], [page:FontLoader] and [page:Creating_Text] pages for additional details. See the [page:Font], [page:FontLoader] and [page:Creating_Text] pages for additional details.
</p> </p>
<iframe id="scene" src="scenes/geometry-browser.html#TextBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TextGeometry"></iframe>
<script> <script>
...@@ -42,7 +42,7 @@ ...@@ -42,7 +42,7 @@
loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) { loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) {
const geometry = new THREE.TextBufferGeometry( 'Hello three.js!', { const geometry = new THREE.TextGeometry( 'Hello three.js!', {
font: font, font: font,
size: 80, size: 80,
height: 5, height: 5,
...@@ -157,7 +157,7 @@ ...@@ -157,7 +157,7 @@
</table> </table>
<h2>Properties</h2> <h2>Properties</h2>
<p>See the base [page:ExtrudeBufferGeometry] class for common properties.</p> <p>See the base [page:ExtrudeGeometry] class for common properties.</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -165,7 +165,7 @@ ...@@ -165,7 +165,7 @@
</p> </p>
<h2>Methods</h2> <h2>Methods</h2>
<p>See the base [page:ExtrudeBufferGeometry] class for common methods.</p> <p>See the base [page:ExtrudeGeometry] class for common methods.</p>
<h2>Source</h2> <h2>Source</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">A class for generating torus geometries.</p> <p class="desc">A class for generating torus geometries.</p>
<iframe id="scene" src="scenes/geometry-browser.html#TorusBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TorusGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code>const geometry = new THREE.TorusBufferGeometry( 10, 3, 16, 100 ); <code>const geometry = new THREE.TorusGeometry( 10, 3, 16, 100 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const torus = new THREE.Mesh( geometry, material ); const torus = new THREE.Mesh( geometry, material );
scene.add( torus ); scene.add( torus );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">Creates a torus knot, the particular shape of which is defined by a pair of coprime integers, p and q. If p and q are not coprime, the result will be a torus link.</p> <p class="desc">Creates a torus knot, the particular shape of which is defined by a pair of coprime integers, p and q. If p and q are not coprime, the result will be a torus link.</p>
<iframe id="scene" src="scenes/geometry-browser.html#TorusKnotBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TorusKnotGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code>const geometry = new THREE.TorusKnotBufferGeometry( 10, 3, 100, 16 ); <code>const geometry = new THREE.TorusKnotGeometry( 10, 3, 100, 16 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const torusKnot = new THREE.Mesh( geometry, material ); const torusKnot = new THREE.Mesh( geometry, material );
scene.add( torusKnot ); scene.add( torusKnot );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">Creates a tube that extrudes along a 3d curve.</p> <p class="desc">Creates a tube that extrudes along a 3d curve.</p>
<iframe id="scene" src="scenes/geometry-browser.html#TubeBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TubeGeometry"></iframe>
<script> <script>
...@@ -57,7 +57,7 @@ ...@@ -57,7 +57,7 @@
} }
const path = new CustomSinCurve( 10 ); const path = new CustomSinCurve( 10 );
const geometry = new THREE.TubeBufferGeometry( path, 20, 2, 8, false ); const geometry = new THREE.TubeGeometry( path, 20, 2, 8, false );
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.SphereBufferGeometry( 100, 100, 100 ); const geometry = new THREE.SphereGeometry( 100, 100, 100 );
const wireframe = new THREE.WireframeGeometry( geometry ); const wireframe = new THREE.WireframeGeometry( geometry );
......
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const sphere = new THREE.SphereBufferGeometry(); const sphere = new THREE.SphereGeometry();
const object = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( 0xff0000 ) ); const object = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( 0xff0000 ) );
const box = new THREE.BoxHelper( object, 0xffff00 ); const box = new THREE.BoxHelper( object, 0xffff00 );
scene.add( box ); scene.add( box );
......
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
light.shadow.camera.far = 500; // default light.shadow.camera.far = 500; // default
//Create a sphere that cast shadows (but does not receive them) //Create a sphere that cast shadows (but does not receive them)
const sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 ); const sphereGeometry = new THREE.SphereGeometry( 5, 32, 32 );
const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } ); const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial ); const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
sphere.castShadow = true; //default is false sphere.castShadow = true; //default is false
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
scene.add( sphere ); scene.add( sphere );
//Create a plane that receives shadows (but does not cast them) //Create a plane that receives shadows (but does not cast them)
const planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 ); const planeGeometry = new THREE.PlaneGeometry( 20, 20, 32, 32 );
const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } ) const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
const plane = new THREE.Mesh( planeGeometry, planeMaterial ); const plane = new THREE.Mesh( planeGeometry, planeMaterial );
plane.receiveShadow = true; plane.receiveShadow = true;
......
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
light.shadow.camera.far = 500; // default light.shadow.camera.far = 500; // default
//Create a sphere that cast shadows (but does not receive them) //Create a sphere that cast shadows (but does not receive them)
const sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 ); const sphereGeometry = new THREE.SphereGeometry( 5, 32, 32 );
const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } ); const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial ); const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
sphere.castShadow = true; //default is false sphere.castShadow = true; //default is false
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
scene.add( sphere ); scene.add( sphere );
//Create a plane that receives shadows (but does not cast them) //Create a plane that receives shadows (but does not cast them)
const planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 ); const planeGeometry = new THREE.PlaneGeometry( 20, 20, 32, 32 );
const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } ) const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
const plane = new THREE.Mesh( planeGeometry, planeMaterial ); const plane = new THREE.Mesh( planeGeometry, planeMaterial );
plane.receiveShadow = true; plane.receiveShadow = true;
......
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
light.shadow.focus = 1; // default light.shadow.focus = 1; // default
//Create a sphere that cast shadows (but does not receive them) //Create a sphere that cast shadows (but does not receive them)
const sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 ); const sphereGeometry = new THREE.SphereGeometry( 5, 32, 32 );
const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } ); const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial ); const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
sphere.castShadow = true; //default is false sphere.castShadow = true; //default is false
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
scene.add( sphere ); scene.add( sphere );
//Create a plane that receives shadows (but does not cast them) //Create a plane that receives shadows (but does not cast them)
const planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 ); const planeGeometry = new THREE.PlaneGeometry( 20, 20, 32, 32 );
const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } ) const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
const plane = new THREE.Mesh( planeGeometry, planeMaterial ); const plane = new THREE.Mesh( planeGeometry, planeMaterial );
plane.receiveShadow = true; plane.receiveShadow = true;
......
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.PlaneBufferGeometry( 2000, 2000 ); const geometry = new THREE.PlaneGeometry( 2000, 2000 );
geometry.rotateX( - Math.PI / 2 ); geometry.rotateX( - Math.PI / 2 );
const material = new THREE.ShadowMaterial(); const material = new THREE.ShadowMaterial();
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
const box = new THREE.Box3(); const box = new THREE.Box3();
const mesh = new THREE.Mesh( const mesh = new THREE.Mesh(
new THREE.SphereBufferGeometry(), new THREE.SphereGeometry(),
new THREE.MeshBasicMaterial() new THREE.MeshBasicMaterial()
); );
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 1, 1, 1 ); const geometry = new THREE.BoxGeometry( 1, 1, 1 );
const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} ); const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
const cubeA = new THREE.Mesh( geometry, material ); const cubeA = new THREE.Mesh( geometry, material );
......
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
//Create spheres with 3 levels of detail and create new LOD levels for them //Create spheres with 3 levels of detail and create new LOD levels for them
for( let i = 0; i < 3; i++ ) { for( let i = 0; i < 3; i++ ) {
const geometry = new THREE.IcosahedronBufferGeometry( 10, 3 - i ) const geometry = new THREE.IcosahedronGeometry( 10, 3 - i )
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 1, 1, 1 ); const geometry = new THREE.BoxGeometry( 1, 1, 1 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.CylinderBufferGeometry( 5, 5, 5, 5, 15, 5, 30 ); const geometry = new THREE.CylinderGeometry( 5, 5, 5, 5, 15, 5, 30 );
// create the skin indices and skin weights // create the skin indices and skin weights
......
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
}); });
// create an object for the sound to play from // create an object for the sound to play from
const sphere = new THREE.SphereBufferGeometry( 20, 32, 16 ); const sphere = new THREE.SphereGeometry( 20, 32, 16 );
const material = new THREE.MeshPhongMaterial( { color: 0xff2200 } ); const material = new THREE.MeshPhongMaterial( { color: 0xff2200 } );
const mesh = new THREE.Mesh( sphere, material ); const mesh = new THREE.Mesh( sphere, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
}); });
// create an object for the sound to play from // create an object for the sound to play from
const sphere = new THREE.SphereBufferGeometry( 20, 32, 16 ); const sphere = new THREE.SphereGeometry( 20, 32, 16 );
const material = new THREE.MeshPhongMaterial( { color: 0xff2200 } ); const material = new THREE.MeshPhongMaterial( { color: 0xff2200 } );
const mesh = new THREE.Mesh( sphere, material ); const mesh = new THREE.Mesh( sphere, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
const extrudeSettings = { amount: 8, bevelEnabled: true, bevelSegments: 2, steps: 2, bevelSize: 1, bevelThickness: 1 }; const extrudeSettings = { amount: 8, bevelEnabled: true, bevelSegments: 2, steps: 2, bevelSize: 1, bevelThickness: 1 };
const geometry = new THREE.ExtrudeBufferGeometry( heartShape, extrudeSettings ); const geometry = new THREE.ExtrudeGeometry( heartShape, extrudeSettings );
const mesh = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial() ); const mesh = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial() );
</code> </code>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">[name]是四边形的原始几何类,它通常使用构造函数所提供的“width”、“height”、“depth”参数来创建立方体或者不规则四边形。</p> <p class="desc">[name]是四边形的原始几何类,它通常使用构造函数所提供的“width”、“height”、“depth”参数来创建立方体或者不规则四边形。</p>
<iframe id="scene" src="scenes/geometry-browser.html#BoxBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#BoxGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code>const geometry = new THREE.BoxBufferGeometry( 1, 1, 1 ); <code>const geometry = new THREE.BoxGeometry( 1, 1, 1 );
const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} ); const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">[name]是欧式几何的一个简单形状,它由围绕着一个中心点的三角分段的数量所构造,由给定的半径来延展。 同时它也可以用于创建规则多边形,其分段数量取决于该规则多边形的边数。</p> <p class="desc">[name]是欧式几何的一个简单形状,它由围绕着一个中心点的三角分段的数量所构造,由给定的半径来延展。 同时它也可以用于创建规则多边形,其分段数量取决于该规则多边形的边数。</p>
<iframe id="scene" src="scenes/geometry-browser.html#CircleBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#CircleGeometry"></iframe>
<script> <script>
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.CircleBufferGeometry( 5, 32 ); const geometry = new THREE.CircleGeometry( 5, 32 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const circle = new THREE.Mesh( geometry, material ); const circle = new THREE.Mesh( geometry, material );
scene.add( circle ); scene.add( circle );
......
...@@ -7,13 +7,13 @@ ...@@ -7,13 +7,13 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:CylinderBufferGeometry] &rarr; [page:CylinderGeometry] &rarr;
<h1>圆锥缓冲几何体([name])</h1> <h1>圆锥缓冲几何体([name])</h1>
<p class="desc">一个用于生成圆锥几何体的类。</p> <p class="desc">一个用于生成圆锥几何体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#ConeBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#ConeGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code>const geometry = new THREE.ConeBufferGeometry( 5, 20, 32 ); <code>const geometry = new THREE.ConeGeometry( 5, 20, 32 );
const material = new THREE.MeshBasicMaterial( {color: 0xffff00} ); const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
const cone = new THREE.Mesh( geometry, material ); const cone = new THREE.Mesh( geometry, material );
scene.add( cone ); scene.add( cone );
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
</p> </p>
<h2>属性</h2> <h2>属性</h2>
<p>共有属性请参见其基类[page:CylinderBufferGeometry]。</p> <p>共有属性请参见其基类[page:CylinderGeometry]。</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -61,7 +61,7 @@ ...@@ -61,7 +61,7 @@
</p> </p>
<h2>方法(Methods)</h2> <h2>方法(Methods)</h2>
<p>共有方法请参见其基类[page:CylinderBufferGeometry]。</p> <p>共有方法请参见其基类[page:CylinderGeometry]。</p>
<h2>源代码</h2> <h2>源代码</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">一个用于生成圆柱几何体的类。</p> <p class="desc">一个用于生成圆柱几何体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#CylinderBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#CylinderGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code>const geometry = new THREE.CylinderBufferGeometry( 5, 5, 20, 32 ); <code>const geometry = new THREE.CylinderGeometry( 5, 5, 20, 32 );
const material = new THREE.MeshBasicMaterial( {color: 0xffff00} ); const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
const cylinder = new THREE.Mesh( geometry, material ); const cylinder = new THREE.Mesh( geometry, material );
scene.add( cylinder ); scene.add( cylinder );
......
...@@ -7,13 +7,13 @@ ...@@ -7,13 +7,13 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:PolyhedronBufferGeometry] &rarr; [page:PolyhedronGeometry] &rarr;
<h1>十二面缓冲几何体([name])</h1> <h1>十二面缓冲几何体([name])</h1>
<p class="desc">一个用于创建十二面几何体的类。</p> <p class="desc">一个用于创建十二面几何体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#DodecahedronBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#DodecahedronGeometry"></iframe>
<script> <script>
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
</p> </p>
<h2>属性</h2> <h2>属性</h2>
<p>共有属性请参见其基类[page:PolyhedronBufferGeometry]。</p> <p>共有属性请参见其基类[page:PolyhedronGeometry]。</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
</p> </p>
<h2>方法(Methods)</h2> <h2>方法(Methods)</h2>
<p>共有方法请参见其基类[page:PolyhedronBufferGeometry]。</p> <p>共有方法请参见其基类[page:PolyhedronGeometry]。</p>
<h2>源代码</h2> <h2>源代码</h2>
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 100, 100, 100 ); const geometry = new THREE.BoxGeometry( 100, 100, 100 );
const edges = new THREE.EdgesGeometry( geometry ); const edges = new THREE.EdgesGeometry( geometry );
const line = new THREE.LineSegments( edges, new THREE.LineBasicMaterial( { color: 0xffffff } ) ); const line = new THREE.LineSegments( edges, new THREE.LineBasicMaterial( { color: 0xffffff } ) );
scene.add( line ); scene.add( line );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">从一个形状路径中,挤压出一个BufferGeometry。</p> <p class="desc">从一个形状路径中,挤压出一个BufferGeometry。</p>
<iframe id="scene" src="scenes/geometry-browser.html#ExtrudeBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#ExtrudeGeometry"></iframe>
<script> <script>
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
bevelSegments: 1 bevelSegments: 1
}; };
const geometry = new THREE.ExtrudeBufferGeometry( shape, extrudeSettings ); const geometry = new THREE.ExtrudeGeometry( shape, extrudeSettings );
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const mesh = new THREE.Mesh( geometry, material ) ; const mesh = new THREE.Mesh( geometry, material ) ;
scene.add( mesh ); scene.add( mesh );
......
...@@ -7,12 +7,12 @@ ...@@ -7,12 +7,12 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:PolyhedronBufferGeometry] &rarr; [page:PolyhedronGeometry] &rarr;
<h1>二十面缓冲几何体([name])</h1> <h1>二十面缓冲几何体([name])</h1>
<p class="desc">一个用于生成二十面体的类。</p> <p class="desc">一个用于生成二十面体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#IcosahedronBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#IcosahedronGeometry"></iframe>
<script> <script>
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
</p> </p>
<h2>属性</h2> <h2>属性</h2>
<p>共有属性请参见其基类[page:PolyhedronBufferGeometry]。</p> <p>共有属性请参见其基类[page:PolyhedronGeometry]。</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
</p> </p>
<h2>方法(Methods)</h2> <h2>方法(Methods)</h2>
<p>共有方法请参见其基类[page:PolyhedronBufferGeometry]。</p> <p>共有方法请参见其基类[page:PolyhedronGeometry]。</p>
<h2>源代码</h2> <h2>源代码</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">创建具有轴对称性的网格,比如花瓶。车削绕着Y轴来进行旋转。</p> <p class="desc">创建具有轴对称性的网格,比如花瓶。车削绕着Y轴来进行旋转。</p>
<iframe id="scene" src="scenes/geometry-browser.html#LatheBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#LatheGeometry"></iframe>
<script> <script>
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
for ( let i = 0; i < 10; i ++ ) { for ( let i = 0; i < 10; i ++ ) {
points.push( new THREE.Vector2( Math.sin( i * 0.2 ) * 10 + 5, ( i - 5 ) * 2 ) ); points.push( new THREE.Vector2( Math.sin( i * 0.2 ) * 10 + 5, ( i - 5 ) * 2 ) );
} }
const geometry = new THREE.LatheBufferGeometry( points ); const geometry = new THREE.LatheGeometry( points );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const lathe = new THREE.Mesh( geometry, material ); const lathe = new THREE.Mesh( geometry, material );
scene.add( lathe ); scene.add( lathe );
......
...@@ -7,12 +7,12 @@ ...@@ -7,12 +7,12 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:PolyhedronBufferGeometry] &rarr; [page:PolyhedronGeometry] &rarr;
<h1>八面缓冲几何体([name])</h1> <h1>八面缓冲几何体([name])</h1>
<p class="desc">一个用于创建八面体的类。</p> <p class="desc">一个用于创建八面体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#OctahedronBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#OctahedronGeometry"></iframe>
<script> <script>
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
</p> </p>
<h2>属性</h2> <h2>属性</h2>
<p>共有属性请参见其基类[page:PolyhedronBufferGeometry]。</p> <p>共有属性请参见其基类[page:PolyhedronGeometry]。</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
</p> </p>
<h2>方法(Methods)</h2> <h2>方法(Methods)</h2>
<p>共有方法请参见其基类[page:PolyhedronBufferGeometry]。</p> <p>共有方法请参见其基类[page:PolyhedronGeometry]。</p>
<h2>源代码</h2> <h2>源代码</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">生成由参数表示其表面的几何体。</p> <p class="desc">生成由参数表示其表面的几何体。</p>
<iframe id="scene" src="scenes/geometry-browser.html#ParametricBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#ParametricGeometry"></iframe>
<script> <script>
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.ParametricBufferGeometry( THREE.ParametricGeometries.klein, 25, 25 ); const geometry = new THREE.ParametricGeometry( THREE.ParametricGeometries.klein, 25, 25 );
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const klein = new THREE.Mesh( geometry, material ); const klein = new THREE.Mesh( geometry, material );
scene.add( klein ); scene.add( klein );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">一个用于生成平面几何体的类。</p> <p class="desc">一个用于生成平面几何体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#PlaneBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#PlaneGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code>const geometry = new THREE.PlaneBufferGeometry( 5, 20, 32 ); <code>const geometry = new THREE.PlaneGeometry( 5, 20, 32 );
const material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} ); const material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} );
const plane = new THREE.Mesh( geometry, material ); const plane = new THREE.Mesh( geometry, material );
scene.add( plane ); scene.add( plane );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc"> <p class="desc">
多面体在三维空间中具有一些平面的立体图形。这个类将一个顶点数组投射到一个球面上,之后将它们细分为所需的细节级别。 多面体在三维空间中具有一些平面的立体图形。这个类将一个顶点数组投射到一个球面上,之后将它们细分为所需的细节级别。
这个类由[page:DodecahedronBufferGeometry]、[page:IcosahedronBufferGeometry]、[page:OctahedronBufferGeometry]和[page:TetrahedronBufferGeometry] 这个类由[page:DodecahedronGeometry]、[page:IcosahedronGeometry]、[page:OctahedronGeometry]和[page:TetrahedronGeometry]
所使用,以生成它们各自的几何结构。 所使用,以生成它们各自的几何结构。
</p> </p>
...@@ -33,7 +33,7 @@ const indicesOfFaces = [ ...@@ -33,7 +33,7 @@ const indicesOfFaces = [
4,5,6, 6,7,4 4,5,6, 6,7,4
]; ];
const geometry = new THREE.PolyhedronBufferGeometry( verticesOfCube, indicesOfFaces, 6, 2 ); const geometry = new THREE.PolyhedronGeometry( verticesOfCube, indicesOfFaces, 6, 2 );
</code> </code>
<h2>构造器</h2> <h2>构造器</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">一个用于生成二维圆环几何体的类。</p> <p class="desc">一个用于生成二维圆环几何体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#RingBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#RingGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code>const geometry = new THREE.RingBufferGeometry( 1, 5, 32 ); <code>const geometry = new THREE.RingGeometry( 1, 5, 32 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } );
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">从一个或多个路径形状中创建一个单面多边形几何体。</p> <p class="desc">从一个或多个路径形状中创建一个单面多边形几何体。</p>
<iframe id="scene" src="scenes/geometry-browser.html#ShapeBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#ShapeGeometry"></iframe>
<script> <script>
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
heartShape.bezierCurveTo( x + 16, y + 7, x + 16, y, x + 10, y ); heartShape.bezierCurveTo( x + 16, y + 7, x + 16, y, x + 10, y );
heartShape.bezierCurveTo( x + 7, y, x + 5, y + 5, x + 5, y + 5 ); heartShape.bezierCurveTo( x + 7, y, x + 5, y + 5, x + 5, y + 5 );
const geometry = new THREE.ShapeBufferGeometry( heartShape ); const geometry = new THREE.ShapeGeometry( heartShape );
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const mesh = new THREE.Mesh( geometry, material ) ; const mesh = new THREE.Mesh( geometry, material ) ;
scene.add( mesh ); scene.add( mesh );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">一个用于生成球体的类。</p> <p class="desc">一个用于生成球体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#SphereBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#SphereGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code>const geometry = new THREE.SphereBufferGeometry( 5, 32, 32 ); <code>const geometry = new THREE.SphereGeometry( 5, 32, 32 );
const material = new THREE.MeshBasicMaterial( {color: 0xffff00} ); const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
const sphere = new THREE.Mesh( geometry, material ); const sphere = new THREE.Mesh( geometry, material );
scene.add( sphere ); scene.add( sphere );
......
...@@ -7,13 +7,13 @@ ...@@ -7,13 +7,13 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:BufferGeometry] &rarr; [page:PolyhedronBufferGeometry] &rarr; [page:BufferGeometry] &rarr; [page:PolyhedronGeometry] &rarr;
<h1>四面缓冲几何体([name])</h1> <h1>四面缓冲几何体([name])</h1>
<p class="desc">一个用于生成四面几何体的类。</p> <p class="desc">一个用于生成四面几何体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#TetrahedronBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TetrahedronGeometry"></iframe>
<script> <script>
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
</p> </p>
<h2>属性</h2> <h2>属性</h2>
<p>共有属性请参见其基类[page:PolyhedronBufferGeometry]。</p> <p>共有属性请参见其基类[page:PolyhedronGeometry]。</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
</p> </p>
<h2>方法(Methods)</h2> <h2>方法(Methods)</h2>
<p>共有方法请参见其基类[page:PolyhedronBufferGeometry]。</p> <p>共有方法请参见其基类[page:PolyhedronGeometry]。</p>
<h2>源代码</h2> <h2>源代码</h2>
......
...@@ -7,17 +7,17 @@ ...@@ -7,17 +7,17 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:BufferGeometry] &rarr; [page:ExtrudeBufferGeometry] &rarr; [page:BufferGeometry] &rarr; [page:ExtrudeGeometry] &rarr;
<h1>文本缓冲几何体([name])</h1> <h1>文本缓冲几何体([name])</h1>
<p class="desc"> <p class="desc">
一个用于将文本生成为单一的几何体的类。 一个用于将文本生成为单一的几何体的类。
它是由一串给定的文本,以及由加载的[page:Font](字体)和该几何体[page:ExtrudeBufferGeometry]父类中的设置所组成的参数来构造的。 它是由一串给定的文本,以及由加载的[page:Font](字体)和该几何体[page:ExtrudeGeometry]父类中的设置所组成的参数来构造的。
请参阅[page:Font]、[page:FontLoader]和[page:Creating_Text]页面来查看更多详细信息。 请参阅[page:Font]、[page:FontLoader]和[page:Creating_Text]页面来查看更多详细信息。
</p> </p>
<iframe id="scene" src="scenes/geometry-browser.html#TextBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TextGeometry"></iframe>
<script> <script>
...@@ -42,7 +42,7 @@ ...@@ -42,7 +42,7 @@
loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) { loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) {
const geometry = new THREE.TextBufferGeometry( 'Hello three.js!', { const geometry = new THREE.TextGeometry( 'Hello three.js!', {
font: font, font: font,
size: 80, size: 80,
height: 5, height: 5,
...@@ -155,7 +155,7 @@ ...@@ -155,7 +155,7 @@
</table> </table>
<h2>属性</h2> <h2>属性</h2>
<p>共有属性请参见其基类[page:ExtrudeBufferGeometry]。</p> <p>共有属性请参见其基类[page:ExtrudeGeometry]。</p>
<h3>[property:Object parameters]</h3> <h3>[property:Object parameters]</h3>
<p> <p>
...@@ -163,7 +163,7 @@ ...@@ -163,7 +163,7 @@
</p> </p>
<h2>方法(Methods)</h2> <h2>方法(Methods)</h2>
<p>共有方法请参见其基类[page:ExtrudeBufferGeometry]。</p> <p>共有方法请参见其基类[page:ExtrudeGeometry]。</p>
<h2>源代码</h2> <h2>源代码</h2>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">一个用于生成圆环几何体的类。</p> <p class="desc">一个用于生成圆环几何体的类。</p>
<iframe id="scene" src="scenes/geometry-browser.html#TorusBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TorusGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code>const geometry = new THREE.TorusBufferGeometry( 10, 3, 16, 100 ); <code>const geometry = new THREE.TorusGeometry( 10, 3, 16, 100 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const torus = new THREE.Mesh( geometry, material ); const torus = new THREE.Mesh( geometry, material );
scene.add( torus ); scene.add( torus );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">创建一个圆环扭结,其特殊形状由一对互质的整数,p和q所定义。如果p和q不互质,创建出来的几何体将是一个环面链接。</p> <p class="desc">创建一个圆环扭结,其特殊形状由一对互质的整数,p和q所定义。如果p和q不互质,创建出来的几何体将是一个环面链接。</p>
<iframe id="scene" src="scenes/geometry-browser.html#TorusKnotBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TorusKnotGeometry"></iframe>
<script> <script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code>const geometry = new THREE.TorusKnotBufferGeometry( 10, 3, 100, 16 ); <code>const geometry = new THREE.TorusKnotGeometry( 10, 3, 100, 16 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const torusKnot = new THREE.Mesh( geometry, material ); const torusKnot = new THREE.Mesh( geometry, material );
scene.add( torusKnot ); scene.add( torusKnot );
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<p class="desc">创建一个沿着三维曲线延伸的管道。</p> <p class="desc">创建一个沿着三维曲线延伸的管道。</p>
<iframe id="scene" src="scenes/geometry-browser.html#TubeBufferGeometry"></iframe> <iframe id="scene" src="scenes/geometry-browser.html#TubeGeometry"></iframe>
<script> <script>
...@@ -57,7 +57,7 @@ ...@@ -57,7 +57,7 @@
} }
const path = new CustomSinCurve( 10 ); const path = new CustomSinCurve( 10 );
const geometry = new THREE.TubeBufferGeometry( path, 20, 2, 8, false ); const geometry = new THREE.TubeGeometry( path, 20, 2, 8, false );
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.SphereBufferGeometry( 100, 100, 100 ); const geometry = new THREE.SphereGeometry( 100, 100, 100 );
const wireframe = new THREE.WireframeGeometry( geometry ); const wireframe = new THREE.WireframeGeometry( geometry );
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const sphere = new THREE.SphereBufferGeometry(); const sphere = new THREE.SphereGeometry();
const object = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( 0xff0000 ) ); const object = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( 0xff0000 ) );
const box = new THREE.BoxHelper( object, 0xffff00 ); const box = new THREE.BoxHelper( object, 0xffff00 );
scene.add( box ); scene.add( box );
......
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
light.shadow.camera.far = 500; // default light.shadow.camera.far = 500; // default
//Create a sphere that cast shadows (but does not receive them) //Create a sphere that cast shadows (but does not receive them)
const sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 ); const sphereGeometry = new THREE.SphereGeometry( 5, 32, 32 );
const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } ); const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial ); const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
sphere.castShadow = true; //default is false sphere.castShadow = true; //default is false
...@@ -45,7 +45,7 @@ ...@@ -45,7 +45,7 @@
scene.add( sphere ); scene.add( sphere );
//Create a plane that receives shadows (but does not cast them) //Create a plane that receives shadows (but does not cast them)
const planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 ); const planeGeometry = new THREE.PlaneGeometry( 20, 20, 32, 32 );
const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } ) const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
const plane = new THREE.Mesh( planeGeometry, planeMaterial ); const plane = new THREE.Mesh( planeGeometry, planeMaterial );
plane.receiveShadow = true; plane.receiveShadow = true;
......
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
light.shadow.camera.far = 500 // default light.shadow.camera.far = 500 // default
//Create a sphere that cast shadows (but does not receive them) //Create a sphere that cast shadows (but does not receive them)
const sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 ); const sphereGeometry = new THREE.SphereGeometry( 5, 32, 32 );
const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } ); const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial ); const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
sphere.castShadow = true; //default is false sphere.castShadow = true; //default is false
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
scene.add( sphere ); scene.add( sphere );
//Create a plane that receives shadows (but does not cast them) //Create a plane that receives shadows (but does not cast them)
const planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 ); const planeGeometry = new THREE.PlaneGeometry( 20, 20, 32, 32 );
const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } ) const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
const plane = new THREE.Mesh( planeGeometry, planeMaterial ); const plane = new THREE.Mesh( planeGeometry, planeMaterial );
plane.receiveShadow = true; plane.receiveShadow = true;
......
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
light.shadow.focus = 1; // default light.shadow.focus = 1; // default
//Create a sphere that cast shadows (but does not receive them) //Create a sphere that cast shadows (but does not receive them)
const sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 ); const sphereGeometry = new THREE.SphereGeometry( 5, 32, 32 );
const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } ); const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial ); const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
sphere.castShadow = true; //default is false sphere.castShadow = true; //default is false
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
scene.add( sphere ); scene.add( sphere );
//Create a plane that receives shadows (but does not cast them) //Create a plane that receives shadows (but does not cast them)
const planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 ); const planeGeometry = new THREE.PlaneGeometry( 20, 20, 32, 32 );
const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } ) const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
const plane = new THREE.Mesh( planeGeometry, planeMaterial ); const plane = new THREE.Mesh( planeGeometry, planeMaterial );
plane.receiveShadow = true; plane.receiveShadow = true;
......
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.PlaneBufferGeometry( 2000, 2000 ); const geometry = new THREE.PlaneGeometry( 2000, 2000 );
geometry.rotateX( - Math.PI / 2 ); geometry.rotateX( - Math.PI / 2 );
const material = new THREE.ShadowMaterial(); const material = new THREE.ShadowMaterial();
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
const box = new THREE.Box3(); const box = new THREE.Box3();
const mesh = new THREE.Mesh( const mesh = new THREE.Mesh(
new THREE.SphereBufferGeometry(), new THREE.SphereGeometry(),
new THREE.MeshBasicMaterial() new THREE.MeshBasicMaterial()
); );
......
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 1, 1, 1 ); const geometry = new THREE.BoxGeometry( 1, 1, 1 );
const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} ); const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
const cubeA = new THREE.Mesh( geometry, material ); const cubeA = new THREE.Mesh( geometry, material );
......
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
//Create spheres with 3 levels of detail and create new LOD levels for them //Create spheres with 3 levels of detail and create new LOD levels for them
for( let i = 0; i < 3; i++ ) { for( let i = 0; i < 3; i++ ) {
const geometry = new THREE.IcosahedronBufferGeometry( 10, 3 - i ) const geometry = new THREE.IcosahedronGeometry( 10, 3 - i )
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
......
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 1, 1, 1 ); const geometry = new THREE.BoxGeometry( 1, 1, 1 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh ); scene.add( mesh );
......
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.CylinderBufferGeometry( 5, 5, 5, 5, 15, 5, 30 ); const geometry = new THREE.CylinderGeometry( 5, 5, 5, 5, 15, 5, 30 );
// create the skin indices and skin weights // create the skin indices and skin weights
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="page.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:BufferGeometry] &rarr;
<h1>[name]</h1>
<p class="desc">[name] can be used to generate a convex hull for a given array of 3D points.
The average time complexity for this task is considered to be O(nlog(n)).</p>
<h2>Code Example</h2>
<code>const geometry = new ConvexBufferGeometry( points );
const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
</code>
<h2>Examples</h2>
<p>[example:webgl_geometry_convex geometry / convex ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Array points] )</h3>
<p>
points — Array of [page:Vector3 Vector3s] that the resulting convex hull will contain.
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/geometries/ConvexGeometry.js examples/jsm/geometries/ConvexGeometry.js]
</p>
</body>
</html>
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:Geometry] &rarr; [page:BufferGeometry] &rarr;
<h1>[name]</h1> <h1>[name]</h1>
......
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 10, 10, 10, 2, 2, 2 ); const geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
const material = new THREE.MeshBasicMaterial( { color: 0xff0000 } ); const material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
const box = new THREE.Mesh( geometry, material ); const box = new THREE.Mesh( geometry, material );
......
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
<h2>Code Example</h2> <h2>Code Example</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 10, 10, 10, 2, 2, 2 ); const geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
const material = new THREE.MeshNormalMaterial(); const material = new THREE.MeshNormalMaterial();
const box = new THREE.Mesh( geometry, material ); const box = new THREE.Mesh( geometry, material );
......
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
for ( let j = 0; j < shapes.length; j ++ ) { for ( let j = 0; j < shapes.length; j ++ ) {
const shape = shapes[ j ]; const shape = shapes[ j ];
const geometry = new THREE.ShapeBufferGeometry( shape ); const geometry = new THREE.ShapeGeometry( shape );
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
group.add( mesh ); group.add( mesh );
......
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="page.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:BufferGeometry] &rarr;
<h1>凸包缓冲几何体([name])</h1>
<p class="desc">[name] 可被用于为传入的一组点生成凸包。
该任务的平均时间复杂度被认为是O(nlog(n))。</p>
<h2>代码示例</h2>
<code>const geometry = new ConvexBufferGeometry( points );
const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
</code>
<h2>例子</h2>
<p>[example:webgl_geometry_convex geometry / convex ]</p>
<h2>Constructor</h2>
<h3>[name]( [param:Array points] )</h3>
<p>
points — 所得凸包中将包含的一组[page:Vector3 Vector3]。
</p>
<h2>源代码</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/geometries/ConvexGeometry.js examples/jsm/geometries/ConvexGeometry.js]
</p>
</body>
</html>
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<link type="text/css" rel="stylesheet" href="page.css" /> <link type="text/css" rel="stylesheet" href="page.css" />
</head> </head>
<body> <body>
[page:Geometry] &rarr; [page:BufferGeometry] &rarr;
<h1>凸包几何体([name])</h1> <h1>凸包几何体([name])</h1>
......
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 10, 10, 10, 2, 2, 2 ); const geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
const material = new THREE.MeshBasicMaterial( { color: 0xff0000 } ); const material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
const box = new THREE.Mesh( geometry, material ); const box = new THREE.Mesh( geometry, material );
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
<h2>代码示例</h2> <h2>代码示例</h2>
<code> <code>
const geometry = new THREE.BoxBufferGeometry( 10, 10, 10, 2, 2, 2 ); const geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
const material = new THREE.MeshNormalMaterial(); const material = new THREE.MeshNormalMaterial();
const box = new THREE.Mesh( geometry, material ); const box = new THREE.Mesh( geometry, material );
......
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
for ( let j = 0; j < shapes.length; j ++ ) { for ( let j = 0; j < shapes.length; j ++ ) {
const shape = shapes[ j ]; const shape = shapes[ j ];
const geometry = new THREE.ShapeBufferGeometry( shape ); const geometry = new THREE.ShapeGeometry( shape );
const mesh = new THREE.Mesh( geometry, material ); const mesh = new THREE.Mesh( geometry, material );
group.add( mesh ); group.add( mesh );
......
...@@ -142,27 +142,27 @@ ...@@ -142,27 +142,27 @@
}, },
"Geometries": { "Geometries": {
"BoxBufferGeometry": "api/en/geometries/BoxBufferGeometry", "BoxGeometry": "api/en/geometries/BoxGeometry",
"CircleBufferGeometry": "api/en/geometries/CircleBufferGeometry", "CircleGeometry": "api/en/geometries/CircleGeometry",
"ConeBufferGeometry": "api/en/geometries/ConeBufferGeometry", "ConeGeometry": "api/en/geometries/ConeGeometry",
"CylinderBufferGeometry": "api/en/geometries/CylinderBufferGeometry", "CylinderGeometry": "api/en/geometries/CylinderGeometry",
"DodecahedronBufferGeometry": "api/en/geometries/DodecahedronBufferGeometry", "DodecahedronGeometry": "api/en/geometries/DodecahedronGeometry",
"EdgesGeometry": "api/en/geometries/EdgesGeometry", "EdgesGeometry": "api/en/geometries/EdgesGeometry",
"ExtrudeBufferGeometry": "api/en/geometries/ExtrudeBufferGeometry", "ExtrudeGeometry": "api/en/geometries/ExtrudeGeometry",
"IcosahedronBufferGeometry": "api/en/geometries/IcosahedronBufferGeometry", "IcosahedronGeometry": "api/en/geometries/IcosahedronGeometry",
"LatheBufferGeometry": "api/en/geometries/LatheBufferGeometry", "LatheGeometry": "api/en/geometries/LatheGeometry",
"OctahedronBufferGeometry": "api/en/geometries/OctahedronBufferGeometry", "OctahedronGeometry": "api/en/geometries/OctahedronGeometry",
"ParametricBufferGeometry": "api/en/geometries/ParametricBufferGeometry", "ParametricGeometry": "api/en/geometries/ParametricGeometry",
"PlaneBufferGeometry": "api/en/geometries/PlaneBufferGeometry", "PlaneGeometry": "api/en/geometries/PlaneGeometry",
"PolyhedronBufferGeometry": "api/en/geometries/PolyhedronBufferGeometry", "PolyhedronGeometry": "api/en/geometries/PolyhedronGeometry",
"RingBufferGeometry": "api/en/geometries/RingBufferGeometry", "RingGeometry": "api/en/geometries/RingGeometry",
"ShapeBufferGeometry": "api/en/geometries/ShapeBufferGeometry", "ShapeGeometry": "api/en/geometries/ShapeGeometry",
"SphereBufferGeometry": "api/en/geometries/SphereBufferGeometry", "SphereGeometry": "api/en/geometries/SphereGeometry",
"TetrahedronBufferGeometry": "api/en/geometries/TetrahedronBufferGeometry", "TetrahedronGeometry": "api/en/geometries/TetrahedronGeometry",
"TextBufferGeometry": "api/en/geometries/TextBufferGeometry", "TextGeometry": "api/en/geometries/TextGeometry",
"TorusBufferGeometry": "api/en/geometries/TorusBufferGeometry", "TorusGeometry": "api/en/geometries/TorusGeometry",
"TorusKnotBufferGeometry": "api/en/geometries/TorusKnotBufferGeometry", "TorusKnotGeometry": "api/en/geometries/TorusKnotGeometry",
"TubeBufferGeometry": "api/en/geometries/TubeBufferGeometry", "TubeGeometry": "api/en/geometries/TubeGeometry",
"WireframeGeometry": "api/en/geometries/WireframeGeometry" "WireframeGeometry": "api/en/geometries/WireframeGeometry"
}, },
...@@ -352,7 +352,6 @@ ...@@ -352,7 +352,6 @@
}, },
"Geometries": { "Geometries": {
"ConvexBufferGeometry": "examples/en/geometries/ConvexBufferGeometry",
"ConvexGeometry": "examples/en/geometries/ConvexGeometry", "ConvexGeometry": "examples/en/geometries/ConvexGeometry",
"DecalGeometry": "examples/en/geometries/DecalGeometry" "DecalGeometry": "examples/en/geometries/DecalGeometry"
}, },
...@@ -656,27 +655,27 @@ ...@@ -656,27 +655,27 @@
}, },
"几何体": { "几何体": {
"BoxBufferGeometry": "api/zh/geometries/BoxBufferGeometry", "BoxGeometry": "api/zh/geometries/BoxGeometry",
"CircleBufferGeometry": "api/zh/geometries/CircleBufferGeometry", "CircleGeometry": "api/zh/geometries/CircleGeometry",
"ConeBufferGeometry": "api/zh/geometries/ConeBufferGeometry", "ConeGeometry": "api/zh/geometries/ConeGeometry",
"CylinderBufferGeometry": "api/zh/geometries/CylinderBufferGeometry", "CylinderGeometry": "api/zh/geometries/CylinderGeometry",
"DodecahedronBufferGeometry": "api/zh/geometries/DodecahedronBufferGeometry", "DodecahedronGeometry": "api/zh/geometries/DodecahedronGeometry",
"EdgesGeometry": "api/zh/geometries/EdgesGeometry", "EdgesGeometry": "api/zh/geometries/EdgesGeometry",
"ExtrudeBufferGeometry": "api/zh/geometries/ExtrudeBufferGeometry", "ExtrudeGeometry": "api/zh/geometries/ExtrudeGeometry",
"IcosahedronBufferGeometry": "api/zh/geometries/IcosahedronBufferGeometry", "IcosahedronGeometry": "api/zh/geometries/IcosahedronGeometry",
"LatheBufferGeometry": "api/zh/geometries/LatheBufferGeometry", "LatheGeometry": "api/zh/geometries/LatheGeometry",
"OctahedronBufferGeometry": "api/zh/geometries/OctahedronBufferGeometry", "OctahedronGeometry": "api/zh/geometries/OctahedronGeometry",
"ParametricBufferGeometry": "api/zh/geometries/ParametricBufferGeometry", "ParametricGeometry": "api/zh/geometries/ParametricGeometry",
"PlaneBufferGeometry": "api/zh/geometries/PlaneBufferGeometry", "PlaneGeometry": "api/zh/geometries/PlaneGeometry",
"PolyhedronBufferGeometry": "api/zh/geometries/PolyhedronBufferGeometry", "PolyhedronGeometry": "api/zh/geometries/PolyhedronGeometry",
"RingBufferGeometry": "api/zh/geometries/RingBufferGeometry", "RingGeometry": "api/zh/geometries/RingGeometry",
"ShapeBufferGeometry": "api/zh/geometries/ShapeBufferGeometry", "ShapeGeometry": "api/zh/geometries/ShapeGeometry",
"SphereBufferGeometry": "api/zh/geometries/SphereBufferGeometry", "SphereGeometry": "api/zh/geometries/SphereGeometry",
"TetrahedronBufferGeometry": "api/zh/geometries/TetrahedronBufferGeometry", "TetrahedronGeometry": "api/zh/geometries/TetrahedronGeometry",
"TextBufferGeometry": "api/zh/geometries/TextBufferGeometry", "TextGeometry": "api/zh/geometries/TextGeometry",
"TorusBufferGeometry": "api/zh/geometries/TorusBufferGeometry", "TorusGeometry": "api/zh/geometries/TorusGeometry",
"TorusKnotBufferGeometry": "api/zh/geometries/TorusKnotBufferGeometry", "TorusKnotGeometry": "api/zh/geometries/TorusKnotGeometry",
"TubeBufferGeometry": "api/zh/geometries/TubeBufferGeometry", "TubeGeometry": "api/zh/geometries/TubeGeometry",
"WireframeGeometry": "api/zh/geometries/WireframeGeometry" "WireframeGeometry": "api/zh/geometries/WireframeGeometry"
}, },
...@@ -866,7 +865,6 @@ ...@@ -866,7 +865,6 @@
}, },
"几何体": { "几何体": {
"ConvexBufferGeometry": "examples/zh/geometries/ConvexBufferGeometry",
"ConvexGeometry": "examples/zh/geometries/ConvexGeometry", "ConvexGeometry": "examples/zh/geometries/ConvexGeometry",
"DecalGeometry": "examples/zh/geometries/DecalGeometry" "DecalGeometry": "examples/zh/geometries/DecalGeometry"
}, },
......
...@@ -121,7 +121,7 @@ ...@@ -121,7 +121,7 @@
</p> </p>
<code> <code>
const geometry = new THREE.BoxBufferGeometry(); const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
...@@ -130,7 +130,7 @@ ...@@ -130,7 +130,7 @@
</code> </code>
<p> <p>
لكي نقوم بإنشاء مكعب، نحتاج مكون <strong>BoxBufferGeometry</strong>. هذا الأخير مسؤول عن حفض أماكن كل النقاط لكي نقوم بإنشاء مكعب، نحتاج مكون <strong>BoxGeometry</strong>. هذا الأخير مسؤول عن حفض أماكن كل النقاط
(<strong>vertices</strong>) و تعبئة كل الأوجه (<strong>vertices</strong>) و تعبئة كل الأوجه
(<strong>faces</strong>) المكونة للمكعب. سنقوم بالتعمق في هذا الموضوع مستقبلا. (<strong>faces</strong>) المكونة للمكعب. سنقوم بالتعمق في هذا الموضوع مستقبلا.
</p> </p>
...@@ -218,7 +218,7 @@ ...@@ -218,7 +218,7 @@
</p> </p>
<p> <p>
الشفرة البرمجية الكاملة في الأسفل إلى جانب محرر مباشر [link:https://jsfiddle.net/zpcswh8m/ live example]. الشفرة البرمجية الكاملة في الأسفل إلى جانب محرر مباشر [link:https://jsfiddle.net/fxurzeb4/ live example].
أنت أنت
مدعو للعب بالأوامر البرمجية لكي تصبح صورة كيفية عملها أوضح من قبل. مدعو للعب بالأوامر البرمجية لكي تصبح صورة كيفية عملها أوضح من قبل.
</p> </p>
...@@ -241,7 +241,7 @@ ...@@ -241,7 +241,7 @@
renderer.setSize( window.innerWidth, window.innerHeight ); renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement ); document.body.appendChild( renderer.domElement );
const geometry = new THREE.BoxBufferGeometry(); const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
......
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
<p><em>"That's all good, but where's that cube you promised?"</em> Let's add it now.</p> <p><em>"That's all good, but where's that cube you promised?"</em> Let's add it now.</p>
<code> <code>
const geometry = new THREE.BoxBufferGeometry(); const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
camera.position.z = 5; camera.position.z = 5;
</code> </code>
<p>To create a cube, we need a <strong>BoxBufferGeometry</strong>. This is an object that contains all the points (<strong>vertices</strong>) and fill (<strong>faces</strong>) of the cube. We'll explore this more in the future.</p> <p>To create a cube, we need a <strong>BoxGeometry</strong>. This is an object that contains all the points (<strong>vertices</strong>) and fill (<strong>faces</strong>) of the cube. We'll explore this more in the future.</p>
<p>In addition to the geometry, we need a material to color it. Three.js comes with several materials, but we'll stick to the <strong>MeshBasicMaterial</strong> for now. All materials take an object of properties which will be applied to them. To keep things very simple, we only supply a color attribute of <strong>0x00ff00</strong>, which is green. This works the same way that colors work in CSS or Photoshop (<strong>hex colors</strong>).</p> <p>In addition to the geometry, we need a material to color it. Three.js comes with several materials, but we'll stick to the <strong>MeshBasicMaterial</strong> for now. All materials take an object of properties which will be applied to them. To keep things very simple, we only supply a color attribute of <strong>0x00ff00</strong>, which is green. This works the same way that colors work in CSS or Photoshop (<strong>hex colors</strong>).</p>
...@@ -116,7 +116,7 @@ ...@@ -116,7 +116,7 @@
<h2>The result</h2> <h2>The result</h2>
<p>Congratulations! You have now completed your first three.js application. It's simple, you have to start somewhere.</p> <p>Congratulations! You have now completed your first three.js application. It's simple, you have to start somewhere.</p>
<p>The full code is available below and as an editable [link:https://jsfiddle.net/zpcswh8m/ live example]. Play around with it to get a better understanding of how it works.</p> <p>The full code is available below and as an editable [link:https://jsfiddle.net/fxurzeb4/ live example]. Play around with it to get a better understanding of how it works.</p>
<code> <code>
&lt;!DOCTYPE html&gt; &lt;!DOCTYPE html&gt;
...@@ -137,7 +137,7 @@ ...@@ -137,7 +137,7 @@
renderer.setSize( window.innerWidth, window.innerHeight ); renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement ); document.body.appendChild( renderer.domElement );
const geometry = new THREE.BoxBufferGeometry(); const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
......
...@@ -71,7 +71,7 @@ ...@@ -71,7 +71,7 @@
<p><em>"그건 그렇고, 아까 말했던 큐브는 어디에 있죠?"</em> 바로 추가해 봅시다.</p> <p><em>"그건 그렇고, 아까 말했던 큐브는 어디에 있죠?"</em> 바로 추가해 봅시다.</p>
<code> <code>
const geometry = new THREE.BoxBufferGeometry(); const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
...@@ -79,7 +79,7 @@ ...@@ -79,7 +79,7 @@
camera.position.z = 5; camera.position.z = 5;
</code> </code>
<p>큐브를 만드려면, <strong>BoxBufferGeometry</strong>가 필요합니다. 여기에는 큐브에 필요한 모든 꼭짓점 (<strong>vertices</strong>) 와 면(<strong>faces</strong>)이 포함돼 있습니다. 여기에 대해서는 나중에 더 자세히 알아봅시다.</p> <p>큐브를 만드려면, <strong>BoxGeometry</strong>가 필요합니다. 여기에는 큐브에 필요한 모든 꼭짓점 (<strong>vertices</strong>) 와 면(<strong>faces</strong>)이 포함돼 있습니다. 여기에 대해서는 나중에 더 자세히 알아봅시다.</p>
<p>geometry와 더불어, 무언가를 색칠해줄 요소가 필요합니다. Three.js에서는 여러 방법을 고려했지만, 현재로서는<strong>MeshBasicMaterial</strong>을 고수하고자 합니다. 이 속성이 적용된 오브젝트들은 모두 영향을 받을 것입니다. 가장 단순하게 알아볼 수 있도록, 여기에서는 녹색인 <strong>0x00ff00</strong>만을 속성으로 사용하겠습니다. CSS 나 Photoshop에서처럼 (<strong>hex colors</strong>)로 동일하게 작동합니다.</p> <p>geometry와 더불어, 무언가를 색칠해줄 요소가 필요합니다. Three.js에서는 여러 방법을 고려했지만, 현재로서는<strong>MeshBasicMaterial</strong>을 고수하고자 합니다. 이 속성이 적용된 오브젝트들은 모두 영향을 받을 것입니다. 가장 단순하게 알아볼 수 있도록, 여기에서는 녹색인 <strong>0x00ff00</strong>만을 속성으로 사용하겠습니다. CSS 나 Photoshop에서처럼 (<strong>hex colors</strong>)로 동일하게 작동합니다.</p>
...@@ -117,7 +117,7 @@ ...@@ -117,7 +117,7 @@
<h2>결과 화면</h2> <h2>결과 화면</h2>
<p>축하합니다! 첫 three.js이 완성되었네요. 이제 본격적으로 시작해보면 됩니다.</p> <p>축하합니다! 첫 three.js이 완성되었네요. 이제 본격적으로 시작해보면 됩니다.</p>
<p>전체 코드는 아래에 나와 있고 [link:https://jsfiddle.net/zpcswh8m/ live example]로도 확인해볼 수 있습니다. 잘 살펴보고 어떻게 구동되는지 확인해 보세요.</p> <p>전체 코드는 아래에 나와 있고 [link:https://jsfiddle.net/fxurzeb4/ live example]로도 확인해볼 수 있습니다. 잘 살펴보고 어떻게 구동되는지 확인해 보세요.</p>
<code> <code>
&lt;!DOCTYPE html&gt; &lt;!DOCTYPE html&gt;
...@@ -139,7 +139,7 @@ ...@@ -139,7 +139,7 @@
renderer.setSize( window.innerWidth, window.innerHeight ); renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement ); document.body.appendChild( renderer.domElement );
const geometry = new THREE.BoxBufferGeometry(); const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
......
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
<p><em>“嗯,看起来很不错,那你说的那个立方体在哪儿?”</em>接下来,我们就来添加立方体。</p> <p><em>“嗯,看起来很不错,那你说的那个立方体在哪儿?”</em>接下来,我们就来添加立方体。</p>
<code> <code>
const geometry = new THREE.BoxBufferGeometry(); const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
camera.position.z = 5; camera.position.z = 5;
</code> </code>
<p>要创建一个立方体,我们需要一个<strong>BoxBufferGeometry</strong>(立方体)对象. 这个对象包含了一个立方体中所有的顶点(<strong>vertices</strong>)和面(<strong>faces</strong>)。未来我们将在这方面进行更多的探索。</p> <p>要创建一个立方体,我们需要一个<strong>BoxGeometry</strong>(立方体)对象. 这个对象包含了一个立方体中所有的顶点(<strong>vertices</strong>)和面(<strong>faces</strong>)。未来我们将在这方面进行更多的探索。</p>
<p>接下来,对于这个立方体,我们需要给它一个材质,来让它有颜色。Three.js自带了几种材质,在这里我们使用的是<strong>MeshBasicMaterial</strong>。所有的材质都存有应用于他们的属性的对象。在这里为了简单起见,我们只设置一个color属性,值为<strong>0x00ff00</strong>,也就是绿色。这里所做的事情,和在CSS或者Photoshop中使用十六进制(<strong>hex colors</strong>)颜色格式来设置颜色的方式一致。</p> <p>接下来,对于这个立方体,我们需要给它一个材质,来让它有颜色。Three.js自带了几种材质,在这里我们使用的是<strong>MeshBasicMaterial</strong>。所有的材质都存有应用于他们的属性的对象。在这里为了简单起见,我们只设置一个color属性,值为<strong>0x00ff00</strong>,也就是绿色。这里所做的事情,和在CSS或者Photoshop中使用十六进制(<strong>hex colors</strong>)颜色格式来设置颜色的方式一致。</p>
...@@ -117,7 +117,7 @@ ...@@ -117,7 +117,7 @@
<h2>结果</h2> <h2>结果</h2>
<p>祝贺你!你现在已经成功完成了你的第一个Three.js应用程序。虽然它很简单,但现在你已经有了一个入门的起点。</p> <p>祝贺你!你现在已经成功完成了你的第一个Three.js应用程序。虽然它很简单,但现在你已经有了一个入门的起点。</p>
<p>下面是完整的代码,可在[link:https://jsfiddle.net/zpcswh8m/ live example]运行、编辑;运行或者修改代码有助于你更好的理解它是如何工作的。</p> <p>下面是完整的代码,可在[link:https://jsfiddle.net/fxurzeb4/ live example]运行、编辑;运行或者修改代码有助于你更好的理解它是如何工作的。</p>
<code> <code>
&lt;html&gt; &lt;html&gt;
...@@ -137,7 +137,7 @@ ...@@ -137,7 +137,7 @@
renderer.setSize( window.innerWidth, window.innerHeight ); renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement ); document.body.appendChild( renderer.domElement );
const geometry = new THREE.BoxBufferGeometry(); const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material ); const cube = new THREE.Mesh( geometry, material );
scene.add( cube ); scene.add( cube );
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
import { import {
Bone, Bone,
Color, Color,
CylinderBufferGeometry, CylinderGeometry,
DoubleSide, DoubleSide,
Float32BufferAttribute, Float32BufferAttribute,
MeshPhongMaterial, MeshPhongMaterial,
...@@ -101,7 +101,7 @@ ...@@ -101,7 +101,7 @@
function createGeometry( sizing ) { function createGeometry( sizing ) {
const geometry = new CylinderBufferGeometry( const geometry = new CylinderGeometry(
5, // radiusTop 5, // radiusTop
5, // radiusBottom 5, // radiusBottom
sizing.height, // height sizing.height, // height
......
...@@ -27,40 +27,40 @@ ...@@ -27,40 +27,40 @@
<script type="module"> <script type="module">
import { import {
BoxBufferGeometry, BoxGeometry,
BufferGeometry, BufferGeometry,
CircleBufferGeometry, CircleGeometry,
Color, Color,
ConeBufferGeometry, ConeGeometry,
Curve, Curve,
CylinderBufferGeometry, CylinderGeometry,
DodecahedronBufferGeometry, DodecahedronGeometry,
DoubleSide, DoubleSide,
ExtrudeBufferGeometry, ExtrudeGeometry,
Float32BufferAttribute, Float32BufferAttribute,
FontLoader, FontLoader,
Group, Group,
IcosahedronBufferGeometry, IcosahedronGeometry,
LatheBufferGeometry, LatheGeometry,
LineSegments, LineSegments,
LineBasicMaterial, LineBasicMaterial,
Mesh, Mesh,
MeshPhongMaterial, MeshPhongMaterial,
OctahedronBufferGeometry, OctahedronGeometry,
ParametricBufferGeometry, ParametricGeometry,
PerspectiveCamera, PerspectiveCamera,
PlaneBufferGeometry, PlaneGeometry,
PointLight, PointLight,
RingBufferGeometry, RingGeometry,
Scene, Scene,
Shape, Shape,
ShapeBufferGeometry, ShapeGeometry,
SphereBufferGeometry, SphereGeometry,
TetrahedronBufferGeometry, TetrahedronGeometry,
TextBufferGeometry, TextGeometry,
TorusBufferGeometry, TorusGeometry,
TorusKnotBufferGeometry, TorusKnotGeometry,
TubeBufferGeometry, TubeGeometry,
Vector2, Vector2,
Vector3, Vector3,
WireframeGeometry, WireframeGeometry,
...@@ -123,7 +123,7 @@ ...@@ -123,7 +123,7 @@
const guis = { const guis = {
BoxBufferGeometry: function ( mesh ) { BoxGeometry: function ( mesh ) {
const data = { const data = {
width: 15, width: 15,
...@@ -137,14 +137,14 @@ ...@@ -137,14 +137,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new BoxBufferGeometry( new BoxGeometry(
data.width, data.height, data.depth, data.widthSegments, data.heightSegments, data.depthSegments data.width, data.height, data.depth, data.widthSegments, data.heightSegments, data.depthSegments
) )
); );
} }
const folder = gui.addFolder( 'THREE.BoxBufferGeometry' ); const folder = gui.addFolder( 'THREE.BoxGeometry' );
folder.add( data, 'width', 1, 30 ).onChange( generateGeometry ); folder.add( data, 'width', 1, 30 ).onChange( generateGeometry );
folder.add( data, 'height', 1, 30 ).onChange( generateGeometry ); folder.add( data, 'height', 1, 30 ).onChange( generateGeometry );
...@@ -157,7 +157,7 @@ ...@@ -157,7 +157,7 @@
}, },
CylinderBufferGeometry: function ( mesh ) { CylinderGeometry: function ( mesh ) {
const data = { const data = {
radiusTop: 5, radiusTop: 5,
...@@ -173,7 +173,7 @@ ...@@ -173,7 +173,7 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new CylinderBufferGeometry( new CylinderGeometry(
data.radiusTop, data.radiusTop,
data.radiusBottom, data.radiusBottom,
data.height, data.height,
...@@ -187,7 +187,7 @@ ...@@ -187,7 +187,7 @@
} }
const folder = gui.addFolder( 'THREE.CylinderBufferGeometry' ); const folder = gui.addFolder( 'THREE.CylinderGeometry' );
folder.add( data, 'radiusTop', 0, 30 ).onChange( generateGeometry ); folder.add( data, 'radiusTop', 0, 30 ).onChange( generateGeometry );
folder.add( data, 'radiusBottom', 0, 30 ).onChange( generateGeometry ); folder.add( data, 'radiusBottom', 0, 30 ).onChange( generateGeometry );
...@@ -203,7 +203,7 @@ ...@@ -203,7 +203,7 @@
}, },
ConeBufferGeometry: function ( mesh ) { ConeGeometry: function ( mesh ) {
const data = { const data = {
radius: 5, radius: 5,
...@@ -218,7 +218,7 @@ ...@@ -218,7 +218,7 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new ConeBufferGeometry( new ConeGeometry(
data.radius, data.radius,
data.height, data.height,
data.radialSegments, data.radialSegments,
...@@ -231,7 +231,7 @@ ...@@ -231,7 +231,7 @@
} }
const folder = gui.addFolder( 'THREE.ConeBufferGeometry' ); const folder = gui.addFolder( 'THREE.ConeGeometry' );
folder.add( data, 'radius', 0, 30 ).onChange( generateGeometry ); folder.add( data, 'radius', 0, 30 ).onChange( generateGeometry );
folder.add( data, 'height', 1, 50 ).onChange( generateGeometry ); folder.add( data, 'height', 1, 50 ).onChange( generateGeometry );
...@@ -246,7 +246,7 @@ ...@@ -246,7 +246,7 @@
}, },
CircleBufferGeometry: function ( mesh ) { CircleGeometry: function ( mesh ) {
const data = { const data = {
radius: 10, radius: 10,
...@@ -258,14 +258,14 @@ ...@@ -258,14 +258,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new CircleBufferGeometry( new CircleGeometry(
data.radius, data.segments, data.thetaStart, data.thetaLength data.radius, data.segments, data.thetaStart, data.thetaLength
) )
); );
} }
const folder = gui.addFolder( 'THREE.CircleBufferGeometry' ); const folder = gui.addFolder( 'THREE.CircleGeometry' );
folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry ); folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry );
folder.add( data, 'segments', 0, 128 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'segments', 0, 128 ).step( 1 ).onChange( generateGeometry );
...@@ -276,7 +276,7 @@ ...@@ -276,7 +276,7 @@
}, },
DodecahedronBufferGeometry: function ( mesh ) { DodecahedronGeometry: function ( mesh ) {
const data = { const data = {
radius: 10, radius: 10,
...@@ -286,14 +286,14 @@ ...@@ -286,14 +286,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new DodecahedronBufferGeometry( new DodecahedronGeometry(
data.radius, data.detail data.radius, data.detail
) )
); );
} }
const folder = gui.addFolder( 'THREE.DodecahedronBufferGeometry' ); const folder = gui.addFolder( 'THREE.DodecahedronGeometry' );
folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry ); folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry );
folder.add( data, 'detail', 0, 5 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'detail', 0, 5 ).step( 1 ).onChange( generateGeometry );
...@@ -302,7 +302,7 @@ ...@@ -302,7 +302,7 @@
}, },
IcosahedronBufferGeometry: function ( mesh ) { IcosahedronGeometry: function ( mesh ) {
const data = { const data = {
radius: 10, radius: 10,
...@@ -312,14 +312,14 @@ ...@@ -312,14 +312,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new IcosahedronBufferGeometry( new IcosahedronGeometry(
data.radius, data.detail data.radius, data.detail
) )
); );
} }
const folder = gui.addFolder( 'THREE.IcosahedronBufferGeometry' ); const folder = gui.addFolder( 'THREE.IcosahedronGeometry' );
folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry ); folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry );
folder.add( data, 'detail', 0, 5 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'detail', 0, 5 ).step( 1 ).onChange( generateGeometry );
...@@ -328,7 +328,7 @@ ...@@ -328,7 +328,7 @@
}, },
LatheBufferGeometry: function ( mesh ) { LatheGeometry: function ( mesh ) {
const points = []; const points = [];
...@@ -346,7 +346,7 @@ ...@@ -346,7 +346,7 @@
function generateGeometry() { function generateGeometry() {
const geometry = new LatheBufferGeometry( const geometry = new LatheGeometry(
points, data.segments, data.phiStart, data.phiLength points, data.segments, data.phiStart, data.phiLength
); );
...@@ -354,7 +354,7 @@ ...@@ -354,7 +354,7 @@
} }
const folder = gui.addFolder( 'THREE.LatheBufferGeometry' ); const folder = gui.addFolder( 'THREE.LatheGeometry' );
folder.add( data, 'segments', 1, 30 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'segments', 1, 30 ).step( 1 ).onChange( generateGeometry );
folder.add( data, 'phiStart', 0, twoPi ).onChange( generateGeometry ); folder.add( data, 'phiStart', 0, twoPi ).onChange( generateGeometry );
...@@ -364,7 +364,7 @@ ...@@ -364,7 +364,7 @@
}, },
OctahedronBufferGeometry: function ( mesh ) { OctahedronGeometry: function ( mesh ) {
const data = { const data = {
radius: 10, radius: 10,
...@@ -374,14 +374,14 @@ ...@@ -374,14 +374,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new OctahedronBufferGeometry( new OctahedronGeometry(
data.radius, data.detail data.radius, data.detail
) )
); );
} }
const folder = gui.addFolder( 'THREE.OctahedronBufferGeometry' ); const folder = gui.addFolder( 'THREE.OctahedronGeometry' );
folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry ); folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry );
folder.add( data, 'detail', 0, 5 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'detail', 0, 5 ).step( 1 ).onChange( generateGeometry );
...@@ -390,7 +390,7 @@ ...@@ -390,7 +390,7 @@
}, },
PlaneBufferGeometry: function ( mesh ) { PlaneGeometry: function ( mesh ) {
const data = { const data = {
width: 10, width: 10,
...@@ -402,14 +402,14 @@ ...@@ -402,14 +402,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new PlaneBufferGeometry( new PlaneGeometry(
data.width, data.height, data.widthSegments, data.heightSegments data.width, data.height, data.widthSegments, data.heightSegments
) )
); );
} }
const folder = gui.addFolder( 'THREE.PlaneBufferGeometry' ); const folder = gui.addFolder( 'THREE.PlaneGeometry' );
folder.add( data, 'width', 1, 30 ).onChange( generateGeometry ); folder.add( data, 'width', 1, 30 ).onChange( generateGeometry );
folder.add( data, 'height', 1, 30 ).onChange( generateGeometry ); folder.add( data, 'height', 1, 30 ).onChange( generateGeometry );
...@@ -420,7 +420,7 @@ ...@@ -420,7 +420,7 @@
}, },
RingBufferGeometry: function ( mesh ) { RingGeometry: function ( mesh ) {
const data = { const data = {
innerRadius: 5, innerRadius: 5,
...@@ -434,14 +434,14 @@ ...@@ -434,14 +434,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new RingBufferGeometry( new RingGeometry(
data.innerRadius, data.outerRadius, data.thetaSegments, data.phiSegments, data.thetaStart, data.thetaLength data.innerRadius, data.outerRadius, data.thetaSegments, data.phiSegments, data.thetaStart, data.thetaLength
) )
); );
} }
const folder = gui.addFolder( 'THREE.RingBufferGeometry' ); const folder = gui.addFolder( 'THREE.RingGeometry' );
folder.add( data, 'innerRadius', 1, 30 ).onChange( generateGeometry ); folder.add( data, 'innerRadius', 1, 30 ).onChange( generateGeometry );
folder.add( data, 'outerRadius', 1, 30 ).onChange( generateGeometry ); folder.add( data, 'outerRadius', 1, 30 ).onChange( generateGeometry );
...@@ -454,7 +454,7 @@ ...@@ -454,7 +454,7 @@
}, },
SphereBufferGeometry: function ( mesh ) { SphereGeometry: function ( mesh ) {
const data = { const data = {
radius: 15, radius: 15,
...@@ -469,14 +469,14 @@ ...@@ -469,14 +469,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new SphereBufferGeometry( new SphereGeometry(
data.radius, data.widthSegments, data.heightSegments, data.phiStart, data.phiLength, data.thetaStart, data.thetaLength data.radius, data.widthSegments, data.heightSegments, data.phiStart, data.phiLength, data.thetaStart, data.thetaLength
) )
); );
} }
const folder = gui.addFolder( 'THREE.SphereBufferGeometry' ); const folder = gui.addFolder( 'THREE.SphereGeometry' );
folder.add( data, 'radius', 1, 30 ).onChange( generateGeometry ); folder.add( data, 'radius', 1, 30 ).onChange( generateGeometry );
folder.add( data, 'widthSegments', 3, 32 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'widthSegments', 3, 32 ).step( 1 ).onChange( generateGeometry );
...@@ -490,7 +490,7 @@ ...@@ -490,7 +490,7 @@
}, },
TetrahedronBufferGeometry: function ( mesh ) { TetrahedronGeometry: function ( mesh ) {
const data = { const data = {
radius: 10, radius: 10,
...@@ -500,14 +500,14 @@ ...@@ -500,14 +500,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new TetrahedronBufferGeometry( new TetrahedronGeometry(
data.radius, data.detail data.radius, data.detail
) )
); );
} }
const folder = gui.addFolder( 'THREE.TetrahedronBufferGeometry' ); const folder = gui.addFolder( 'THREE.TetrahedronGeometry' );
folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry ); folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry );
folder.add( data, 'detail', 0, 5 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'detail', 0, 5 ).step( 1 ).onChange( generateGeometry );
...@@ -516,10 +516,10 @@ ...@@ -516,10 +516,10 @@
}, },
TextBufferGeometry: function ( mesh ) { TextGeometry: function ( mesh ) {
const data = { const data = {
text: 'TextBufferGeometry', text: 'TextGeometry',
size: 5, size: 5,
height: 2, height: 2,
curveSegments: 12, curveSegments: 12,
...@@ -548,7 +548,7 @@ ...@@ -548,7 +548,7 @@
const loader = new FontLoader(); const loader = new FontLoader();
loader.load( '../../examples/fonts/' + data.font + '_' + data.weight + '.typeface.json', function ( font ) { loader.load( '../../examples/fonts/' + data.font + '_' + data.weight + '.typeface.json', function ( font ) {
const geometry = new TextBufferGeometry( data.text, { const geometry = new TextGeometry( data.text, {
font: font, font: font,
size: data.size, size: data.size,
height: data.height, height: data.height,
...@@ -570,7 +570,7 @@ ...@@ -570,7 +570,7 @@
//Hide the wireframe //Hide the wireframe
mesh.children[ 0 ].visible = false; mesh.children[ 0 ].visible = false;
const folder = gui.addFolder( 'THREE.TextBufferGeometry' ); const folder = gui.addFolder( 'THREE.TextGeometry' );
folder.add( data, 'text' ).onChange( generateGeometry ); folder.add( data, 'text' ).onChange( generateGeometry );
folder.add( data, 'size', 1, 30 ).onChange( generateGeometry ); folder.add( data, 'size', 1, 30 ).onChange( generateGeometry );
...@@ -588,7 +588,7 @@ ...@@ -588,7 +588,7 @@
}, },
TorusBufferGeometry: function ( mesh ) { TorusGeometry: function ( mesh ) {
const data = { const data = {
radius: 10, radius: 10,
...@@ -601,14 +601,14 @@ ...@@ -601,14 +601,14 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new TorusBufferGeometry( new TorusGeometry(
data.radius, data.tube, data.radialSegments, data.tubularSegments, data.arc data.radius, data.tube, data.radialSegments, data.tubularSegments, data.arc
) )
); );
} }
const folder = gui.addFolder( 'THREE.TorusBufferGeometry' ); const folder = gui.addFolder( 'THREE.TorusGeometry' );
folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry ); folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry );
folder.add( data, 'tube', 0.1, 10 ).onChange( generateGeometry ); folder.add( data, 'tube', 0.1, 10 ).onChange( generateGeometry );
...@@ -620,7 +620,7 @@ ...@@ -620,7 +620,7 @@
}, },
TorusKnotBufferGeometry: function ( mesh ) { TorusKnotGeometry: function ( mesh ) {
const data = { const data = {
radius: 10, radius: 10,
...@@ -634,7 +634,7 @@ ...@@ -634,7 +634,7 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new TorusKnotBufferGeometry( new TorusKnotGeometry(
data.radius, data.tube, data.tubularSegments, data.radialSegments, data.radius, data.tube, data.tubularSegments, data.radialSegments,
data.p, data.q data.p, data.q
) )
...@@ -642,7 +642,7 @@ ...@@ -642,7 +642,7 @@
} }
const folder = gui.addFolder( 'THREE.TorusKnotBufferGeometry' ); const folder = gui.addFolder( 'THREE.TorusKnotGeometry' );
folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry ); folder.add( data, 'radius', 1, 20 ).onChange( generateGeometry );
folder.add( data, 'tube', 0.1, 10 ).onChange( generateGeometry ); folder.add( data, 'tube', 0.1, 10 ).onChange( generateGeometry );
...@@ -655,7 +655,7 @@ ...@@ -655,7 +655,7 @@
}, },
ParametricBufferGeometry: function ( mesh ) { ParametricGeometry: function ( mesh ) {
const data = { const data = {
slices: 25, slices: 25,
...@@ -665,12 +665,12 @@ ...@@ -665,12 +665,12 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new ParametricBufferGeometry( ParametricGeometries.klein, data.slices, data.stacks ) new ParametricGeometry( ParametricGeometries.klein, data.slices, data.stacks )
); );
} }
const folder = gui.addFolder( 'THREE.ParametricBufferGeometry' ); const folder = gui.addFolder( 'THREE.ParametricGeometry' );
folder.add( data, 'slices', 1, 100 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'slices', 1, 100 ).step( 1 ).onChange( generateGeometry );
folder.add( data, 'stacks', 1, 100 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'stacks', 1, 100 ).step( 1 ).onChange( generateGeometry );
...@@ -679,7 +679,7 @@ ...@@ -679,7 +679,7 @@
}, },
TubeBufferGeometry: function ( mesh ) { TubeGeometry: function ( mesh ) {
const data = { const data = {
segments: 20, segments: 20,
...@@ -692,12 +692,12 @@ ...@@ -692,12 +692,12 @@
function generateGeometry() { function generateGeometry() {
updateGroupGeometry( mesh, updateGroupGeometry( mesh,
new TubeBufferGeometry( path, data.segments, data.radius, data.radialSegments, false ) new TubeGeometry( path, data.segments, data.radius, data.radialSegments, false )
); );
} }
const folder = gui.addFolder( 'THREE.TubeBufferGeometry' ); const folder = gui.addFolder( 'THREE.TubeGeometry' );
folder.add( data, 'segments', 1, 100 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'segments', 1, 100 ).step( 1 ).onChange( generateGeometry );
folder.add( data, 'radius', 1, 10 ).onChange( generateGeometry ); folder.add( data, 'radius', 1, 10 ).onChange( generateGeometry );
...@@ -707,7 +707,7 @@ ...@@ -707,7 +707,7 @@
}, },
ShapeBufferGeometry: function ( mesh ) { ShapeGeometry: function ( mesh ) {
const data = { const data = {
segments: 12 segments: 12
...@@ -715,21 +715,21 @@ ...@@ -715,21 +715,21 @@
function generateGeometry() { function generateGeometry() {
const geometry = new ShapeBufferGeometry( heartShape, data.segments ); const geometry = new ShapeGeometry( heartShape, data.segments );
geometry.center(); geometry.center();
updateGroupGeometry( mesh, geometry ); updateGroupGeometry( mesh, geometry );
} }
const folder = gui.addFolder( 'THREE.ShapeBufferGeometry' ); const folder = gui.addFolder( 'THREE.ShapeGeometry' );
folder.add( data, 'segments', 1, 100 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'segments', 1, 100 ).step( 1 ).onChange( generateGeometry );
generateGeometry(); generateGeometry();
}, },
ExtrudeBufferGeometry: function ( mesh ) { ExtrudeGeometry: function ( mesh ) {
const data = { const data = {
steps: 2, steps: 2,
...@@ -752,14 +752,14 @@ ...@@ -752,14 +752,14 @@
function generateGeometry() { function generateGeometry() {
const geometry = new ExtrudeBufferGeometry( shape, data ); const geometry = new ExtrudeGeometry( shape, data );
geometry.center(); geometry.center();
updateGroupGeometry( mesh, geometry ); updateGroupGeometry( mesh, geometry );
} }
const folder = gui.addFolder( 'THREE.ExtrudeBufferGeometry' ); const folder = gui.addFolder( 'THREE.ExtrudeGeometry' );
folder.add( data, 'steps', 1, 10 ).step( 1 ).onChange( generateGeometry ); folder.add( data, 'steps', 1, 10 ).step( 1 ).onChange( generateGeometry );
folder.add( data, 'depth', 1, 20 ).onChange( generateGeometry ); folder.add( data, 'depth', 1, 20 ).onChange( generateGeometry );
...@@ -776,7 +776,7 @@ ...@@ -776,7 +776,7 @@
function chooseFromHash( mesh ) { function chooseFromHash( mesh ) {
const selectedGeometry = window.location.hash.substring( 1 ) || 'TorusBufferGeometry'; const selectedGeometry = window.location.hash.substring( 1 ) || 'TorusGeometry';
if ( guis[ selectedGeometry ] !== undefined ) { if ( guis[ selectedGeometry ] !== undefined ) {
...@@ -784,7 +784,7 @@ ...@@ -784,7 +784,7 @@
} }
if ( selectedGeometry === 'TextBufferGeometry' ) { if ( selectedGeometry === 'TextGeometry' ) {
return { fixed: true }; return { fixed: true };
......
...@@ -56,7 +56,7 @@ ...@@ -56,7 +56,7 @@
RGBFormat, RGBFormat,
Scene, Scene,
TextureLoader, TextureLoader,
TorusKnotBufferGeometry, TorusKnotGeometry,
WebGLRenderer WebGLRenderer
} from "../../build/three.module.js"; } from "../../build/three.module.js";
...@@ -764,7 +764,7 @@ ...@@ -764,7 +764,7 @@
guiScene( gui, scene, camera ); guiScene( gui, scene, camera );
let geometry = new TorusKnotBufferGeometry( 10, 3, 100, 16 ); let geometry = new TorusKnotGeometry( 10, 3, 100, 16 );
geometry = geometry.toNonIndexed(); geometry = geometry.toNonIndexed();
generateVertexColors( geometry ); generateVertexColors( geometry );
......
THREE.ConvexBufferGeometry = function ( points ) { // ConvexGeometry
THREE.ConvexGeometry = function ( points ) {
THREE.BufferGeometry.call( this ); THREE.BufferGeometry.call( this );
...@@ -46,5 +48,5 @@ THREE.ConvexBufferGeometry = function ( points ) { ...@@ -46,5 +48,5 @@ THREE.ConvexBufferGeometry = function ( points ) {
}; };
THREE.ConvexBufferGeometry.prototype = Object.create( THREE.BufferGeometry.prototype ); THREE.ConvexGeometry.prototype = Object.create( THREE.BufferGeometry.prototype );
THREE.ConvexBufferGeometry.prototype.constructor = THREE.ConvexBufferGeometry; THREE.ConvexGeometry.prototype.constructor = THREE.ConvexGeometry;
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
* - Vertex normals must be planar (not smoothed) * - Vertex normals must be planar (not smoothed)
* *
* - The geometry must be convex (this is not checked in the library). You can create convex * - The geometry must be convex (this is not checked in the library). You can create convex
* geometries with THREE.ConvexBufferGeometry. The BoxBufferGeometry, SphereBufferGeometry and other convex primitives * geometries with THREE.ConvexGeometry. The BoxBufferGeometry, SphereBufferGeometry and other convex primitives
* can also be used. * can also be used.
* *
* Note: This lib adds member variables to object's userData member (see prepareBreakableObject function) * Note: This lib adds member variables to object's userData member (see prepareBreakableObject function)
...@@ -418,7 +418,7 @@ THREE.ConvexObjectBreaker.prototype = { ...@@ -418,7 +418,7 @@ THREE.ConvexObjectBreaker.prototype = {
if ( numPoints1 > 4 ) { if ( numPoints1 > 4 ) {
object1 = new THREE.Mesh( new THREE.ConvexBufferGeometry( points1 ), object.material ); object1 = new THREE.Mesh( new THREE.ConvexGeometry( points1 ), object.material );
object1.position.copy( this.tempCM1 ); object1.position.copy( this.tempCM1 );
object1.quaternion.copy( object.quaternion ); object1.quaternion.copy( object.quaternion );
...@@ -430,7 +430,7 @@ THREE.ConvexObjectBreaker.prototype = { ...@@ -430,7 +430,7 @@ THREE.ConvexObjectBreaker.prototype = {
if ( numPoints2 > 4 ) { if ( numPoints2 > 4 ) {
object2 = new THREE.Mesh( new THREE.ConvexBufferGeometry( points2 ), object.material ); object2 = new THREE.Mesh( new THREE.ConvexGeometry( points2 ), object.material );
object2.position.copy( this.tempCM2 ); object2.position.copy( this.tempCM2 );
object2.quaternion.copy( object.quaternion ); object2.quaternion.copy( object.quaternion );
......
import { import {
BufferGeometry, BufferGeometry,
Geometry,
Vector3 Vector3
} from '../../../src/Three'; } from '../../../src/Three';
export class ConvexGeometry extends Geometry { export class ConvexGeometry extends BufferGeometry {
constructor( points: Vector3[] );
}
export class ConvexBufferGeometry extends BufferGeometry {
constructor( points: Vector3[] ); constructor( points: Vector3[] );
......
...@@ -4,7 +4,9 @@ import { ...@@ -4,7 +4,9 @@ import {
} from '../../../build/three.module.js'; } from '../../../build/three.module.js';
import { ConvexHull } from '../math/ConvexHull.js'; import { ConvexHull } from '../math/ConvexHull.js';
var ConvexBufferGeometry = function ( points ) { // ConvexGeometry
var ConvexGeometry = function ( points ) {
BufferGeometry.call( this ); BufferGeometry.call( this );
...@@ -52,7 +54,7 @@ var ConvexBufferGeometry = function ( points ) { ...@@ -52,7 +54,7 @@ var ConvexBufferGeometry = function ( points ) {
}; };
ConvexBufferGeometry.prototype = Object.create( BufferGeometry.prototype ); ConvexGeometry.prototype = Object.create( BufferGeometry.prototype );
ConvexBufferGeometry.prototype.constructor = ConvexBufferGeometry; ConvexGeometry.prototype.constructor = ConvexGeometry;
export { ConvexBufferGeometry }; export { ConvexGeometry };
...@@ -524,8 +524,8 @@ class KTX2Container { ...@@ -524,8 +524,8 @@ class KTX2Container {
for ( var level = 0; level < this.header.levelCount; level ++ ) { for ( var level = 0; level < this.header.levelCount; level ++ ) {
var levelWidth = Math.ceil( width / Math.pow( 2, level ) ); var levelWidth = Math.max( 1, Math.floor( width / Math.pow( 2, level ) ) );
var levelHeight = Math.ceil( height / Math.pow( 2, level ) ); var levelHeight = Math.max( 1, Math.floor( height / Math.pow( 2, level ) ) );
var numImagesInLevel = 1; // TODO(donmccurdy): Support cubemaps, arrays and 3D. var numImagesInLevel = 1; // TODO(donmccurdy): Support cubemaps, arrays and 3D.
var imageOffsetInLevel = 0; var imageOffsetInLevel = 0;
......
...@@ -4,7 +4,7 @@ import { ...@@ -4,7 +4,7 @@ import {
Plane, Plane,
Vector3 Vector3
} from '../../../build/three.module.js'; } from '../../../build/three.module.js';
import { ConvexBufferGeometry } from '../geometries/ConvexGeometry.js'; import { ConvexGeometry } from '../geometries/ConvexGeometry.js';
/** /**
* @fileoverview This class can be used to subdivide a convex Geometry object into pieces. * @fileoverview This class can be used to subdivide a convex Geometry object into pieces.
...@@ -24,7 +24,7 @@ import { ConvexBufferGeometry } from '../geometries/ConvexGeometry.js'; ...@@ -24,7 +24,7 @@ import { ConvexBufferGeometry } from '../geometries/ConvexGeometry.js';
* - Vertex normals must be planar (not smoothed) * - Vertex normals must be planar (not smoothed)
* *
* - The geometry must be convex (this is not checked in the library). You can create convex * - The geometry must be convex (this is not checked in the library). You can create convex
* geometries with ConvexBufferGeometry. The BoxBufferGeometry, SphereBufferGeometry and other convex primitives * geometries with ConvexGeometry. The BoxBufferGeometry, SphereBufferGeometry and other convex primitives
* can also be used. * can also be used.
* *
* Note: This lib adds member variables to object's userData member (see prepareBreakableObject function) * Note: This lib adds member variables to object's userData member (see prepareBreakableObject function)
...@@ -426,7 +426,7 @@ ConvexObjectBreaker.prototype = { ...@@ -426,7 +426,7 @@ ConvexObjectBreaker.prototype = {
if ( numPoints1 > 4 ) { if ( numPoints1 > 4 ) {
object1 = new Mesh( new ConvexBufferGeometry( points1 ), object.material ); object1 = new Mesh( new ConvexGeometry( points1 ), object.material );
object1.position.copy( this.tempCM1 ); object1.position.copy( this.tempCM1 );
object1.quaternion.copy( object.quaternion ); object1.quaternion.copy( object.quaternion );
...@@ -438,7 +438,7 @@ ConvexObjectBreaker.prototype = { ...@@ -438,7 +438,7 @@ ConvexObjectBreaker.prototype = {
if ( numPoints2 > 4 ) { if ( numPoints2 > 4 ) {
object2 = new Mesh( new ConvexBufferGeometry( points2 ), object.material ); object2 = new Mesh( new ConvexGeometry( points2 ), object.material );
object2.position.copy( this.tempCM2 ); object2.position.copy( this.tempCM2 );
object2.quaternion.copy( object.quaternion ); object2.quaternion.copy( object.quaternion );
......
...@@ -28,7 +28,7 @@ async function AmmoPhysics() { ...@@ -28,7 +28,7 @@ async function AmmoPhysics() {
// TODO change type to is* // TODO change type to is*
if ( geometry.type === 'BoxBufferGeometry' ) { if ( geometry.type === 'BoxGeometry' ) {
const sx = parameters.width !== undefined ? parameters.width / 2 : 0.5; const sx = parameters.width !== undefined ? parameters.width / 2 : 0.5;
const sy = parameters.height !== undefined ? parameters.height / 2 : 0.5; const sy = parameters.height !== undefined ? parameters.height / 2 : 0.5;
...@@ -39,7 +39,7 @@ async function AmmoPhysics() { ...@@ -39,7 +39,7 @@ async function AmmoPhysics() {
return shape; return shape;
} else if ( geometry.type === 'SphereBufferGeometry' || geometry.type === 'IcosahedronBufferGeometry' ) { } else if ( geometry.type === 'SphereGeometry' || geometry.type === 'IcosahedronGeometry' ) {
const radius = parameters.radius !== undefined ? parameters.radius : 1; const radius = parameters.radius !== undefined ? parameters.radius : 1;
......
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
import { OrbitControls } from './jsm/controls/OrbitControls.js'; import { OrbitControls } from './jsm/controls/OrbitControls.js';
import { ConvexObjectBreaker } from './jsm/misc/ConvexObjectBreaker.js'; import { ConvexObjectBreaker } from './jsm/misc/ConvexObjectBreaker.js';
import { ConvexBufferGeometry } from './jsm/geometries/ConvexGeometry.js'; import { ConvexGeometry } from './jsm/geometries/ConvexGeometry.js';
// - Global variables - // - Global variables -
...@@ -236,7 +236,7 @@ ...@@ -236,7 +236,7 @@
mountainPoints.push( new THREE.Vector3( mountainHalfExtents.x, - mountainHalfExtents.y, - mountainHalfExtents.z ) ); mountainPoints.push( new THREE.Vector3( mountainHalfExtents.x, - mountainHalfExtents.y, - mountainHalfExtents.z ) );
mountainPoints.push( new THREE.Vector3( - mountainHalfExtents.x, - mountainHalfExtents.y, - mountainHalfExtents.z ) ); mountainPoints.push( new THREE.Vector3( - mountainHalfExtents.x, - mountainHalfExtents.y, - mountainHalfExtents.z ) );
mountainPoints.push( new THREE.Vector3( 0, mountainHalfExtents.y, 0 ) ); mountainPoints.push( new THREE.Vector3( 0, mountainHalfExtents.y, 0 ) );
const mountain = new THREE.Mesh( new ConvexBufferGeometry( mountainPoints ), createMaterial( 0xB03814 ) ); const mountain = new THREE.Mesh( new ConvexGeometry( mountainPoints ), createMaterial( 0xB03814 ) );
mountain.position.copy( pos ); mountain.position.copy( pos );
mountain.quaternion.copy( quat ); mountain.quaternion.copy( quat );
convexBreaker.prepareBreakableObject( mountain, mountainMass, new THREE.Vector3(), new THREE.Vector3(), true ); convexBreaker.prepareBreakableObject( mountain, mountainMass, new THREE.Vector3(), new THREE.Vector3(), true );
......
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册