Strona główna Odkrywaj Pomoc
Zaloguj się
javascript
/
three.js
kopia lustrzana https://github.com/tazdij/three.js.git
2
0
Forkuj 0
Pliki Problemy 0 Wiki
Przeglądaj źródła

added page and some old links

Lewy Blue 8 lat temu
rodzic
fdc084495a cb54da6c20
commit
d90f6faad0
31 zmienionych plików z 874 dodań i 414 usunięć
Widok podzielony Pokaż statystyki zmian
  1. 12 2
      docs/api/cameras/OrthographicCamera.html
  2. 12 2
      docs/api/cameras/PerspectiveCamera.html
  3. 2 0
      docs/api/deprecated/DeprecatedList.html
  4. 1 1
      docs/api/extras/CurveUtils.html
  5. 0 66
      docs/api/extras/curves/SplineCurve3.html
  6. 2 1
      docs/api/lights/PointLight.html
  7. 70 6
      docs/api/lights/shadows/DirectionalLightShadow.html
  8. 82 16
      docs/api/lights/shadows/LightShadow.html
  9. 63 4
      docs/api/lights/shadows/SpotLightShadow.html
  10. 1 2
      docs/list.js
  11. 40 1
      docs/manual/introduction/Useful-links.html
  12. 0 18
      editor/js/libs/tern-threejs/threejs.js
  13. 62 14
      examples/js/loaders/GLTFLoader.js
  14. 30 4
      examples/js/renderers/CanvasRenderer.js
  15. 8 0
      examples/models/gltf/snowflake/line_frag.glsl
  16. 17 0
      examples/models/gltf/snowflake/line_vert.glsl
  17. BIN
      examples/models/gltf/snowflake/snowFlake.bin
  18. 133 0
      examples/models/gltf/snowflake/snowFlake.gltf
  19. 8 0
      examples/models/gltf/snowflakes/line_frag.glsl
  20. 17 0
      examples/models/gltf/snowflakes/line_vert.glsl
  21. BIN
      examples/models/gltf/snowflakes/snowFlakes.bin
  22. 150 0
      examples/models/gltf/snowflakes/snowFlakes.gltf
  23. 106 142
      examples/webgl_buffergeometry_constructed_from_geometry.html
  24. 20 1
      examples/webgl_loader_gltf.html
  25. 12 0
      src/Three.Legacy.js
  26. 0 1
      src/Three.js
  27. 1 1
      src/extras/core/Curve.js
  28. 0 45
      src/extras/curves/SplineCurve3.js
  29. 25 29
      src/objects/Mesh.js
  30. 0 56
      test/unit/extras/curves/ClosedSplineCurve3.js
  31. 0 2
      test/unit/unittests_sources.html

+ 12 - 2
docs/api/cameras/OrthographicCamera.html
Wyświetl plik 

@@ -64,7 +64,12 @@ scene.add( camera );</code>
 
 		<div>Camera frustum bottom plane.</div>
 
 
 		<h3>[property:Float far]</h3>
 
-		<div>Camera frustum far plane. Default is *2000*.</div>
 
+		<div>
 
+		Camera frustum far plane. Default is *2000*.<br /><br />
 
+
 
+		Note that Three does not currently give warnings for incorrect values here, however the expected
 
+		range is between the current value of the [page:.far far] plane and infinity.
 
+		</div>
 
 
 		<h3>[property:Boolean isOrthographicCamera]</h3>
 
 		<div>
 
@@ -77,7 +82,12 @@ scene.add( camera );</code>
 
 		<div>Camera frustum left plane.</div>
 
 
 		<h3>[property:Float near]</h3>
 
-		<div>Camera frustum near plane. Default is *0.1*.</div>
 
+		<div>
 
+			Camera fustum near plane. Default is *0.1*.<br /><br />
 
+
 
+			Note that Three does not currently give warnings for incorrect values here, however the expected
 
+			range is between 0 and the current value of the [page:.far far] plane.
 
+		</div>
 
 
 		<h3>[property:Float right]</h3>
 
 		<div>Camera frustum right plane.</div>

+ 12 - 2
docs/api/cameras/PerspectiveCamera.html
Wyświetl plik 

@@ -54,7 +54,12 @@ scene.add( camera );</code>
 
 		<div>Camera frustum aspect ratio, usually the canvas width / canvas height. Default is *1* (square canvas).</div>
 
 
 		<h3>[property:Float far]</h3>
 
-		<div>Camera frustum far plane. Default is *2000*.</div>
 
+		<div>
 
+			Camera frustum far plane. Default is *2000*.<br /><br />
 
+
 
+			Note that Three does not currently give warnings for incorrect values here, however the expected
 
+			range is between the current value of the [page:.far far] plane and infinity.
 
+		</div>
 
 
 		<h3>[property:Float filmGauge]</h3>
 
 		<div>Film size used for the larger axis. Default is 35 (millimeters). This parameter does not influence the projection matrix unless .filmOffset is set to a nonzero value.</div>
 
@@ -80,7 +85,12 @@ scene.add( camera );</code>
 
 
 
 		<h3>[property:Float near]</h3>
 
-		<div>Camera frustum near plane. Default is *0.1*.</div>
 
+		<div>
 
+			Camera fustum near plane. Default is *0.1*.<br /><br />
 
+
 
+			Note that Three does not currently give warnings for incorrect values here, however the expected
 
+			range is between 0 and the current value of the [page:.far far] plane.
 
+		</div>
 
 
 		<h3>[property:Object view]</h3>
 
 		<div>

+ 2 - 0
docs/api/deprecated/DeprecatedList.html
Wyświetl plik 

@@ -140,6 +140,8 @@
 
 		<h3>[page:ClosedSplineCurve3]</h3>
 
 		<div>ClosedSplineCurve3 has been deprecated. Use [page:CatmullRomCurve3] instead.</div>
 
 
+		<h3>[page:SplineCurve3]</h3>
 
+		<div>SplineCurve3 has been deprecated. Use [page:CatmullRomCurve3] instead.</div>

+ 1 - 1
docs/api/extras/CurveUtils.html
Wyświetl plik 

@@ -25,7 +25,7 @@
 
 		t -- interpolation weight. <br />
 
 		p0, p1, p2, p4 -- the points defining the spline curve.<br /><br />
 
 
-		Used internally by [page:SplineCurve SplineCurve] and [page:SplineCurve3 SplineCurve3].
 
+		Used internally by [page:SplineCurve SplineCurve].
 
 		</div>
 
 
 		<h3>[method:Number tangentQuadraticBezier]( t, p0, p1, p2 )</h3>

+ 0 - 66
docs/api/extras/curves/SplineCurve3.html
Wyświetl plik 

@@ -1,66 +0,0 @@
 
-<!DOCTYPE html>
 
-<html lang="en">
 
-	<head>
 
-		<meta charset="utf-8" />

-		<base href="../../../" />
 
-		<script src="list.js"></script>
 
-		<script src="page.js"></script>
 
-		<link type="text/css" rel="stylesheet" href="page.css" />
 
-	</head>
 
-	<body>
 
-		[page:Curve] &rarr;
 
-
 
-		<h1>[name]</h1>
 
-
 
-		<div class="desc">
 
-			Create a smooth 3d spline curve from a series of points. Internally this uses
 
-		[page:CurveUtils.interpolate] to create the curve.<br /><br />
 
-
 
-		Note that this will be deprecated. Please use a [page:CatmullRomCurve3] instead.
 
-
 
-	</div>
 
-
 
-		<h2>Example</h2>
 
-
 
-		<div>[example:webgl_geometry_extrude_splines geometry / extrude / splines ] (choose PipeSpline)</div>
 
-
 
-		<code>
 
-//Create a closed bent a sine-like wave
 
-var curve = new THREE.SplineCurve3( [
 
-	new THREE.Vector3( -10, 0, 10 ),
 
-	new THREE.Vector3( -5, 5, 5 ),
 
-	new THREE.Vector3( 0, 0, 0 ),
 
-	new THREE.Vector3( 5, -5, 5 ),
 
-	new THREE.Vector3( 10, 0, 10 )
 
-] );
 
-
 
-var geometry = new THREE.Geometry();
 
-geometry.vertices = curve.getPoints( 50 );
 
-
 
-var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
-
 
-//Create the final object to add to the scene
 
-var splineObject = new THREE.Line( geometry, material );
 
-	</code>
 
-
 
-
 
-
 
-
 
-		<h2>Constructor</h2>
 
-
 
-
 
-		<h3>[name]( [page:Array points] )</h3>
 
-		<div>points – An array of [page:Vector3] points that define the curve.</div>
 
-
 
-
 
-		<h2>Properties</h2>
 
-
 
-		<h3>[property:Array points]</h3>
 
-
 
-		<h2>Methods</h2>
 
-
 
-		<h3>See [page:Curve] for inherited methods</h3>
 
-
 
-		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
 
-	</body>
 
-</html>

+ 2 - 1
docs/api/lights/PointLight.html
Wyświetl plik 

@@ -95,7 +95,8 @@ scene.add( light );
 
 

 		<h3>[property:LightShadow shadow]</h3>

 		<div>

-			A [page:LightShadow] used to calculate shadows for this light.<br />

+			A [page:LightShadow] used to calculate shadows for this light.<br /><br />

+

 			 The lightShadow's [page:LightShadow.camera camera]

 			is set to a  [page:PerspectiveCamera] with [page:PerspectiveCamera.fov fov] of 90,

 			[page:PerspectiveCamera.aspect aspect] of 1, [page:PerspectiveCamera.near near]

+ 70 - 6
docs/api/lights/shadows/DirectionalLightShadow.html
Wyświetl plik 

@@ -12,19 +12,83 @@
 
 
 		<h1>[name]</h1>
 
 
-		<div class="desc">TODO</div>
 
+		<div class="desc">
 
+			This used internally by [page:DirectionalLight DirectionalLights] for calculating shadows.<br /><br />
 
 
-		<h2>Constructor</h2>
 
+			Unlike the other shadow classes, this uses an [page:OrthographicCamera] to calculate the shadows,
 
+			rather than a [page:PerspectiveCamera]. This is because light rays from a [page:DirectionalLight]
 
+			are parallel.
 
+		</div>
 
+
 
+		<h2>Example</h2>
 
+		<div>
 
+			<code>
 
+//Create a WebGLRenderer and turn on shadows in the renderer
 
+var renderer = new THREE.WebGLRenderer();
 
+renderer.shadowMap.enabled = true;
 
+renderer.shadowMap.type = THREE.PCFSoftShadowMap; // default THREE.PCFShadowMap
 
+
 
+//Create a DirectionalLight and turn on shadows for the light
 
+var light = new THREE.DirectionalLight( 0xffffff, 1, 100 );
 
+light.position.set( 0, 1, 0 ); 			//default; light shining from top
 
+light.castShadow = true;            // default false
 
+scene.add( light );
 
+
 
+//Set up shadow properties for the light
 
+light.shadow.mapSize.width = 512;  // default
 
+light.shadow.mapSize.height = 512; // default
 
+light.shadow.camera.near = 0.5;       // default
 
+light.shadow.camera.far = 500      // default
 
+
 
+//Create a sphere that cast shadows (but does not receive them)
 
+var sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
 
+var sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
 
+var sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
 
+sphere.castShadow = true; //default is false
 
+sphere.receiveShadow = false; //default
 
+scene.add( sphere );
 
+
 
+//Create a plane that receives shadows (but does not cast them)
 
+var planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 );
 
+var planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
 
+var plane = new THREE.Mesh( planeGeometry, planeMaterial );
 
+plane.receiveShadow = true;
 
+scene.add( plane );
 
 
-		The constructor creates an [page:OrthographicCamera OrthographicCamera] to manage the shadow's view of the world.
 
+//Create a helper for the shadow camera (optional)
 
+var helper = new THREE.CameraHelper( light.shadow.camera );
 
+scene.add( helper );
 
+			</code>
 
+		</div>
 
+
 
+		<h2>Constructor</h2>
 
+		<h3>[name]( [page:Integer hex], [page:Float intensity] )</h3>
 
+		<div>
 
+			Creates a new [name]. This is not intended to be called directly - it is called
 
+			internally by [page:DirectionalLight].
 
+		</div>
 
 
 		<h2>Properties</h2>
 
+		<div>
 
+			See the base [page:LightShadow LightShadow] class for common properties.
 
+		</div>
 
 
-		See the base [page:LightShadow LightShadow] class for common properties.
 
+		<h3>[property:Camera camera]</h3>
 
+		<div>
 
+			The light's view of the world. This is used to generate a depth map of the scene; objects behind
 
+			other objects from the light's perspective will be in shadow.<br /><br />
 
 
-		<h2>Methods</h2>
 
+			The default is an [page:OrthographicCamera] with [page:OrthographicCamera.left left] and
 
+			[page:OrthographicCamera.bottom bottom] set to -5,  [page:OrthographicCamera.right right]
 
+			and  [page:OrthographicCamera.top top] set to 5, the [page:OrthographicCamera.near near]
 
+			clipping plane at 0.5 and the [page:OrthographicCamera.far far] clipping plane at 500.
 
+		</div>
 
 
-		See the base [page:LightShadow LightShadow] class for common methods.
 
+
 
+		<h2>Methods</h2>
 
+		<div>
 
+			See the base [page:LightShadow LightShadow] class for common methods.
 
+		</div>
 
 
 		<h2>Source</h2>

+ 82 - 16
docs/api/lights/shadows/LightShadow.html
Wyświetl plik 

@@ -11,61 +11,127 @@
 
 
 		<h1>[name]</h1>
 
 
-		<div class="desc">TODO</div>
 
+		<div class="desc">
 
+			This used internally by [page:PointLight PointLights] for calculating shadows, and also serves as
 
+			a base class for the other shadow classes.
 
+		</div>
 
 
-		<h2>Constructor</h2>
 
 
+		<h2>Example</h2>
 
+		<div>
 
+			<code>
 
+//Create a WebGLRenderer and turn on shadows in the renderer
 
+var renderer = new THREE.WebGLRenderer();
 
+renderer.shadowMap.enabled = true;
 
+renderer.shadowMap.type = THREE.PCFSoftShadowMap; // default THREE.PCFShadowMap
 
+
 
+//Create a PointLight and turn on shadows for the light
 
+var light = new THREE.PointLight( 0xffffff, 1, 100 );
 
+light.position.set( 0, 10, 0 );
 
+light.castShadow = true;            // default false
 
+scene.add( light );
 
+
 
+//Set up shadow properties for the light
 
+light.shadow.mapSize.width = 512;  // default
 
+light.shadow.mapSize.height = 512; // default
 
+light.shadow.camera.near = 0.5;       // default
 
+light.shadow.camera.far = 500      // default
 
+
 
+//Create a sphere that cast shadows (but does not receive them)
 
+var sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
 
+var sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
 
+var sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
 
+sphere.castShadow = true; //default is false
 
+sphere.receiveShadow = false; //default
 
+scene.add( sphere );
 
+
 
+//Create a plane that receives shadows (but does not cast them)
 
+var planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 );
 
+var planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
 
+var plane = new THREE.Mesh( planeGeometry, planeMaterial );
 
+plane.receiveShadow = true;
 
+scene.add( plane );
 
+
 
+//Create a helper for the shadow camera (optional)
 
+var helper = new THREE.CameraHelper( light.shadow.camera );
 
+scene.add( helper );
 
+			</code>
 
+		</div>
 
+
 
+		<h2>Constructor</h2>
 
 
 		<h3>[name]( [page:Camera camera] )</h3>
 
 		<div>
 
-		[page:Camera camera] — The shadow's view of the world.
 
+		[page:Camera camera] - the light's view of the world.<br /><br />
 
+
 
+		Create a new [name]. This is not intended to be called directly - it is called
 
+		internally by [page:PointLight] or used as a base class by other light shadows.
 
 		</div>
 
 
 		<h2>Properties</h2>
 
 
 		<h3>[property:Camera camera]</h3>
 
 		<div>
 
-			The shadow's view of the world.
 
+			The light's view of the world. This is used to generate a depth map of the scene; objects behind
 
+			other objects from the light's perspective will be in shadow.
 
 		</div>
 
 
 		<h3>[property:Float bias]</h3>
 
 		<div>
 
 			Shadow map bias, how much to add or subtract from the normalized depth when deciding whether a surface is in shadow.<br />
 
-			Default — *0*.
 
+			The default is 0. Very tiny adjustments here (in the order of 0.0001) may help reduce artefacts in shadows
 
 		</div>
 
 
-		<h3>[property:Float radius]</h3>
 
+		<h3>[property:WebGLRenderTarget map]</h3>
 
 		<div>
 
-			TODO<br />
 
-			Default - *0*.
 
+			The depth map generated using the internal camera; a location beyond a pixel's depth is
 
+			in shadow. Computed internally during rendering.
 
 		</div>
 
 
+
 
 		<h3>[property:Vector2 mapSize]</h3>
 
 		<div>
 
-			The width and height of the shadow map stored in a [page:Vector2 Vector2].<br />
 
-			Default — *( 512, 512 )*.
 
+			A [Page:Vector2] defining the width and height of the shadow map.<br /><br />
 
+
 
+			Higher values give better quality shadows at the cost of computation time. Values must be
 
+			powers of 2, up to the [page:WebGLRenderer.capabilities].maxTextureSize for a given device,
 
+			although the width and height don't have to be the same (so, for example, (512, 1024) is valid).
 
+			The default is *( 512, 512 )*.
 
 		</div>
 
 
-		<h3>[property:WebGLRenderTarget map]</h3>
 
+
 
+		<h3>[property:Matrix4 matrix]</h3>
 
 		<div>
 
-			The depth map generated using the internal camera; a location beyond a pixel's depth is in shadow. Computed internally during rendering.
 
+			Model to shadow camera space, to compute location and depth in shadow map. Stored
 
+			in a [page:Matrix4 Matrix4]. This is computed internally during rendering.
 
 		</div>
 
 
-		<h3>[property:Matrix4 matrix]</h3>
 
+		<h3>[property:Float radius]</h3>
 
 		<div>
 
-			Model to shadow camera space, to compute location and depth in shadow map. Stored in a [page:Matrix4 Matrix4]. Computed internally during rendering.
 
+			Setting this this to values greater than 1 will blur the edges of the shadow.<br />
 
+
 
+			High values will cause unwanted banding effects in the shadows - a greater [page:.mapSize mapSize]
 
+			will allow for a higher value to be used here before these effects become visible.<br /><br />
 
+
 
+			Note that this has no effect if the [page:WebGLRenderer.shadowMap.type] is set to [page:Renderer BasicShadowMap].
 
 		</div>
 
 
 
 		<h2>Methods</h2>
 
 		<h3>[method:LightShadow copy]( [page:LightShadow source] )</h3>
 
 		<div>
 
-		Copies value of *source* to this LightShadow object.
 
+		Copies value of all the properties from the [page:LightShadow source] to this
 
+		SpotLight.
 
 		</div>
 
 
 		<h3>[method:LightShadow clone]()</h3>
 
 		<div>
 
-		It returns a clone of LightShadow.
 
+		Creates a new LightShadow with the same properties as this one.
 
+		</div>
 
+
 
+		<h3>[method:Object toJSON]()</h3>
 
+		<div>
 
+		Serialize this LightShadow.
 
 		</div>
 
 
 		<h2>Source</h2>

+ 63 - 4
docs/api/lights/shadows/SpotLightShadow.html
Wyświetl plik 

@@ -12,23 +12,82 @@
 
 
 		<h1>[name]</h1>
 
 
-		<div class="desc">TODO</div>
 
+		<div class="desc">
 
+			This used internally by [page:SpotLight SpotLights] for calculating shadows.
 
+		</div>
 
+
 
+		<h2>Example</h2>
 
+		<div>
 
+			<code>
 
+//Create a WebGLRenderer and turn on shadows in the renderer
 
+var renderer = new THREE.WebGLRenderer();
 
+renderer.shadowMap.enabled = true;
 
+renderer.shadowMap.type = THREE.PCFSoftShadowMap; // default THREE.PCFShadowMap
 
+
 
+//Create a SpotLight and turn on shadows for the light
 
+var light = new THREE.SpotLight( 0xffffff );
 
+light.castShadow = true;            // default false
 
+scene.add( light );
 
+
 
+//Set up shadow properties for the light
 
+light.shadow.mapSize.width = 512;  // default
 
+light.shadow.mapSize.height = 512; // default
 
+light.shadow.camera.near = 0.5;       // default
 
+light.shadow.camera.far = 500      // default
 
+
 
+//Create a sphere that cast shadows (but does not receive them)
 
+var sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
 
+var sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
 
+var sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
 
+sphere.castShadow = true; //default is false
 
+sphere.receiveShadow = false; //default
 
+scene.add( sphere );
 
+
 
+//Create a plane that receives shadows (but does not cast them)
 
+var planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 );
 
+var planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
 
+var plane = new THREE.Mesh( planeGeometry, planeMaterial );
 
+plane.receiveShadow = true;
 
+scene.add( plane );
 
+
 
+//Create a helper for the shadow camera (optional)
 
+var helper = new THREE.CameraHelper( light.shadow.camera );
 
+scene.add( helper );
 
+			</code>
 
+		</div>
 
+
 
 
 		<h2>Constructor</h2>
 
 
 		The constructor creates a [page:PerspectiveCamera PerspectiveCamera] to manage the shadow's view of the world.
 
 
 		<h2>Properties</h2>
 
-
 
 		See the base [page:LightShadow LightShadow] class for common properties.
 
 
-		<h2>Methods</h2>
 
 
+	 <h3>[property:Camera camera]</h3>
 
+	 <div>
 
+		 The light's view of the world. This is used to generate a depth map of the scene; objects behind
 
+		 other objects from the light's perspective will be in shadow.<br /><br />
 
+
 
+		 The default is a  [page:PerspectiveCamera] with [page:PerspectiveCamera.fov fov] of 90,
 
+	  [page:PerspectiveCamera.aspect aspect] of 1, [page:PerspectiveCamera.near near]
 
+		clipping plane at 0.5 and	[page:PerspectiveCamera.far far] clipping plane at 500.
 
+	 </div>
 
+
 
+	 <h3>[property:Boolean isSpotLightShadow]</h3>
 
+	 <div>
 
+		 Used to check whether this or derived classes are spot light shadows. Default is *true*.<br /><br />
 
+
 
+		 You should not change this, as it used internally for optimisation.
 
+	 </div>
 
+
 
+		<h2>Methods</h2>
 
 		See the base [page:LightShadow LightShadow] class for common methods.
 
 
 		<h3>[method:SpotLightShadow update]( [page:SpotLight light] )</h3>
 
 		<div>
 
-		Updates the internal perspective camera.
 
+		Updates the internal perspective [page:.camera camera] based on the passed in [page:SpotLight light].
 
 		</div>
 
 
 		<h2>Source</h2>

+ 1 - 2
docs/list.js
Wyświetl plik 

@@ -108,8 +108,7 @@ var list = {
 
 			[ "LineCurve3", "api/extras/curves/LineCurve3" ],
 
 			[ "QuadraticBezierCurve", "api/extras/curves/QuadraticBezierCurve" ],
 
 			[ "QuadraticBezierCurve3", "api/extras/curves/QuadraticBezierCurve3" ],
 
-			[ "SplineCurve", "api/extras/curves/SplineCurve" ],
 
-			[ "SplineCurve3", "api/extras/curves/SplineCurve3" ]
 
+			[ "SplineCurve", "api/extras/curves/SplineCurve" ]
 
 		],
 
 
 		"Extras / Helpers": [

+ 40 - 1
docs/manual/introduction/Useful-links.html
Wyświetl plik 

@@ -13,9 +13,48 @@
 
 		<div class="desc">
 
 			The following is a collection of links that you might find useful when learning Three.<br />
 
 			If you find something that you'd like to add here, or think that one of the links below is no longer
 
-			relevant or working, feel free to click the 'edit' button in the top right and make some changes!
 
+			relevant or working, feel free to click the 'edit' button in the top right and make some changes!<br /><br />
 
+
 
+			Note also that as three.js is under rapid development, a lot of these links will contain information that is
 
+			out of date - if something isn't working as you'd expect or one of these links says it should,
 
+			check the browser console for warning, the relevant docs pages and especially the [page:DeprecatedList].
 
 		</div>
 
 
+    <h2>Presentations</h2>
 
+
 
+		<h3>[link:https://www.youtube.com/watch?v=Dir4KO9RdhM AlterQualia at WebGL Camp 3]</h3>
 
+		<div>
 
+			A video presentation from 2012 by AlteredQualia, one of the main developers of three.js.
 
+		</div>
 
+
 
+		<h2>Examples</h2>
 
+
 
+		<h3>[link:http://stemkoski.github.io/Three.js/index.html Professor Stemkoskis Examples]</h3>
 
+		<div>
 
+			Even though Dr. Lee Stemkoski's examples are built using r60, they are very beginner
 
+			friendly and contain a lot of useful info.
 
+			Just be warned that some of them might be a bit out of date now!
 
+		</div>
 
+
 
+		<h3>[link:http://yomotsu.github.io/threejs-examples/ Yomotsus Examples]</h3>
 
+		<div>
 
+			Again, these are built with an old version of three.js (r49), so the same warnings as above apply:
 
+			be warned that you might have to make some changes to use the techniques in these examples.
 
+	 </div>
 
+
 
+	 <h3>[link:https://threejs.org/examples/ Official three.js Examples]</h3>
 
+	 <div>
 
+		 A large number of examples are maintained as part of the three.js repository. They are kept up to
 
+		 date and always use the latest version.
 
+	   It's probably best to work off these examples than the ones linked above, however some of them may
 
+		 not be quite as beginner friendly.
 
+	 </div>
 
+
 
+	 <h3>[link:https://rawgit.com/mrdoob/three.js/dev/examples/ Official three.js Examples] (dev branch) </h3>
 
+	 <div>
 
+		 Same as the above, except these use the dev branch of three.js,
 
+		 and are used to check that everything is working as three.js being is developed.
 
+	 </div>
 
 
 	</body>
 
 </html>

+ 0 - 18
editor/js/libs/tern-threejs/threejs.js
Wyświetl plik 

@@ -1431,15 +1431,6 @@
 
       },
 
       "!doc": "Alias for [page:EllipseCurve]"
 
     },
 
-    "ClosedSplineCurve3": {
 
-      "!url": "http://threejs.org/docs/#Reference/extras/curves/ClosedSplineCurve3",
 
-      "prototype": {
 
-        "!proto": "THREE.Curve.prototype",
 
-        "points": "[]"
 
-      },
 
-      "!doc": "Create a smooth 3d spline curve from a series of points that loops back onto itself",
 
-      "!type": "fn(points: [])"
 
-    },
 
     "CubicBezierCurve": {
 
       "!url": "http://threejs.org/docs/#Reference/extras/curves/CubicBezierCurve",
 
       "prototype": {
 
@@ -1529,15 +1520,6 @@
 
       "!doc": "Create a smooth 2d spline curve from a series of points",
 
       "!type": "fn(points: [])"
 
     },
 
-    "SplineCurve3": {
 
-      "!url": "http://threejs.org/docs/#Reference/extras/curves/SplineCurve3",
 
-      "prototype": {
 
-        "!proto": "THREE.Curve.prototype",
 
-        "points": "[]"
 
-      },
 
-      "!doc": "Create a smooth 3d spline curve from a series of points",
 
-      "!type": "fn(points: [])"
 
-    },
 
     "BoxGeometry": {
 
       "!url": "http://threejs.org/docs/#Reference/geometries/BoxGeometry",
 
       "prototype": {

+ 62 - 14
examples/js/loaders/GLTFLoader.js
Wyświetl plik 

@@ -301,6 +301,7 @@ THREE.GLTFLoader = ( function () {
 
 		REPEAT: 10497,
 
 		SAMPLER_2D: 35678,
 
 		TRIANGLES: 4,
 
+		LINES: 1,
 
 		UNSIGNED_BYTE: 5121,
 
 		UNSIGNED_SHORT: 5123,
 
 
@@ -1206,27 +1207,60 @@ THREE.GLTFLoader = ( function () {
 
 
 						if ( primitive.indices ) {
 
 
-							var indexArray = dependencies.accessors[ primitive.indices ];
 
+							geometry.setIndex( dependencies.accessors[ primitive.indices ] );
 
 
-							geometry.setIndex( indexArray );
 
+						}
 
 
-							var offset = {
 
-								start: 0,
 
-								index: 0,
 
-								count: indexArray.count
 
-							};
 
+						var material = dependencies.materials[ primitive.material ];
 
+
 
+						var meshNode = new THREE.Mesh( geometry, material );
 
+						meshNode.castShadow = true;
 
 
-							geometry.groups.push( offset );
 
+						if ( primitive.extras ) meshNode.userData = primitive.extras;
 
 
-							geometry.computeBoundingSphere();
 
+						group.add( meshNode );
 
 
-						}
 
+					} else if ( primitive.mode === WEBGL_CONSTANTS.LINES ) {
 
+
 
+						var geometry = new THREE.BufferGeometry();
 
+
 
+						var attributes = primitive.attributes;
 
+
 
+						_each( attributes, function ( attributeEntry, attributeId ) {
 
+
 
+							if ( ! attributeEntry ) return;
 
+
 
+							var bufferAttribute = dependencies.accessors[ attributeEntry ];
 
 
+							switch ( attributeId ) {
 
+
 
+								case 'POSITION':
 
+									geometry.addAttribute( 'position', bufferAttribute );
 
+									break;
 
+
 
+								case 'COLOR':
 
+									geometry.addAttribute( 'color', bufferAttribute );
 
+									break;
 
+
 
+							}
 
+
 
+						} );
 
 
 						var material = dependencies.materials[ primitive.material ];
 
 
-						var meshNode = new THREE.Mesh( geometry, material );
 
-						meshNode.castShadow = true;
 
+						var meshNode;
 
+
 
+						if ( primitive.indices ) {
 
+
 
+							geometry.setIndex( dependencies.accessors[ primitive.indices ] );
 
+
 
+							meshNode = new THREE.LineSegments( geometry, material );
 
+
 
+						} else {
 
+
 
+							meshNode = new THREE.Line( geometry, material );
 
+
 
+						}
 
 
 						if ( primitive.extras ) meshNode.userData = primitive.extras;
 
 
@@ -1234,7 +1268,7 @@ THREE.GLTFLoader = ( function () {
 
 
 					} else {
 
 
-						console.warn( "Non-triangular primitives are not supported" );
 
+						console.warn( "Only triangular and line primitives are supported" );
 
 
 					}
 
 
@@ -1475,7 +1509,21 @@ THREE.GLTFLoader = ( function () {
 
 
 								}
 
 
-								child = new THREE.Mesh( originalGeometry, material );
 
+								switch ( child.type ) {
 
+
 
+									case 'LineSegments':
 
+										child = new THREE.LineSegments( originalGeometry, material );
 
+										break;
 
+
 
+									case 'Line':
 
+										child = new THREE.Line( originalGeometry, material );
 
+										break;
 
+
 
+									default:
 
+										child = new THREE.Mesh( originalGeometry, material );
 
+
 
+								}
 
+
 
 								child.castShadow = true;
 
 								child.userData = originalUserData;

+ 30 - 4
examples/js/renderers/CanvasRenderer.js
Wyświetl plik 

@@ -854,16 +854,42 @@ THREE.CanvasRenderer = function ( parameters ) {
 
 
 		}
 
 
+		var repeatX = texture.wrapS === THREE.RepeatWrapping || texture.wrapS === THREE.MirroredRepeatWrapping;
 
+		var repeatY = texture.wrapT === THREE.RepeatWrapping || texture.wrapT === THREE.MirroredRepeatWrapping;
 
+
 
+		var mirrorX = texture.wrapS === THREE.MirroredRepeatWrapping;
 
+		var mirrorY = texture.wrapT === THREE.MirroredRepeatWrapping;
 
+
 
+		//
 
+
 
 		var canvas = document.createElement( 'canvas' );
 
-		canvas.width = image.width;
 
-		canvas.height = image.height;
 
+		canvas.width = image.width * ( mirrorX ? 2 : 1 );
 
+		canvas.height = image.height * ( mirrorY ? 2 : 1 );
 
 
 		var context = canvas.getContext( '2d' );
 
 		context.setTransform( 1, 0, 0, - 1, 0, image.height );
 
 		context.drawImage( image, 0, 0 );
 
 
-		var repeatX = texture.wrapS === THREE.RepeatWrapping;
 
-		var repeatY = texture.wrapT === THREE.RepeatWrapping;
 
+		if ( mirrorX === true ) {
 
+
 
+			context.setTransform( - 1, 0, 0, - 1, image.width, image.height );
 
+			context.drawImage( image, - image.width, 0 );
 
+
 
+		}
 
+
 
+		if ( mirrorY === true ) {
 
+
 
+			context.setTransform( 1, 0, 0, 1, 0, 0 );
 
+			context.drawImage( image, 0, image.height );
 
+
 
+		}
 
+
 
+		if ( mirrorX === true && mirrorY === true ) {
 
+
 
+			context.setTransform( - 1, 0, 0, 1, image.width, 0 );
 
+			context.drawImage( image, - image.width, image.height );
 
+
 
+		}
 
 
 		var repeat = 'no-repeat';

+ 8 - 0
examples/models/gltf/snowflake/line_frag.glsl
Wyświetl plik 

@@ -0,0 +1,8 @@
 
+precision highp float;
 
+varying vec3 vertexColor;
 
+
 
+void main(void) {
 
+
 
+	gl_FragColor = vec4(vertexColor.r, vertexColor.g, vertexColor.b, 1.0);;
 
+	
+}

+ 17 - 0
examples/models/gltf/snowflake/line_vert.glsl
Wyświetl plik 

@@ -0,0 +1,17 @@
 
+precision highp float;
 
+
 
+attribute vec3 position;
 
+attribute vec3 color;
 
+
 
+uniform mat4 modelViewMatrix;
 
+uniform mat4 projectionMatrix;
 
+
 
+varying vec3 vertexColor;
 
+
 
+void main(void) {
 
+
 
+	vec4 pos = modelViewMatrix * vec4(position,1.0);
 
+	vertexColor = vec3(color.x, color.y, color.y);
 
+	gl_Position = projectionMatrix * pos;
 
+	
+}

BIN
examples/models/gltf/snowflake/snowFlake.bin
Wyświetl plik


+ 133 - 0
examples/models/gltf/snowflake/snowFlake.gltf
Wyświetl plik 

@@ -0,0 +1,133 @@
 
+{
 
+  "accessors": {
 
+    "VertexAccessor": {
 
+      "bufferView": "VertexBuffer",
 
+      "byteOffset": 0,
 
+      "byteStride": 12,
 
+      "componentType": 5126,
 
+      "count": 257,
 
+      "type": "VEC3",
 
+      "name": "VertexAccessor"
 
+    },
 
+    "ColorAccessor": {
 
+      "bufferView": "ColorView",
 
+      "byteOffset": 0,
 
+      "byteStride": 12,
 
+      "componentType": 5126,
 
+      "count": 257,
 
+      "type": "VEC3",
 
+      "name": "ColorAccessor"
 
+    }
 
+  },
 
+  "buffers": {
 
+    "Buffer": {
 
+      "uri": "snowFlake.bin",
 
+      "byteLength": 6168,
 
+      "type": "arraybuffer",
 
+      "name": "Buffer",
 
+      "extensions": {}
 
+    }
 
+  },
 
+  "bufferViews": {
 
+    "VertexBuffer": {
 
+      "buffer": "Buffer",
 
+      "byteOffset": 0,
 
+      "byteLength": 3084,
 
+      "target": 34962,
 
+      "name": "VertexBuffer"
 
+    },
 
+    "ColorView": {
 
+      "buffer": "Buffer",
 
+      "byteOffset": 3084,
 
+      "byteLength": 3084,
 
+      "target": 34962,
 
+      "name": "ColorView"
 
+    }
 
+  },
 
+  "images": {},
 
+  "materials": {
 
+    "meshMaterial": {
 
+      "technique": "meshTechnique",
 
+      "values": {},
 
+      "name": "meshMaterial"
 
+    }
 
+  },
 
+  "meshes": {
 
+    "mesh": {
 
+      "primitives": [
 
+        {
 
+          "attributes": {
 
+            "POSITION": "VertexAccessor",
 
+            "COLOR": "ColorAccessor"
 
+          },
 
+          "material": "meshMaterial",
 
+          "mode": 1
 
+        }
 
+      ],
 
+      "name": "mesh"
 
+    }
 
+  },
 
+  "nodes": {
 
+    "node1": {
 
+      "children": [],
 
+      "meshes": [
 
+        "mesh"
 
+      ],
 
+      "name": "node1"
 
+    }
 
+  },
 
+  "programs": {
 
+    "meshProgram": {
 
+      "attributes": [
 
+        "VertexAccessor",
 
+        "ColorAccessor"
 
+      ],
 
+      "fragmentShader": "fragmentShader",
 
+      "vertexShader": "vertexShader",
 
+      "name": "shader"
 
+    }
 
+  },
 
+  "samplers": {},
 
+  "scene": "default scene",
 
+  "scenes": {
 
+    "default scene": {
 
+      "nodes": [
 
+        "node1"
 
+      ],
 
+      "name": "default scene"
 
+    }
 
+  },
 
+  "shaders": {
 
+    "fragmentShader": {
 
+      "uri": "line_frag.glsl",
 
+      "type": 35632,
 
+      "name": "fragmentShader"
 
+    },
 
+    "vertexShader": {
 
+      "uri": "line_vert.glsl",
 
+      "type": 35633,
 
+      "name": "vertexShader"
 
+    }
 
+  },
 
+  "techniques": {
 
+    "meshTechnique": {
 
+      "parameters": {
 
+        "color": {
 
+          "type": 35665,
 
+          "semantic": "color"
 
+        }
 
+      },
 
+      "attributes": {},
 
+      "program": "meshProgram",
 
+      "uniforms": {},
 
+      "states": {
 
+        "enable": [
 
+          3042,
 
+          2929
 
+        ]
 
+      },
 
+      "name": "meshTechnique"
 
+    }
 
+  },
 
+  "textures": {}
 
+}

+ 8 - 0
examples/models/gltf/snowflakes/line_frag.glsl
Wyświetl plik 

@@ -0,0 +1,8 @@
 
+precision highp float;
 
+varying vec3 vertexColor;
 
+
 
+void main(void) {
 
+
 
+	gl_FragColor = vec4(vertexColor.r, vertexColor.g, vertexColor.b, 1.0);;
 
+	
+}

+ 17 - 0
examples/models/gltf/snowflakes/line_vert.glsl
Wyświetl plik 

@@ -0,0 +1,17 @@
 
+precision highp float;
 
+
 
+attribute vec3 position;
 
+attribute vec3 color;
 
+
 
+uniform mat4 modelViewMatrix;
 
+uniform mat4 projectionMatrix;
 
+
 
+varying vec3 vertexColor;
 
+
 
+void main(void) {
 
+
 
+	vec4 pos = modelViewMatrix * vec4(position,1.0);
 
+	vertexColor = vec3(color.x, color.y, color.y);
 
+	gl_Position = projectionMatrix * pos;
 
+	
+}

BIN
examples/models/gltf/snowflakes/snowFlakes.bin
Wyświetl plik


+ 150 - 0
examples/models/gltf/snowflakes/snowFlakes.gltf
Wyświetl plik 

@@ -0,0 +1,150 @@
 
+{
 
+  "accessors": {
 
+    "VertexAccessor": {
 
+      "bufferView": "VertexBuffer",
 
+      "byteOffset": 0,
 
+      "byteStride": 12,
 
+      "componentType": 5126,
 
+      "count": 1376,
 
+      "type": "VEC3",
 
+      "name": "VertexAccessor"
 
+    },
 
+    "TriangleAccessor": {
 
+      "bufferView": "Lines",
 
+      "byteOffset": 0,
 
+      "byteStride": 2,
 
+      "componentType": 5123,
 
+      "count": 2720,
 
+      "type": "SCALAR",
 
+      "name": "TriangleAccessor"
 
+    },
 
+    "ColorAccessor": {
 
+      "bufferView": "ColorView",
 
+      "byteOffset": 0,
 
+      "byteStride": 12,
 
+      "componentType": 5126,
 
+      "count": 1376,
 
+      "type": "VEC3",
 
+      "name": "ColorAccessor"
 
+    }
 
+  },
 
+  "buffers": {
 
+    "Buffer": {
 
+      "uri": "snowFlakes.bin",
 
+      "byteLength": 38464,
 
+      "type": "arraybuffer",
 
+      "name": "Buffer",
 
+      "extensions": {}
 
+    }
 
+  },
 
+  "bufferViews": {
 
+    "VertexBuffer": {
 
+      "buffer": "Buffer",
 
+      "byteOffset": 0,
 
+      "byteLength": 16512,
 
+      "target": 34962,
 
+      "name": "VertexBuffer"
 
+    },
 
+    "Lines": {
 
+      "buffer": "Buffer",
 
+      "byteOffset": 16512,
 
+      "byteLength": 5440,
 
+      "target": 34962,
 
+      "name": "Lines"
 
+    },
 
+    "ColorView": {
 
+      "buffer": "Buffer",
 
+      "byteOffset": 21952,
 
+      "byteLength": 16512,
 
+      "target": 34962,
 
+      "name": "ColorView"
 
+    }
 
+  },
 
+  "images": {},
 
+  "materials": {
 
+    "meshMaterial": {
 
+      "technique": "meshTechnique",
 
+      "values": {},
 
+      "name": "meshMaterial"
 
+    }
 
+  },
 
+  "meshes": {
 
+    "mesh": {
 
+      "primitives": [
 
+        {
 
+          "attributes": {
 
+            "POSITION": "VertexAccessor",
 
+            "COLOR": "ColorAccessor"
 
+          },
 
+          "indices": "TriangleAccessor",
 
+          "material": "meshMaterial",
 
+          "mode": 1
 
+        }
 
+      ],
 
+      "name": "mesh"
 
+    }
 
+  },
 
+  "nodes": {
 
+    "node1": {
 
+      "children": [],
 
+      "meshes": [
 
+        "mesh"
 
+      ],
 
+      "name": "node1"
 
+    }
 
+  },
 
+  "programs": {
 
+    "meshProgram": {
 
+      "attributes": [
 
+        "VertexAccessor",
 
+        "ColorAccessor"
 
+      ],
 
+      "fragmentShader": "fragmentShader",
 
+      "vertexShader": "vertexShader",
 
+      "name": "shader"
 
+    }
 
+  },
 
+  "samplers": {},
 
+  "scene": "default scene",
 
+  "scenes": {
 
+    "default scene": {
 
+      "nodes": [
 
+        "node1"
 
+      ],
 
+      "name": "default scene"
 
+    }
 
+  },
 
+  "shaders": {
 
+    "fragmentShader": {
 
+      "uri": "line_frag.glsl",
 
+      "type": 35632,
 
+      "name": "fragmentShader"
 
+    },
 
+    "vertexShader": {
 
+      "uri": "line_vert.glsl",
 
+      "type": 35633,
 
+      "name": "vertexShader"
 
+    }
 
+  },
 
+  "techniques": {
 
+    "meshTechnique": {
 
+      "parameters": {
 
+        "color": {
 
+          "type": 35665,
 
+          "semantic": "color"
 
+        }
 
+      },
 
+      "attributes": {},
 
+      "program": "meshProgram",
 
+      "uniforms": {},
 
+      "states": {
 
+        "enable": [
 
+          3042,
 
+          2929
 
+        ]
 
+      },
 
+      "name": "meshTechnique"
 
+    }
 
+  },
 
+  "textures": {}
 
+}

+ 106 - 142
examples/webgl_buffergeometry_constructed_from_geometry.html
Wyświetl plik 

@@ -1,58 +1,50 @@
 
 <!DOCTYPE html>
 
 <html lang="en">
 
 	<head>
 
-	<title>three.js - BufferGeometry constructed from Geometry Example</title>
 
-	<meta charset="utf-8">
 
-	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
-	<style>
 
-		body {
 
-			background-color: #000;
 
-			font-family: Monospace;
 
-			margin: 0;
 
-			color: #000;
 
-			overflow: hidden;
 
-		}
 
-		#title {
 
-			position: absolute;
 
-			width: 100%;
 
-			top: 0;
 
-			padding: 0;
 
-			text-align: center;
 
-			font-size: 1.1em;
 
-			background-color: rgba(64,96,64,0.7);
 
-			color: #fff;
 
-		}
 
-		#title a {color:#ff0;}
 
-	</style>
 
-	<script type="text/javascript" src="../build/three.js"></script>
 
-	<script type="text/javascript" src="js/Detector.js"></script>
 
-	<script type="text/javascript" src="js/libs/stats.min.js"></script>
 
-	<script type="text/javascript" src="js/controls/TrackballControls.js"></script>
 
+		<title>three.js webgl - buffer geometry constructed from geometry</title>
 
+		<meta charset="utf-8">
 
+		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
+		<style>
 
+			body {
 
+				color: #ffffff;
 
+				background-color: #000000;
 
+				margin: 0px;
 
+				overflow: hidden;
 
+			}
 
+			#info {
 
+				position: absolute;
 
+				top: 0px;
 
+				width: 100%;
 
+				padding: 5px;
 
+				font-family: Monospace;
 
+				font-size: 13px;
 
+				text-align: center;
 
+			}
 
+			a {
 
+				color: #0080ff;
 
+			}
 
+		</style>
 
+		<script type="text/javascript" src="../build/three.js"></script>
 
+		<script type="text/javascript" src="js/Detector.js"></script>
 
+		<script type="text/javascript" src="js/libs/stats.min.js"></script>
 
+		<script type="text/javascript" src="js/controls/TrackballControls.js"></script>
 
 	</head>
 
-	<body onload="app()">
 
-		<div id="title"></div>
 
+	<body>
 
+		<div id="info"><a href="http://threejs.org" target="_blank">three.js</a> webgl - buffer geometry constructed from geometry - (<a target="_blank" href="http://callum.com">author</a>)</div>
 
 		<script>
 
-		var camera, scene, renderer, controls, stats;
 
-
 
-		function app() {
 
 
-			if ( ! Detector.webgl ) {
 
+		if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 
-				Detector.addGetWebGLMessage();
 
-
 
-			}
 
-
 
-			init();
 
-			animate();
 
+		var camera, scene, renderer, controls, stats;
 
 
-		}
 
+		init();
 
+		animate();
 
 
 		function init() {
 
 
 			renderer = new THREE.WebGLRenderer( {
 
 				antialias: true
 
 			} );
 
-			renderer.setClearColor( 0x000000, 0.0 );
 
 			renderer.setPixelRatio( window.devicePixelRatio );
 
 			renderer.setSize( window.innerWidth, window.innerHeight );
 
 
@@ -89,16 +81,17 @@
 
 
 		function createGeometry() {
 
 
-			var heart_shape = new THREE.Shape(); // From http://blog.burlock.org/html5/130-paths
 
-			var x = 0,
 
-				y = 0;
 
-			heart_shape.moveTo( x + 25, y + 25 );
 
-			heart_shape.bezierCurveTo( x + 25, y + 25, x + 20, y, x, y );
 
-			heart_shape.bezierCurveTo( x - 30, y, x - 30, y + 35, x - 30, y + 35 );
 
-			heart_shape.bezierCurveTo( x - 30, y + 55, x - 10, y + 77, x + 25, y + 95 );
 
-			heart_shape.bezierCurveTo( x + 60, y + 77, x + 80, y + 55, x + 80, y + 35 );
 
-			heart_shape.bezierCurveTo( x + 80, y + 35, x + 80, y, x + 50, y );
 
-			heart_shape.bezierCurveTo( x + 35, y, x + 25, y + 25, x + 25, y + 25 );
 
+			var heartShape = new THREE.Shape(); // From http://blog.burlock.org/html5/130-paths
 
+			var x = 0, y = 0;
 
+
 
+			heartShape.moveTo( x + 25, y + 25 );
 
+			heartShape.bezierCurveTo( x + 25, y + 25, x + 20, y, x, y );
 
+			heartShape.bezierCurveTo( x - 30, y, x - 30, y + 35, x - 30, y + 35 );
 
+			heartShape.bezierCurveTo( x - 30, y + 55, x - 10, y + 77, x + 25, y + 95 );
 
+			heartShape.bezierCurveTo( x + 60, y + 77, x + 80, y + 55, x + 80, y + 35 );
 
+			heartShape.bezierCurveTo( x + 80, y + 35, x + 80, y, x + 50, y );
 
+			heartShape.bezierCurveTo( x + 35, y, x + 25, y + 25, x + 25, y + 25 );
 
+
 
 			var extrudeSettings = {
 
 				amount: 16,
 
 				bevelEnabled: true,
 
@@ -107,122 +100,92 @@
 
 				bevelSize: 1,
 
 				bevelThickness: 1
 
 			};
 
-			var geom = new THREE.ExtrudeGeometry( heart_shape, extrudeSettings );
 
-			geom.rotateX( - Math.PI / 2 );
 
-			geom.scale( 0.4, 0.4, 0.4 );
 
-			return geom;
 
-
 
-		}
 
-
 
-		function createScene() {
 
-
 
-			var buffer_geometry = new THREE.BufferGeometry();
 
-			var radius = 100.0;
 
-			var positions = 0;
 
-			var normals = 0;
 
-			var colors = 0;
 
-			var shape_density = 14;
 
 
-			for ( var num_lat = 0; num_lat < shape_density / 2; ++ num_lat ) {
 
+			var geometry = new THREE.ExtrudeGeometry( heartShape, extrudeSettings );
 
+			geometry.rotateX( Math.PI );
 
+			geometry.scale( 0.4, 0.4, 0.4 );
 
 
-				var lat_lhs = ( num_lat + 0 ) * 180 / ( shape_density / 2 );
 
-				var lat_rhs = ( num_lat + 1 ) * 180 / ( shape_density / 2 );
 
-				var lat = ( lat_lhs + lat_rhs ) / 2.0;
 
+			return geometry;
 
 
-				for ( var num_lng = 0; num_lng < shape_density; ++ num_lng ) {
 
-
 
-					var lng_lhs = ( num_lng + 0 ) * 360 / shape_density;
 
-					var lng_rhs = ( num_lng + 1 ) * 360 / shape_density;
 
-					var lng = ( lng_lhs + lng_rhs ) / 2.0;
 
-
 
-					var height = 30.0;
 
+		}
 
 
-					var phi = lat * Math.PI / 180.0;
 
-					var theta = lng * Math.PI / 180.0;
 
-					var x = radius * Math.sin( phi ) * Math.cos( theta );
 
-					var y = radius * Math.cos( phi );
 
-					var z = radius * Math.sin( phi ) * Math.sin( theta );
 
+		function createScene() {
 
 
-					var geometry = createGeometry();
 
+			var bufferGeometry = new THREE.BufferGeometry();
 
 
-					geometry.translate( 0, height / 2, 0 );
 
-					geometry.rotateX( - Math.PI / 2 );
 
-					geometry.lookAt( new THREE.Vector3( - x, - y, - z ) );
 
-					geometry.translate( x, y, z );
 
+			var radius = 125;
 
+			var count = 80;
 
 
-					var color = new THREE.Color( 0xffffff );
 
-					color.setHSL( lat / 180.0, 1.0, 0.7 );
 
+			var positions = [];
 
+			var normals = [];
 
+			var colors = [];
 
 
-					if ( positions === 0 ) {
 
+			var spherical = new THREE.Spherical();
 
+			var vector = new THREE.Vector3();
 
 
-						var num_stacks = shape_density * shape_density / 2;
 
+			for ( var i = 1, l = count; i <= l; i ++ ) {
 
 
-						var str = 'BufferGeometry constructed from Geometry Example - ' + parseInt( num_stacks * geometry.faces.length, 10 ) + ' triangles (<a target="_blank" href="http://callum.com">author</a>)';
 
-						document.getElementById( 'title' ).innerHTML = str.replace( /\B(?=(\d{3})+(?!\d))/g, "," );
 
+				var phi = Math.acos( -1 + ( 2 * i ) / l );
 
+				var theta = Math.sqrt( l * Math.PI ) * phi;
 
 
-						positions = new Float32Array( num_stacks * geometry.faces.length * 3 * 3 );
 
-						normals = new Float32Array( num_stacks * geometry.faces.length * 3 * 3 );
 
-						colors = new Float32Array( num_stacks * geometry.faces.length * 3 * 3 );
 
+				spherical.set( radius, phi, theta );
 
+				vector.setFromSpherical( spherical );
 
 
-					}
 
+				var geometry = createGeometry();
 
 
-					geometry.faces.forEach( function ( face, index ) {
 
+				geometry.lookAt( vector );
 
+				geometry.translate( vector.x, vector.y, vector.z );
 
 
-						var cur_element = ( ( num_lng + num_lat * shape_density ) * geometry.faces.length + index );
 
+				var color = new THREE.Color( 0xffffff );
 
+				color.setHSL( ( i / l ), 1.0, 0.7 );
 
 
-						positions[ cur_element * 9 + 0 ] = geometry.vertices[ face.a ].x;
 
-						positions[ cur_element * 9 + 1 ] = geometry.vertices[ face.a ].y;
 
-						positions[ cur_element * 9 + 2 ] = geometry.vertices[ face.a ].z;
 
-						positions[ cur_element * 9 + 3 ] = geometry.vertices[ face.b ].x;
 
-						positions[ cur_element * 9 + 4 ] = geometry.vertices[ face.b ].y;
 
-						positions[ cur_element * 9 + 5 ] = geometry.vertices[ face.b ].z;
 
-						positions[ cur_element * 9 + 6 ] = geometry.vertices[ face.c ].x;
 
-						positions[ cur_element * 9 + 7 ] = geometry.vertices[ face.c ].y;
 
-						positions[ cur_element * 9 + 8 ] = geometry.vertices[ face.c ].z;
 
+				geometry.faces.forEach( function ( face, index ) {
 
 
-						normals[ cur_element * 9 + 0 ] = face.normal.x;
 
-						normals[ cur_element * 9 + 1 ] = face.normal.y;
 
-						normals[ cur_element * 9 + 2 ] = face.normal.z;
 
-						normals[ cur_element * 9 + 3 ] = face.normal.x;
 
-						normals[ cur_element * 9 + 4 ] = face.normal.y;
 
-						normals[ cur_element * 9 + 5 ] = face.normal.z;
 
-						normals[ cur_element * 9 + 6 ] = face.normal.x;
 
-						normals[ cur_element * 9 + 7 ] = face.normal.y;
 
-						normals[ cur_element * 9 + 8 ] = face.normal.z;
 
+					positions.push( geometry.vertices[ face.a ].x );
 
+					positions.push( geometry.vertices[ face.a ].y );
 
+					positions.push( geometry.vertices[ face.a ].z );
 
+					positions.push( geometry.vertices[ face.b ].x );
 
+					positions.push( geometry.vertices[ face.b ].y );
 
+					positions.push( geometry.vertices[ face.b ].z );
 
+					positions.push( geometry.vertices[ face.c ].x );
 
+					positions.push( geometry.vertices[ face.c ].y );
 
+					positions.push( geometry.vertices[ face.c ].z );
 
 
-						colors[ cur_element * 9 + 0 ] = color.r;
 
-						colors[ cur_element * 9 + 1 ] = color.g;
 
-						colors[ cur_element * 9 + 2 ] = color.b;
 
-						colors[ cur_element * 9 + 3 ] = color.r;
 
-						colors[ cur_element * 9 + 4 ] = color.g;
 
-						colors[ cur_element * 9 + 5 ] = color.b;
 
-						colors[ cur_element * 9 + 6 ] = color.r;
 
-						colors[ cur_element * 9 + 7 ] = color.g;
 
-						colors[ cur_element * 9 + 8 ] = color.b;
 
+					normals.push( face.normal.x );
 
+					normals.push( face.normal.y );
 
+					normals.push( face.normal.z );
 
+					normals.push( face.normal.x );
 
+					normals.push( face.normal.y );
 
+					normals.push( face.normal.z );
 
+					normals.push( face.normal.x );
 
+					normals.push( face.normal.y );
 
+					normals.push( face.normal.z );
 
 
-					} );
 
+					colors.push( color.r );
 
+					colors.push( color.g );
 
+					colors.push( color.b );
 
+					colors.push( color.r );
 
+					colors.push( color.g );
 
+					colors.push( color.b );
 
+					colors.push( color.r );
 
+					colors.push( color.g );
 
+					colors.push( color.b );
 
 
-				}
 
+				} );
 
 
 			}
 
 
-			buffer_geometry.addAttribute( 'position', new THREE.BufferAttribute( positions, 3 ) );
 
-			buffer_geometry.addAttribute( 'normal', new THREE.BufferAttribute( normals, 3 ) );
 
-			buffer_geometry.addAttribute( 'color', new THREE.BufferAttribute( colors, 3 ) );
 
-
 
-			buffer_geometry.computeBoundingSphere();
 
+			bufferGeometry.addAttribute( 'position', new THREE.Float32BufferAttribute( positions, 3 ) );
 
+			bufferGeometry.addAttribute( 'normal', new THREE.Float32BufferAttribute( normals, 3 ) );
 
+			bufferGeometry.addAttribute( 'color', new THREE.Float32BufferAttribute( colors, 3 ) );
 
 
-			var buffer_material = new THREE.MeshPhongMaterial( {
 
-				color: 0x999999,
 
-				specular: 0x333333,
 
-				shininess: 50,
 
-				side: THREE.DoubleSide,
 
-				vertexColors: THREE.VertexColors,
 
-				shading: THREE.SmoothShading
 
+			var material = new THREE.MeshPhongMaterial( {
 
+				shininess: 80,
 
+				vertexColors: THREE.VertexColors
 
 			} );
 
 
-			var buffer_mesh = new THREE.Mesh( buffer_geometry, buffer_material );
 
-			scene.add( buffer_mesh );
 
+			var mesh = new THREE.Mesh( bufferGeometry, material );
 
+			scene.add( mesh );
 
 
 		}
 
 
@@ -237,6 +200,7 @@
 
 		function animate( time ) {
 
 
 			requestAnimationFrame( animate );
 
+
 
 			controls.update();
 
 			stats.update();
 
 			renderer.render( scene, camera );

+ 20 - 1
examples/webgl_loader_gltf.html
Wyświetl plik 

@@ -94,7 +94,7 @@
 
 		<a href="https://github.com/KhronosGroup/glTF" target="_blank">glTF</a> loader -
 
 		<br>
 
 		monster by <a href="http://www.3drt.com/downloads.htm" target="_blank">3drt</a> -
 
-		COLLADA duck by Sony - other models courtesy <a href="http://cesiumjs.org/" target="_blank">Cesium</a>
 
+		COLLADA duck by Sony - Cesium models courtesy <a href="http://cesiumjs.org/" target="_blank">Cesium</a>
 
 		</div>
 
 	<div id="container">
 
 	</div>
 
@@ -429,6 +429,25 @@
 
 					addLights:true,
 
 					addGround:true,
 
 					shadows:true
 
+				},
 
+				{
 
+					name : "Snowflake",
 
+					url : "./models/gltf/snowflake/snowFlake.gltf",
 
+					objectScale: new THREE.Vector3(4, 4, 1),
 
+					cameraPos: new THREE.Vector3(0, 100, 5000),
 
+					objectPosition: new THREE.Vector3(0, 0, 0),
 
+					addLights:false,
 
+					addGround:false,
 
+					shadows:false
 
+				},
 
+				{
 
+					name : "Snowflakes",
 
+					url : "./models/gltf/snowflakes/snowFlakes.gltf",
 
+					cameraPos: new THREE.Vector3(0, 100, 5000),
 
+					objectPosition: new THREE.Vector3(-1200, -1200, 0),
 
+					addLights:false,
 
+					addGround:false,
 
+					shadows:false
 
 				}
 
 			];

+ 12 - 0
src/Three.Legacy.js
Wyświetl plik 

@@ -217,6 +217,18 @@ export function ClosedSplineCurve3( points ) {
 
 
 ClosedSplineCurve3.prototype = Object.create( CatmullRomCurve3.prototype );
 
 
+//
 
+
 
+export function SplineCurve3( points ) {
 
+
 
+	console.warn( 'THREE.SplineCurve3 has been deprecated. Use THREE.CatmullRomCurve3 instead.' );
 
+
 
+	CatmullRomCurve3.call( this, points );
 
+	this.type = 'catmullrom';
 
+
 
+}
 
+
 
+SplineCurve3.prototype = Object.create( CatmullRomCurve3.prototype );
 
 
 //
 
 export function BoundingBoxHelper( object, color ) {

+ 0 - 1
src/Three.js
Wyświetl plik 

@@ -136,7 +136,6 @@ export { BoxHelper } from './extras/helpers/BoxHelper.js';
 
 export { ArrowHelper } from './extras/helpers/ArrowHelper.js';
 
 export { AxisHelper } from './extras/helpers/AxisHelper.js';
 
 export { CatmullRomCurve3 } from './extras/curves/CatmullRomCurve3.js';
 
-export { SplineCurve3 } from './extras/curves/SplineCurve3.js';
 
 export { CubicBezierCurve3 } from './extras/curves/CubicBezierCurve3.js';
 
 export { QuadraticBezierCurve3 } from './extras/curves/QuadraticBezierCurve3.js';
 
 export { LineCurve3 } from './extras/curves/LineCurve3.js';

+ 1 - 1
src/extras/core/Curve.js
Wyświetl plik 

@@ -27,7 +27,7 @@ import { Matrix4 } from '../../math/Matrix4';
 
  * THREE.LineCurve3
 
  * THREE.QuadraticBezierCurve3
 
  * THREE.CubicBezierCurve3
 
- * THREE.SplineCurve3
 
+ * THREE.CatmullRomCurve3
 
  *
 
  * A series of curves can be represented as a THREE.CurvePath
 
  *

+ 0 - 45
src/extras/curves/SplineCurve3.js
Wyświetl plik 

@@ -1,45 +0,0 @@
 
-import { Vector3 } from '../../math/Vector3';
 
-import { CurveUtils } from '../CurveUtils';
 
-import { Curve } from '../core/Curve';
 
-
 
-/**************************************************************
 
- *	Spline 3D curve
 
- **************************************************************/
 
-
 
-
 
-var SplineCurve3 = Curve.create(
 
-
 
-	function ( points /* array of Vector3 */ ) {
 
-
 
-		console.warn( 'THREE.SplineCurve3 will be deprecated. Please use THREE.CatmullRomCurve3' );
 
-		this.points = ( points === undefined ) ? [] : points;
 
-
 
-	},
 
-
 
-	function ( t ) {
 
-
 
-		var points = this.points;
 
-		var point = ( points.length - 1 ) * t;
 
-
 
-		var intPoint = Math.floor( point );
 
-		var weight = point - intPoint;
 
-
 
-		var point0 = points[ intPoint == 0 ? intPoint : intPoint - 1 ];
 
-		var point1 = points[ intPoint ];
 
-		var point2 = points[ intPoint > points.length - 2 ? points.length - 1 : intPoint + 1 ];
 
-		var point3 = points[ intPoint > points.length - 3 ? points.length - 1 : intPoint + 2 ];
 
-
 
-		var interpolate = CurveUtils.interpolate;
 
-
 
-		return new Vector3(
 
-			interpolate( point0.x, point1.x, point2.x, point3.x, weight ),
 
-			interpolate( point0.y, point1.y, point2.y, point3.y, weight ),
 
-			interpolate( point0.z, point1.z, point2.z, point3.z, weight )
 
-		);
 
-
 
-	}
 
-
 
-);
 
-
 
-
 
-export { SplineCurve3 };

+ 25 - 29
src/objects/Mesh.js
Wyświetl plik 

@@ -143,23 +143,23 @@ Mesh.prototype = Object.assign( Object.create( Object3D.prototype ), {
 
 
 		}
 
 
-		function checkBufferGeometryIntersection( object, raycaster, ray, positions, uvs, a, b, c ) {
 
+		function checkBufferGeometryIntersection( object, raycaster, ray, position, uv, a, b, c ) {
 
 
-			vA.fromArray( positions, a * 3 );
 
-			vB.fromArray( positions, b * 3 );
 
-			vC.fromArray( positions, c * 3 );
 
+			vA.fromAttribute( position, a );
 
+			vB.fromAttribute( position, b );
 
+			vC.fromAttribute( position, c );
 
 
 			var intersection = checkIntersection( object, raycaster, ray, vA, vB, vC, intersectionPoint );
 
 
 			if ( intersection ) {
 
 
-				if ( uvs ) {
 
+				if ( uv ) {
 
 
-					uvA.fromArray( uvs, a * 2 );
 
-					uvB.fromArray( uvs, b * 2 );
 
-					uvC.fromArray( uvs, c * 2 );
 
+					uvA.fromAttribute( uv, a );
 
+					uvB.fromAttribute( uv, b );
 
+					uvC.fromAttribute( uv, c );
 
 
-					intersection.uv = uvIntersection( intersectionPoint,  vA, vB, vC,  uvA, uvB, uvC );
 
+					intersection.uv = uvIntersection( intersectionPoint,  vA, vB, vC, uvA, uvB, uvC );
 
 
 				}
 
 
@@ -202,32 +202,27 @@ Mesh.prototype = Object.assign( Object.create( Object3D.prototype ), {
 
 
 			}
 
 
-			var uvs, intersection;
 
+			var intersection;
 
 
 			if ( geometry.isBufferGeometry ) {
 
 
 				var a, b, c;
 
 				var index = geometry.index;
 
-				var attributes = geometry.attributes;
 
-				var positions = attributes.position.array;
 
-
 
-				if ( attributes.uv !== undefined ) {
 
-
 
-					uvs = attributes.uv.array;
 
-
 
-				}
 
+				var position = geometry.attributes.position;
 
+				var uv = geometry.attributes.uv;
 
+				var i, l;
 
 
 				if ( index !== null ) {
 
 
-					var indices = index.array;
 
+					// indexed buffer geometry
 
 
-					for ( var i = 0, l = indices.length; i < l; i += 3 ) {
 
+					for ( i = 0, l = index.count; i < l; i += 3 ) {
 
 
-						a = indices[ i ];
 
-						b = indices[ i + 1 ];
 
-						c = indices[ i + 2 ];
 
+						a = index.getX( i );
 
+						b = index.getX( i + 1 );
 
+						c = index.getX( i + 2 );
 
 
-						intersection = checkBufferGeometryIntersection( this, raycaster, ray, positions, uvs, a, b, c );
 
+						intersection = checkBufferGeometryIntersection( this, raycaster, ray, position, uv, a, b, c );
 
 
 						if ( intersection ) {
 
 
@@ -240,14 +235,15 @@ Mesh.prototype = Object.assign( Object.create( Object3D.prototype ), {
 
 
 				} else {
 
 
+					// non-indexed buffer geometry
 
 
-					for ( var i = 0, l = positions.length; i < l; i += 9 ) {
 
+					for ( i = 0, l = position.count; i < l; i += 3 ) {
 
 
-						a = i / 3;
 
-						b = a + 1;
 
-						c = a + 2;
 
+						a = i;
 
+						b = i + 1;
 
+						c = i + 2;
 
 
-						intersection = checkBufferGeometryIntersection( this, raycaster, ray, positions, uvs, a, b, c );
 
+						intersection = checkBufferGeometryIntersection( this, raycaster, ray, position, uv, a, b, c );
 
 
 						if ( intersection ) {

+ 0 - 56
test/unit/extras/curves/ClosedSplineCurve3.js
Wyświetl plik 

@@ -1,56 +0,0 @@
 
-/**
 
- * @author zz85 / http://joshuakoo.com
 
- */
 
-
 
-module( "ClosedSplineCurve3" );
 
-
 
-var threshold = 0.000001;
 
-
 
-function vectorsAreEqual( check, that ) {
 
-
 
-	if ( check.length !== that.length ) return 'Length not equal';
 
-
 
-	for ( var i = 0; i < check.length; i ++ ) {
 
-
 
-		var a = check[ i ], b = that[ i ];
 
-		if ( a.distanceToSquared( b ) > threshold ) {
 
-
 
-			return 'Vector differs at index ' + i +
 
-				'. Should be ' + [ a.x, a.y, a.z ] +
 
-				' instead of ' + [ b.x, b.y, b.z ];
 
-		}
 
-	}
 
-
 
-}
 
-
 
-test( "basic check", function() {
 
-
 
-	var closedSpline = new THREE.ClosedSplineCurve3( [
 
-		new THREE.Vector3( -60, -100,  60 ),
 
-		new THREE.Vector3( -60,   20,  60 ),
 
-		new THREE.Vector3( -60,  120,  60 ),
 
-		new THREE.Vector3(  60,   20, -60 ),
 
-		new THREE.Vector3(  60, -100, -60 )
 
-	] );
 
-
 
-	var closedSplinePoints = [
 
-		new THREE.Vector3(-60,-100,60),
 
-		new THREE.Vector3(-67.5,-46.25,67.5),
 
-		new THREE.Vector3(-60,20,60),
 
-		new THREE.Vector3(-67.5,83.75,67.5),
 
-		new THREE.Vector3(-60,120,60),
 
-		new THREE.Vector3(0,83.75,0),
 
-		new THREE.Vector3(60,20,-60),
 
-		new THREE.Vector3(75,-46.25,-75),
 
-		new THREE.Vector3(60,-100,-60),
 
-		new THREE.Vector3(0,-115,0),
 
-		new THREE.Vector3(-60,-100,60),
 
-	];
 
-
 
-	var getPoints = closedSpline.getPoints(10);
 
-	var error = vectorsAreEqual( getPoints , closedSplinePoints );
 
-	ok( getPoints.length == 11, 'getPoints should be equal.');
 
-	var desc = error ? ' ' + error : '';
 
-	ok( !error, 'Lists of Vectors3 should be equal.' + desc );
 
-
 
-});

+ 0 - 2
test/unit/unittests_sources.html
Wyświetl plik 

@@ -36,7 +36,6 @@
 
   <script src="../../src/extras/core/Curve.js"></script>
 
   <script src="../../src/extras/CurveUtils.js"></script>
 
   <script src="../../src/extras/curves/CatmullRomCurve3.js"></script>
 
-  <script src="../../src/extras/curves/ClosedSplineCurve3.js"></script>
 
 
   <!-- add class-based unit tests below -->
 
 
@@ -60,7 +59,6 @@
 
   <script src="math/Color.js"></script>
 
   <script src="math/Interpolant.js"></script>
 
 
-  <script src="extras/curves/ClosedSplineCurve3.js"></script>
 
   <script src="extras/curves/CatmullRomCurve3.js"></script>
 
 
 </body>