-this.program=void 0};Object.defineProperties(this,{uniforms:{get:function(){console.warn("THREE.WebGLProgram: .uniforms is now .getUniforms().");return this.getUniforms()}},attributes:{get:function(){console.warn("THREE.WebGLProgram: .attributes is now .getAttributes().");return this.getAttributes()}}});this.id=rg++;this.code=c;this.usedTimes=1;this.program=p;this.vertexShader=l;this.fragmentShader=m;return this}function sg(a,b,c){function d(a,b){if(a)a.isTexture?c=a.encoding:a.isWebGLRenderTarget&&
+this.program=void 0};Object.defineProperties(this,{uniforms:{get:function(){console.warn("THREE.WebGLProgram: .uniforms is now .getUniforms().");return this.getUniforms()}},attributes:{get:function(){console.warn("THREE.WebGLProgram: .attributes is now .getAttributes().");return this.getAttributes()}}});this.name=e.name;this.id=rg++;this.code=c;this.usedTimes=1;this.program=p;this.vertexShader=l;this.fragmentShader=m;return this}function sg(a,b,c){function d(a,b){if(a)a.isTexture?c=a.encoding:a.isWebGLRenderTarget&&
(console.warn("THREE.WebGLPrograms.getTextureEncodingFromMap: don't use render targets as textures. Use their .texture property instead."),c=a.texture.encoding);else var c=3E3;3E3===c&&b&&(c=3007);return c}var e=[],f={MeshDepthMaterial:"depth",MeshDistanceMaterial:"distanceRGBA",MeshNormalMaterial:"normal",MeshBasicMaterial:"basic",MeshLambertMaterial:"lambert",MeshPhongMaterial:"phong",MeshToonMaterial:"phong",MeshStandardMaterial:"physical",MeshPhysicalMaterial:"physical",LineBasicMaterial:"basic",
(console.warn("THREE.WebGLPrograms.getTextureEncodingFromMap: don't use render targets as textures. Use their .texture property instead."),c=a.texture.encoding);else var c=3E3;3E3===c&&b&&(c=3007);return c}var e=[],f={MeshDepthMaterial:"depth",MeshDistanceMaterial:"distanceRGBA",MeshNormalMaterial:"normal",MeshBasicMaterial:"basic",MeshLambertMaterial:"lambert",MeshPhongMaterial:"phong",MeshToonMaterial:"phong",MeshStandardMaterial:"physical",MeshPhysicalMaterial:"physical",LineBasicMaterial:"basic",
a.lineDistancesNeedUpdate;this.groupsNeedUpdate=a.groupsNeedUpdate;return this},dispose:function(){this.dispatchEvent({type:"dispose"})}});Object.defineProperty(H.prototype,"needsUpdate",{set:function(a){!0===a&&this.version++}});Object.assign(H.prototype,{isBufferAttribute:!0,onUploadCallback:function(){},setArray:function(a){if(Array.isArray(a))throw new TypeError("THREE.BufferAttribute: array should be a Typed Array.");this.count=void 0!==a?a.length/this.itemSize:0;this.array=a},setDynamic:function(a){this.dynamic=
a.lineDistancesNeedUpdate;this.groupsNeedUpdate=a.groupsNeedUpdate;return this},dispose:function(){this.dispatchEvent({type:"dispose"})}});Object.defineProperty(H.prototype,"needsUpdate",{set:function(a){!0===a&&this.version++}});Object.assign(H.prototype,{isBufferAttribute:!0,onUploadCallback:function(){},setArray:function(a){if(Array.isArray(a))throw new TypeError("THREE.BufferAttribute: array should be a Typed Array.");this.count=void 0!==a?a.length/this.itemSize:0;this.array=a},setDynamic:function(a){this.dynamic=
-a;return this},copy:function(a){this.array=new a.array.constructor(a.array);this.itemSize=a.itemSize;this.count=a.count;this.normalized=a.normalized;this.dynamic=a.dynamic;return this},copyAt:function(a,b,c){a*=this.itemSize;c*=b.itemSize;for(var d=0,e=this.itemSize;d<e;d++)this.array[a+d]=b.array[c+d];return this},copyArray:function(a){this.array.set(a);return this},copyColorsArray:function(a){for(var b=this.array,c=0,d=0,e=a.length;d<e;d++){var f=a[d];void 0===f&&(console.warn("THREE.BufferAttribute.copyColorsArray(): color is undefined",
+a;return this},copy:function(a){this.name=a.name;this.array=new a.array.constructor(a.array);this.itemSize=a.itemSize;this.count=a.count;this.normalized=a.normalized;this.dynamic=a.dynamic;return this},copyAt:function(a,b,c){a*=this.itemSize;c*=b.itemSize;for(var d=0,e=this.itemSize;d<e;d++)this.array[a+d]=b.array[c+d];return this},copyArray:function(a){this.array.set(a);return this},copyColorsArray:function(a){for(var b=this.array,c=0,d=0,e=a.length;d<e;d++){var f=a[d];void 0===f&&(console.warn("THREE.BufferAttribute.copyColorsArray(): color is undefined",
d),f=new L);b[c++]=f.r;b[c++]=f.g;b[c++]=f.b}return this},copyVector2sArray:function(a){for(var b=this.array,c=0,d=0,e=a.length;d<e;d++){var f=a[d];void 0===f&&(console.warn("THREE.BufferAttribute.copyVector2sArray(): vector is undefined",d),f=new A);b[c++]=f.x;b[c++]=f.y}return this},copyVector3sArray:function(a){for(var b=this.array,c=0,d=0,e=a.length;d<e;d++){var f=a[d];void 0===f&&(console.warn("THREE.BufferAttribute.copyVector3sArray(): vector is undefined",d),f=new p);b[c++]=f.x;b[c++]=f.y;
d),f=new L);b[c++]=f.r;b[c++]=f.g;b[c++]=f.b}return this},copyVector2sArray:function(a){for(var b=this.array,c=0,d=0,e=a.length;d<e;d++){var f=a[d];void 0===f&&(console.warn("THREE.BufferAttribute.copyVector2sArray(): vector is undefined",d),f=new A);b[c++]=f.x;b[c++]=f.y}return this},copyVector3sArray:function(a){for(var b=this.array,c=0,d=0,e=a.length;d<e;d++){var f=a[d];void 0===f&&(console.warn("THREE.BufferAttribute.copyVector3sArray(): vector is undefined",d),f=new p);b[c++]=f.x;b[c++]=f.y;
Blending destination. Default is [page:CustomBlendingEquation OneMinusSrcAlphaFactor].
Blending destination. Default is [page:CustomBlendingEquation OneMinusSrcAlphaFactor].
See the destination factors [page:CustomBlendingEquation constants] for all possible values.<br />
See the destination factors [page:CustomBlendingEquation constants] for all possible values.<br />
- The material's [property:Constant blending] must be set to [page:Materials CustomBlending] for this to have any effect.
+ The material's [page:Constant blending] must be set to [page:Materials CustomBlending] for this to have any effect.
</p>
</p>
<h3>[property:Integer blendDstAlpha]</h3>
<h3>[property:Integer blendDstAlpha]</h3>
@@ -51,7 +51,7 @@
<p>
<p>
Blending equation to use when applying blending. Default is [page:CustomBlendingEquation AddEquation].
Blending equation to use when applying blending. Default is [page:CustomBlendingEquation AddEquation].
See the blending equation [page:CustomBlendingEquation constants] for all possible values.<br />
See the blending equation [page:CustomBlendingEquation constants] for all possible values.<br />
- The material's [property:Constant blending] must be set to [page:Materials CustomBlending] for this to have any effect.
+ The material's [page:Constant blending] must be set to [page:Materials CustomBlending] for this to have any effect.
</p>
</p>
<h3>[property:Integer blendEquationAlpha]</h3>
<h3>[property:Integer blendEquationAlpha]</h3>
@@ -60,7 +60,7 @@
<h3>[property:Blending blending]</h3>
<h3>[property:Blending blending]</h3>
<p>
<p>
Which blending to use when displaying objects with this material. <br />
Which blending to use when displaying objects with this material. <br />
- This must be set to [page:Materials CustomBlending] to use custom [property:Constant blendSrc], [property:Constant blendDst] or [property:Constant blendEquation].<br />
+ This must be set to [page:Materials CustomBlending] to use custom [page:Constant blendSrc], [page:Constant blendDst] or [page:Constant blendEquation].<br />
See the blending mode [page:Materials constants] for all possible values. Default is [page:Materials NormalBlending].
See the blending mode [page:Materials constants] for all possible values. Default is [page:Materials NormalBlending].
</p>
</p>
@@ -68,7 +68,7 @@
<p>
<p>
Blending source. Default is [page:CustomBlendingEquation SrcAlphaFactor].
Blending source. Default is [page:CustomBlendingEquation SrcAlphaFactor].
See the source factors [page:CustomBlendingEquation constants] for all possible values.<br />
See the source factors [page:CustomBlendingEquation constants] for all possible values.<br />
- The material's [property:Constant blending] must be set to [page:Materials CustomBlending] for this to have any effect.
+ The material's [page:Constant blending] must be set to [page:Materials CustomBlending] for this to have any effect.
</p>
</p>
<h3>[property:Integer blendSrcAlpha]</h3>
<h3>[property:Integer blendSrcAlpha]</h3>
@@ -98,7 +98,7 @@
<h3>[property:Boolean colorWrite]</h3>
<h3>[property:Boolean colorWrite]</h3>
<p>
<p>
Whether to render the material's color.
Whether to render the material's color.
- This can be used in conjunction with a mesh's [property:Integer renderOrder] property to create invisible objects that occlude other objects. Default is *true*.
+ This can be used in conjunction with a mesh's [page:Integer renderOrder] property to create invisible objects that occlude other objects. Default is *true*.
</p>
</p>
<h3>[property:Material customDepthMaterial]</h3>
<h3>[property:Material customDepthMaterial]</h3>
@@ -171,7 +171,7 @@
<p>
<p>
Float in the range of *0.0* - *1.0* indicating how transparent the material is.
Float in the range of *0.0* - *1.0* indicating how transparent the material is.
A value of *0.0* indicates fully transparent, *1.0* is fully opaque.<br />
A value of *0.0* indicates fully transparent, *1.0* is fully opaque.<br />
- If the material's [property:Boolean transparent] property is not set to *true*, the material will remain
+ If the material's [page:Boolean transparent] property is not set to *true*, the material will remain
fully opaque and this value will only affect its color. <br />
fully opaque and this value will only affect its color. <br />
Default is *1.0*.
Default is *1.0*.
</p>
</p>
@@ -259,7 +259,7 @@
as transparent objects need special treatment and are rendered after
as transparent objects need special treatment and are rendered after
non-transparent objects. <br />
non-transparent objects. <br />
When set to true, the extent to which the material is transparent is
When set to true, the extent to which the material is transparent is
- controlled by setting it's [property:Float opacity] property. <br />
+ controlled by setting it's [page:Float opacity] property. <br />
[page:Color_Hex_or_String r] - (optional) If arguments [page:Float g] and [page:Float b] are defined, the red component of the color.
[page:Color_Hex_or_String r] - (optional) If arguments [page:Float g] and [page:Float b] are defined, the red component of the color.
If they are not defined, it can be a [link:https://en.wikipedia.org/wiki/Web_colors#Hex_triplet hexadecimal triplet] (recommended), a CSS-style string, or another Color instance.<br />
If they are not defined, it can be a [link:https://en.wikipedia.org/wiki/Web_colors#Hex_triplet hexadecimal triplet] (recommended), a CSS-style string, or another Color instance.<br />
[page:Float g] - (optional) If it is defined, the green component of the color.<br />
[page:Float g] - (optional) If it is defined, the green component of the color.<br />
@@ -71,31 +71,31 @@ var color = new THREE.Color( 1, 0, 0 );
</li>
</li>
</ul>
</ul>
- </div>
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:Boolean isColor]</h3>
<h3>[property:Boolean isColor]</h3>
- <div>
+ <p>
Used to check whether this or derived classes are Colors. Default is *true*.<br /><br />
Used to check whether this or derived classes are Colors. Default is *true*.<br /><br />
You should not change this, as it used internally for optimisation.
You should not change this, as it used internally for optimisation.
- </div>
+ </p>
<h3>[property:Float r]</h3>
<h3>[property:Float r]</h3>
- <div>
+ <p>
Red channel value between 0 and 1. Default is 1.
Red channel value between 0 and 1. Default is 1.
- </div>
+ </p>
<h3>[property:Float g]</h3>
<h3>[property:Float g]</h3>
- <div>
+ <p>
Green channel value between 0 and 1. Default is 1.
Green channel value between 0 and 1. Default is 1.
- </div>
+ </p>
<h3>[property:Float b]</h3>
<h3>[property:Float b]</h3>
- <div>
+ <p>
Blue channel value between 0 and 1. Default is 1.
Blue channel value between 0 and 1. Default is 1.
- </div>
+ </p>
@@ -105,65 +105,65 @@ var color = new THREE.Color( 1, 0, 0 );
A class representing a 3x3 [link:https://en.wikipedia.org/wiki/Matrix_(mathematics) matrix].
A class representing a 3x3 [link:https://en.wikipedia.org/wiki/Matrix_(mathematics) matrix].
- </div>
+ </p>
<h2>Example</h2>
<h2>Example</h2>
<code>
<code>
@@ -20,7 +20,7 @@ var m = new Matrix3();
</code>
</code>
<h2>A Note on Row-Major and Column-Major Ordering</h2>
<h2>A Note on Row-Major and Column-Major Ordering</h2>
- <div>
+ <p>
The [page:set]() method takes arguments in [link:https://en.wikipedia.org/wiki/Row-_and_column-major_order#Column-major_order row-major]
The [page:set]() method takes arguments in [link:https://en.wikipedia.org/wiki/Row-_and_column-major_order#Column-major_order row-major]
order, while internally they are stored in the [page:.elements elements] array in column-major order.<br /><br />
order, while internally they are stored in the [page:.elements elements] array in column-major order.<br /><br />
@@ -40,72 +40,72 @@ m.elements = [ 11, 21, 31,
makes no difference mathematically and most people are used to thinking about matrices in row-major order,
makes no difference mathematically and most people are used to thinking about matrices in row-major order,
the three.js documentation shows matrices in row-major order. Just bear in mind that if you are reading the source
the three.js documentation shows matrices in row-major order. Just bear in mind that if you are reading the source
code, you'll have to take the [link:https://en.wikipedia.org/wiki/Transpose transpose] of any matrices outlined here to make sense of the calculations.
code, you'll have to take the [link:https://en.wikipedia.org/wiki/Transpose transpose] of any matrices outlined here to make sense of the calculations.
Sets this matrix as the upper left 3x3 of the [link:https://en.wikipedia.org/wiki/Normal_matrix normal matrix]
Sets this matrix as the upper left 3x3 of the [link:https://en.wikipedia.org/wiki/Normal_matrix normal matrix]
of the passed [page:Matrix4 matrix4]. The normal matrix is the [link:https://en.wikipedia.org/wiki/Invertible_matrix inverse] [link:https://en.wikipedia.org/wiki/Transpose transpose]
of the passed [page:Matrix4 matrix4]. The normal matrix is the [link:https://en.wikipedia.org/wiki/Invertible_matrix inverse] [link:https://en.wikipedia.org/wiki/Transpose transpose]
A class representing a 4x4 [link:https://en.wikipedia.org/wiki/Matrix_(mathematics) matrix].<br /><br />
A class representing a 4x4 [link:https://en.wikipedia.org/wiki/Matrix_(mathematics) matrix].<br /><br />
The most common use of a 4x4 matrix in 3D computer graphics is as a
The most common use of a 4x4 matrix in 3D computer graphics is as a
@@ -47,10 +47,10 @@
</li>
</li>
</ul>
</ul>
Note: [page:Object3D.normalMatrix] is not a Matrix4, but a [page:Matrix3].
Note: [page:Object3D.normalMatrix] is not a Matrix4, but a [page:Matrix3].
- </div>
+ </p>
<h2>A Note on Row-Major and Column-Major Ordering</h2>
<h2>A Note on Row-Major and Column-Major Ordering</h2>
- <div>
+ <p>
The [page:set]() method takes arguments in [link:https://en.wikipedia.org/wiki/Row-_and_column-major_order#Column-major_order row-major]
The [page:set]() method takes arguments in [link:https://en.wikipedia.org/wiki/Row-_and_column-major_order#Column-major_order row-major]
order, while internally they are stored in the [page:.elements elements] array in column-major order.<br /><br />
order, while internally they are stored in the [page:.elements elements] array in column-major order.<br /><br />
@@ -75,7 +75,7 @@ m.elements = [ 11, 21, 31, 41,
makes no difference mathematically and most people are used to thinking about matrices in row-major order,
makes no difference mathematically and most people are used to thinking about matrices in row-major order,
the three.js documentation shows matrices in row-major order. Just bear in mind that if you are reading the source
the three.js documentation shows matrices in row-major order. Just bear in mind that if you are reading the source
code, you'll have to take the [link:https://en.wikipedia.org/wiki/Transpose transpose] of any matrices outlined here to make sense of the calculations.
code, you'll have to take the [link:https://en.wikipedia.org/wiki/Transpose transpose] of any matrices outlined here to make sense of the calculations.
A two dimensional surface that extends infinitely in 3d space, represented in [link:http://mathworld.wolfram.com/HessianNormalForm.html Hessian normal form]
A two dimensional surface that extends infinitely in 3d space, represented in [link:http://mathworld.wolfram.com/HessianNormalForm.html Hessian normal form]
[page:Geometry geometry] — vertices representing the line segment(s). Default is a new [page:new BufferGeometry].<br />
[page:Geometry geometry] — vertices representing the line segment(s). Default is a new [page:new BufferGeometry].<br />
[page:Material material] — material for the line. Default is a new [page:LineBasicMaterial] with random color.<br />
[page:Material material] — material for the line. Default is a new [page:LineBasicMaterial] with random color.<br />
- </div>
+ </p>
- <div>If no material is supplied, a randomized line material will be created and assigned to the object.</div>
+ <p>If no material is supplied, a randomized line material will be created and assigned to the object.</p>
<h2>Properties</h2>
<h2>Properties</h2>
- <div>See the base [page:Object3D] class for common properties.</div>
+ <p>See the base [page:Object3D] class for common properties.</p>
<h3>[property:Boolean isLine]</h3>
<h3>[property:Boolean isLine]</h3>
- <div>
+ <p>
Used to check whether this or derived classes are lines. Default is *true*.<br /><br />
Used to check whether this or derived classes are lines. Default is *true*.<br /><br />
You should not change this, as it used internally for optimisation.
You should not change this, as it used internally for optimisation.
- </div>
+ </p>
<h3>[property:Geometry geometry]</h3>
<h3>[property:Geometry geometry]</h3>
- <div>Vertices representing the line segment(s).</div>
+ <p>Vertices representing the line segment(s).</p>
<h3>[property:Material material]</h3>
<h3>[property:Material material]</h3>
- <div>Material for the line.</div>
+ <p>Material for the line.</p>
<h2>Methods</h2>
<h2>Methods</h2>
- <div>See the base [page:Object3D] class for common methods.</div>
+ <p>See the base [page:Object3D] class for common methods.</p>
<h3>[method:Line computeLineDistances]()</h3>
<h3>[method:Line computeLineDistances]()</h3>
- <div>
+ <p>
Computes an array of distance values which are necessary for [page:LineDashedMaterial]. For each vertex in the geometry, the method calculates the cumulative length from the current point to the very beginning of the line.
Computes an array of distance values which are necessary for [page:LineDashedMaterial]. For each vertex in the geometry, the method calculates the cumulative length from the current point to the very beginning of the line.
The WebGL renderer displays your beautifully crafted scenes using
The WebGL renderer displays your beautifully crafted scenes using
[link:https://en.wikipedia.org/wiki/WebGL WebGL].
[link:https://en.wikipedia.org/wiki/WebGL WebGL].
- </div>
+ </p>
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]( [param:Object parameters] )</h3>
<h3>[name]( [param:Object parameters] )</h3>
- <div>
+ <p>
[page:Object parameters] - (optional) object with properties defining the renderer's behaviour.
[page:Object parameters] - (optional) object with properties defining the renderer's behaviour.
The constructor also accepts no parameters at all. In all cases, it will assume sane defaults
The constructor also accepts no parameters at all. In all cases, it will assume sane defaults
when parameters are missing. The following are valid parameters:<br /><br />
when parameters are missing. The following are valid parameters:<br /><br />
@@ -64,112 +64,112 @@
[page:Boolean logarithmicDepthBuffer] - whether to use a logarithmic depth buffer. It may
[page:Boolean logarithmicDepthBuffer] - whether to use a logarithmic depth buffer. It may
be neccesary to use this if dealing with huge differences in scale in a single scene.
be neccesary to use this if dealing with huge differences in scale in a single scene.
Default is *false*. See the [example:webgl_camera_logarithmicdepthbuffer camera / logarithmicdepthbuffer] example.
Default is *false*. See the [example:webgl_camera_logarithmicdepthbuffer camera / logarithmicdepthbuffer] example.
- </div>
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:Boolean autoClear]</h3>
<h3>[property:Boolean autoClear]</h3>
- <div>Defines whether the renderer should automatically clear its output before rendering a frame.</div>
+ <p>Defines whether the renderer should automatically clear its output before rendering a frame.</p>
<h3>[property:Boolean autoClearColor]</h3>
<h3>[property:Boolean autoClearColor]</h3>
- <div>
+ <p>
If [page:.autoClear autoClear] is true, defines whether the renderer should clear the color buffer.
If [page:.autoClear autoClear] is true, defines whether the renderer should clear the color buffer.
Default is *true*.
Default is *true*.
- </div>
+ </p>
<h3>[property:Boolean autoClearDepth]</h3>
<h3>[property:Boolean autoClearDepth]</h3>
- <div>
+ <p>
If [page:.autoClear autoClear] is true, defines whether the renderer should clear the depth buffer.
If [page:.autoClear autoClear] is true, defines whether the renderer should clear the depth buffer.
Default is *true*.
Default is *true*.
- </div>
+ </p>
<h3>[property:Boolean autoClearStencil]</h3>
<h3>[property:Boolean autoClearStencil]</h3>
- <div>
+ <p>
If [page:.autoClear autoClear] is true, defines whether the renderer should clear the stencil buffer.
If [page:.autoClear autoClear] is true, defines whether the renderer should clear the stencil buffer.
Default is *true*.
Default is *true*.
- </div>
+ </p>
<h3>[property:Object capabilities]</h3>
<h3>[property:Object capabilities]</h3>
- <div>
+ <p>
An object containing details about the capabilities of the current [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext RenderingContext].<br />
An object containing details about the capabilities of the current [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext RenderingContext].<br />
- - [property:Boolean floatFragmentTextures]: whether the context supports the [link:https://developer.mozilla.org/en-US/docs/Web/API/OES_texture_float OES_texture_float] extension.
+ - [page:Boolean floatFragmentTextures]: whether the context supports the [link:https://developer.mozilla.org/en-US/docs/Web/API/OES_texture_float OES_texture_float] extension.
According to [link:https://webglstats.com/ WebGLStats], as of February 2016 over 95% of WebGL enabled devices support this.<br />
According to [link:https://webglstats.com/ WebGLStats], as of February 2016 over 95% of WebGL enabled devices support this.<br />
- - [property:Boolean floatVertexTextures]: *true* if [property:Boolean floatFragmentTextures] and [property:Boolean vertexTextures] are both true.<br />
- - [property:Method getMaxAnisotropy](): Returns the maximum available anisotropy.<br />
- - [property:Method getMaxPrecision](): Returns the maximum available precision for vertex and fragment shaders. <br />
- - [property:Boolean logarithmicDepthBuffer]: *true* if the [property:parameter logarithmicDepthBuffer] was set to true in the constructor and
+ - [page:Boolean floatVertexTextures]: *true* if [page:Boolean floatFragmentTextures] and [page:Boolean vertexTextures] are both true.<br />
+ - [page:Method getMaxAnisotropy](): Returns the maximum available anisotropy.<br />
+ - [page:Method getMaxPrecision](): Returns the maximum available precision for vertex and fragment shaders. <br />
+ - [page:Boolean logarithmicDepthBuffer]: *true* if the [page:parameter logarithmicDepthBuffer] was set to true in the constructor and
the context supports the [link:https://developer.mozilla.org/en-US/docs/Web/API/EXT_frag_depth EXT_frag_depth] extension.
the context supports the [link:https://developer.mozilla.org/en-US/docs/Web/API/EXT_frag_depth EXT_frag_depth] extension.
According to [link:https://webglstats.com/ WebGLStats], as of February 2016 around 66% of WebGL enabled devices support this.<br />
According to [link:https://webglstats.com/ WebGLStats], as of February 2016 around 66% of WebGL enabled devices support this.<br />
- - [property:Integer maxAttributes]: The value of *gl.MAX_VERTEX_ATTRIBS*.<br />
- - [property:Integer maxCubemapSize]: The value of *gl.MAX_CUBE_MAP_TEXTURE_SIZE*.
+ - [page:Integer maxAttributes]: The value of *gl.MAX_VERTEX_ATTRIBS*.<br />
+ - [page:Integer maxCubemapSize]: The value of *gl.MAX_CUBE_MAP_TEXTURE_SIZE*.
Maximum height * width of cube map textures that a shader can use.<br />
Maximum height * width of cube map textures that a shader can use.<br />
- - [property:Integer maxFragmentUniforms]: The value of *gl.MAX_FRAGMENT_UNIFORM_VECTORS*.
+ - [page:Integer maxFragmentUniforms]: The value of *gl.MAX_FRAGMENT_UNIFORM_VECTORS*.
The number of uniforms that can be used by a fragment shader.<br />
The number of uniforms that can be used by a fragment shader.<br />
- - [property:Integer maxTextureSize]: The value of *gl.MAX_TEXTURE_SIZE*.
+ - [page:Integer maxTextureSize]: The value of *gl.MAX_TEXTURE_SIZE*.
Maximum height * width of a texture that a shader use.<br />
Maximum height * width of a texture that a shader use.<br />
- - [property:Integer maxTextures]: The value of *gl.MAX_TEXTURE_IMAGE_UNITS*.
+ - [page:Integer maxTextures]: The value of *gl.MAX_TEXTURE_IMAGE_UNITS*.
The maximum number of textures that can be used by a shader.<br />
The maximum number of textures that can be used by a shader.<br />
- - [property:Integer maxVaryings]: The value of *gl.MAX_VARYING_VECTORS*.
+ - [page:Integer maxVaryings]: The value of *gl.MAX_VARYING_VECTORS*.
The number of varying vectors that can used by shaders.<br />
The number of varying vectors that can used by shaders.<br />
- - [property:Integer maxVertexTextures]: The value of *gl.MAX_VERTEX_TEXTURE_IMAGE_UNITS*.
+ - [page:Integer maxVertexTextures]: The value of *gl.MAX_VERTEX_TEXTURE_IMAGE_UNITS*.
The number of textures that can be used in a vertex shader.<br />
The number of textures that can be used in a vertex shader.<br />
- - [property:Integer maxVertexUniforms]: The value of *gl.MAX_VERTEX_UNIFORM_VECTORS*.
+ - [page:Integer maxVertexUniforms]: The value of *gl.MAX_VERTEX_UNIFORM_VECTORS*.
The maximum number of uniforms that can be used in a vertex shader.<br />
The maximum number of uniforms that can be used in a vertex shader.<br />
- - [property:String precision]: The shader precision currently being used by the renderer.<br />
- - [property:Boolean vertexTextures]: *true* if [property:Integer maxVertexTextures] is greater than 0 (i.e. vertext textures can be used).<br />
- </div>
+ - [page:String precision]: The shader precision currently being used by the renderer.<br />
+ - [page:Boolean vertexTextures]: *true* if [property:Integer maxVertexTextures] is greater than 0 (i.e. vertext textures can be used).<br />
+ </p>
<h3>[property:Array clippingPlanes]</h3>
<h3>[property:Array clippingPlanes]</h3>
- <div>
+ <p>
User-defined clipping planes specified as THREE.Plane objects in world space.
User-defined clipping planes specified as THREE.Plane objects in world space.
These planes apply globally. Points in space whose dot product with the plane is negative are cut away.
These planes apply globally. Points in space whose dot product with the plane is negative are cut away.
Default is [].
Default is [].
- </div>
+ </p>
<h3>[property:WebGLRenderingContext context]</h3>
<h3>[property:WebGLRenderingContext context]</h3>
- <div>
+ <p>
The renderer obtains a [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext RenderingContext] context
The renderer obtains a [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext RenderingContext] context
from its [page:WebGLRenderer.domElement domElement] by default, using
from its [page:WebGLRenderer.domElement domElement] by default, using
You can create this manually, however it must correspond to the
You can create this manually, however it must correspond to the
[page:WebGLRenderer.domElement domElement] in order to render to the screen.
[page:WebGLRenderer.domElement domElement] in order to render to the screen.
- </div>
+ </p>
<h3>[property:DOMElement domElement]</h3>
<h3>[property:DOMElement domElement]</h3>
- <div>
+ <p>
A [link:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas canvas] where the renderer draws its output.<br />
A [link:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas canvas] where the renderer draws its output.<br />
This is automatically created by the renderer in the constructor (if not provided already);
This is automatically created by the renderer in the constructor (if not provided already);
you just need to add it to your page like so:<br />
you just need to add it to your page like so:<br />
<code>
<code>
document.body.appendChild( renderer.domElement );
document.body.appendChild( renderer.domElement );
</code>
</code>
- </div>
+ </p>
<h3>[property:Object extensions]</h3>
<h3>[property:Object extensions]</h3>
- <div>
+ <p>
A wrapper for the [page:WebGLRenderer.extensions.get .extensions.get] method, used to check whether
A wrapper for the [page:WebGLRenderer.extensions.get .extensions.get] method, used to check whether
various WebGL extensions are supported.
various WebGL extensions are supported.
- </div>
+ </p>
<h3>[property:Float gammaFactor]</h3>
<h3>[property:Float gammaFactor]</h3>
- <div>Default is *2*. </div>
+ <p>Default is *2*. </p>
<h3>[property:Boolean gammaInput]</h3>
<h3>[property:Boolean gammaInput]</h3>
- <div>If set, then it expects that all textures and colors are premultiplied gamma. Default is *false*.</div>
+ <p>If set, then it expects that all textures and colors are premultiplied gamma. Default is *false*.</p>
<h3>[property:Boolean gammaOutput]</h3>
<h3>[property:Boolean gammaOutput]</h3>
- <div>If set, then it expects that all textures and colors need to be outputted in premultiplied gamma. Default is *false*.</div>
+ <p>If set, then it expects that all textures and colors need to be outputted in premultiplied gamma. Default is *false*.</p>
<h3>[property:Object info]</h3>
<h3>[property:Object info]</h3>
- <div>An object with a series of statistical information about the graphics board memory and the rendering process. Useful for debugging or just for the sake of curiosity. The object contains the following fields:</div>
- <div>
+ <p>An object with a series of statistical information about the graphics board memory and the rendering process. Useful for debugging or just for the sake of curiosity. The object contains the following fields:</p>
+ <p>
<ul>
<ul>
<li>memory:
<li>memory:
<ul>
<ul>
@@ -188,149 +188,149 @@
<li>programs
<li>programs
</li>
</li>
</ul>
</ul>
- </div>
- <div>By default these data are reset at each render calls, but when using the composer or mirrors it can be preferred to reset them with a custom pattern :
+ </p>
+ <p>By default these data are reset at each render calls, but when using the composer or mirrors it can be preferred to reset them with a custom pattern :
<code>
<code>
renderer.info.autoReset = false;
renderer.info.autoReset = false;
renderer.info.reset();
renderer.info.reset();
</code>
</code>
- </div>
+ </p>
<h3>[property:Boolean localClippingEnabled]</h3>
<h3>[property:Boolean localClippingEnabled]</h3>
- <div>Defines whether the renderer respects object-level clipping planes. Default is *false*.</div>
+ <p>Defines whether the renderer respects object-level clipping planes. Default is *false*.</p>
<h3>[property:Integer maxMorphTargets]</h3>
<h3>[property:Integer maxMorphTargets]</h3>
- <div>
+ <p>
Default is 8. The maximum number of MorphTargets allowed in a shader.
Default is 8. The maximum number of MorphTargets allowed in a shader.
Keep in mind that the standard materials only allow 8 MorphTargets.
Keep in mind that the standard materials only allow 8 MorphTargets.
- </div>
+ </p>
<h3>[property:Integer maxMorphNormals]</h3>
<h3>[property:Integer maxMorphNormals]</h3>
- <div>
+ <p>
Default is 4. The maximum number of MorphNormals allowed in a shader.
Default is 4. The maximum number of MorphNormals allowed in a shader.
Keep in mind that the standard materials only allow 4 MorphNormals.
Keep in mind that the standard materials only allow 4 MorphNormals.
Whether to use physically correct lighting mode. Default is *false*.
Whether to use physically correct lighting mode. Default is *false*.
See the [example:webgl_lights_physical lights / physical] example.
See the [example:webgl_lights_physical lights / physical] example.
- </div>
+ </p>
<h3>[property:Object properties]</h3>
<h3>[property:Object properties]</h3>
- <div>
+ <p>
Used internally by the renderer to keep track of various sub object properties.
Used internally by the renderer to keep track of various sub object properties.
- </div>
+ </p>
<h3>[property:WebGLRenderLists renderLists]</h3>
<h3>[property:WebGLRenderLists renderLists]</h3>
- <div>
+ <p>
Used internally to handle ordering of scene object rendering.
Used internally to handle ordering of scene object rendering.
- </div>
+ </p>
<h3>[property:WebGLShadowMap shadowMap]</h3>
<h3>[property:WebGLShadowMap shadowMap]</h3>
- <div>
+ <p>
This contains the reference to the shadow map, if used.
This contains the reference to the shadow map, if used.
- </div>
+ </p>
<h3>[property:Boolean shadowMap.enabled]</h3>
<h3>[property:Boolean shadowMap.enabled]</h3>
- <div>If set, use shadow maps in the scene. Default is *false*.</div>
+ <p>If set, use shadow maps in the scene. Default is *false*.</p>
<h3>[property:Boolean shadowMap.autoUpdate]</h3>
<h3>[property:Boolean shadowMap.autoUpdate]</h3>
- <div>Enables automatic updates to the shadows in the scene. Default is *true*.</div>
- <div>If you do not require dynamic lighting / shadows, you may set this to *false* when the renderer is instantiated.</div>
+ <p>Enables automatic updates to the shadows in the scene. Default is *true*.</p>
+ <p>If you do not require dynamic lighting / shadows, you may set this to *false* when the renderer is instantiated.</p>
<h3>[property:Boolean shadowMap.needsUpdate]</h3>
<h3>[property:Boolean shadowMap.needsUpdate]</h3>
- <div>When set to *true*, shadow maps in the scene will be updated in the next *render* call. Default is *false*. </div>
- <div>If you have disabled automatic updates to shadow maps (*shadowMap.autoUpdate = false*), you will need to set this to *true* and then make a render call to update the shadows in your scene.</div>
+ <p>When set to *true*, shadow maps in the scene will be updated in the next *render* call. Default is *false*. </p>
+ <p>If you have disabled automatic updates to shadow maps (*shadowMap.autoUpdate = false*), you will need to set this to *true* and then make a render call to update the shadows in your scene.</p>
<h3>[property:Integer shadowMap.type]</h3>
<h3>[property:Integer shadowMap.type]</h3>
- <div>Defines shadow map type (unfiltered, percentage close filtering, percentage close filtering with bilinear filtering in shader)</div>
- <div>Options are THREE.BasicShadowMap, THREE.PCFShadowMap (default), THREE.PCFSoftShadowMap. See [page:Renderer Renderer constants] for details.</div>
+ <p>Defines shadow map type (unfiltered, percentage close filtering, percentage close filtering with bilinear filtering in shader)</p>
+ <p>Options are THREE.BasicShadowMap, THREE.PCFShadowMap (default), THREE.PCFSoftShadowMap. See [page:Renderer Renderer constants] for details.</p>
<h3>[property:Boolean sortObjects]</h3>
<h3>[property:Boolean sortObjects]</h3>
- <div>
+ <p>
Defines whether the renderer should sort objects. Default is *true*.<br /><br />
Defines whether the renderer should sort objects. Default is *true*.<br /><br />
Note: Sorting is used to attempt to properly render objects that have some degree of transparency.
Note: Sorting is used to attempt to properly render objects that have some degree of transparency.
By definition, sorting objects may not work in all cases. Depending on the needs of application,
By definition, sorting objects may not work in all cases. Depending on the needs of application,
it may be neccessary to turn off sorting and use other methods to deal with transparency
it may be neccessary to turn off sorting and use other methods to deal with transparency
rendering e.g. manually determining each object's rendering order.
rendering e.g. manually determining each object's rendering order.
- </div>
+ </p>
<h3>[property:Object state]</h3>
<h3>[property:Object state]</h3>
- <div>
+ <p>
Contains functions for setting various properties of the [page:WebGLRenderer.context] state.
Contains functions for setting various properties of the [page:WebGLRenderer.context] state.
- </div>
+ </p>
<h3>[property:Constant toneMapping]</h3>
<h3>[property:Constant toneMapping]</h3>
- <div>
+ <p>
Default is [page:Renderer LinearToneMapping]. See the [page:Renderer Renderer constants] for other choices.
Default is [page:Renderer LinearToneMapping]. See the [page:Renderer Renderer constants] for other choices.
- </div>
+ </p>
<h3>[property:Number toneMappingExposure]</h3>
<h3>[property:Number toneMappingExposure]</h3>
- <div>
+ <p>
Exposure level of tone mapping. Default is *1*.
Exposure level of tone mapping. Default is *1*.
- </div>
+ </p>
<h3>[property:Number toneMappingWhitePoint]</h3>
<h3>[property:Number toneMappingWhitePoint]</h3>
- <div>
+ <p>
Tone mapping white point. Default is *1*.
Tone mapping white point. Default is *1*.
- </div>
+ </p>
<h2>Methods</h2>
<h2>Methods</h2>
<h3>[method:Integer allocTextureUnit]</h3>
<h3>[method:Integer allocTextureUnit]</h3>
- <div>
+ <p>
Attempt to allocate a texture unit for use by a shader. Will warn if trying to allocate
Attempt to allocate a texture unit for use by a shader. Will warn if trying to allocate
more texture units than the GPU supports. This is mainly used internally.
more texture units than the GPU supports. This is mainly used internally.
See [page:WebGLRenderer.capabilities capabilities.maxTextures].
See [page:WebGLRenderer.capabilities capabilities.maxTextures].
- <div>[page:Function callback] — The function will be called every available frame. If `null` is passed it will stop any already ongoing animation.</div>
- <div>A build in function that can be used instead of [link:https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame requestAnimationFrame]. For WebVR projects this function must be used.</div>
+ <p>[page:Function callback] — The function will be called every available frame. If `null` is passed it will stop any already ongoing animation.</p>
+ <p>A build in function that can be used instead of [link:https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame requestAnimationFrame]. For WebVR projects this function must be used.</p>
- <div>Copies pixels from the current WebGLFramebuffer into a 2D texture. Enables access to [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/copyTexImage2D WebGLRenderingContext.copyTexImage2D].</div>
+ <p>Copies pixels from the current WebGLFramebuffer into a 2D texture. Enables access to [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/copyTexImage2D WebGLRenderingContext.copyTexImage2D].</p>
- <div>Copies all pixels of a texture to an existing texture starting from the given position. Enables access to [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage2D WebGLRenderingContext.texSubImage2D].</div>
+ <p>Copies all pixels of a texture to an existing texture starting from the given position. Enables access to [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage2D WebGLRenderingContext.texSubImage2D].</p>
<h3>[method:null dispose]( )</h3>
<h3>[method:null dispose]( )</h3>
- <div>Dispose of the current rendering context.</div>
+ <p>Dispose of the current rendering context.</p>
- <div>Reads the pixel data from the renderTarget into the buffer you pass in. This is a wrapper around [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/readPixels WebGLRenderingContext.readPixels]().<br />
+ <p>Reads the pixel data from the renderTarget into the buffer you pass in. This is a wrapper around [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/readPixels WebGLRenderingContext.readPixels]().<br />
See the [example:webgl_interactive_cubes_gpu interactive / cubes / gpu] example.
See the [example:webgl_interactive_cubes_gpu interactive / cubes / gpu] example.
Render a [page:Scene scene] using a [page:Camera camera].<br />
Render a [page:Scene scene] using a [page:Camera camera].<br />
The render is done to the [page:WebGLRenderTarget renderTarget] (if specified) or to the canvas as usual.<br />
The render is done to the [page:WebGLRenderTarget renderTarget] (if specified) or to the canvas as usual.<br />
@@ -394,54 +394,54 @@
Even with forceClear set to true you can prevent certain buffers being cleared by setting
Even with forceClear set to true you can prevent certain buffers being cleared by setting
either the [page:WebGLRenderer.autoClearColor autoClearColor], [page:WebGLRenderer.autoClearStencil autoClearStencil] or [page:WebGLRenderer.autoClearDepth autoClearDepth] properties to false.
either the [page:WebGLRenderer.autoClearColor autoClearColor], [page:WebGLRenderer.autoClearStencil autoClearStencil] or [page:WebGLRenderer.autoClearDepth autoClearDepth] properties to false.
- <div>The color parameter is passed to the [page:Color] constructor to set the color property. Color can be a hexadecimal integer or a CSS-style string.</div>
+ <p>The color parameter is passed to the [page:Color] constructor to set the color property. Color can be a hexadecimal integer or a CSS-style string.</p>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:String name]</h3>
<h3>[property:String name]</h3>
- <div>Optional name of the object (doesn't need to be unique). Default is an empty string.</div>
+ <p>Optional name of the object (doesn't need to be unique). Default is an empty string.</p>
<h3>[property:Color color]</h3>
<h3>[property:Color color]</h3>
- <div>Fog color. Example: If set to black, far away objects will be rendered black.</div>
+ <p>Fog color. Example: If set to black, far away objects will be rendered black.</p>
<h3>[property:Float near]</h3>
<h3>[property:Float near]</h3>
- <div>The minimum distance to start applying fog. Objects that are less than 'near' units from the active camera won't be affected by fog.</div>
- <div>Default is 1.</div>
+ <p>The minimum distance to start applying fog. Objects that are less than 'near' units from the active camera won't be affected by fog.</p>
+ <p>Default is 1.</p>
<h3>[property:Float far]</h3>
<h3>[property:Float far]</h3>
- <div>The maximum distance at which fog stops being calculated and applied. Objects that are more than 'far' units away from the active camera won't be affected by fog.</div>
- <div>Default is 1000.</div>
+ <p>The maximum distance at which fog stops being calculated and applied. Objects that are more than 'far' units away from the active camera won't be affected by fog.</p>
+ <p>Default is 1000.</p>
<h2>Methods</h2>
<h2>Methods</h2>
<h3>[method:Fog clone]()</h3>
<h3>[method:Fog clone]()</h3>
- <div>Returns a new fog instance with the same parameters as this one.</div>
+ <p>Returns a new fog instance with the same parameters as this one.</p>
- <div>The color parameter is passed to the [page:Color] constructor to set the color property. Color can be a hexadecimal integer or a CSS-style string.</div>
+ <p>The color parameter is passed to the [page:Color] constructor to set the color property. Color can be a hexadecimal integer or a CSS-style string.</p>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:String name]</h3>
<h3>[property:String name]</h3>
- <div>Optional name of the object (doesn't need to be unique). Default is an empty string.</div>
+ <p>Optional name of the object (doesn't need to be unique). Default is an empty string.</p>
<h3>[property:Color color]</h3>
<h3>[property:Color color]</h3>
- <div>Fog color. Example: If set to black, far away objects will be rendered black.</div>
+ <p>Fog color. Example: If set to black, far away objects will be rendered black.</p>
<h3>[property:Float density]</h3>
<h3>[property:Float density]</h3>
- <div>Defines how fast the fog will grow dense.</div>
- <div>Default is 0.00025.</div>
+ <p>Defines how fast the fog will grow dense.</p>
+ <p>Default is 0.00025.</p>
<h2>Methods</h2>
<h2>Methods</h2>
<h3>[method:FogExp2 clone]()</h3>
<h3>[method:FogExp2 clone]()</h3>
- <div>Returns a new FogExp2 instance with the same parameters as this one.</div>
+ <p>Returns a new FogExp2 instance with the same parameters as this one.</p>
- <div class="desc">Scenes allow you to set up what and where is to be rendered by three.js. This is where you place objects, lights and cameras.</div>
+ <p class="desc">Scenes allow you to set up what and where is to be rendered by three.js. This is where you place objects, lights and cameras.</p>
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]()</h3>
<h3>[name]()</h3>
- <div>
+ <p>
Create a new scene object.
Create a new scene object.
- </div>
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:Fog fog]</h3>
<h3>[property:Fog fog]</h3>
- <div>A [page:Fog fog] instance defining the type of fog that affects everything rendered in the scene. Default is null.</div>
+ <p>A [page:Fog fog] instance defining the type of fog that affects everything rendered in the scene. Default is null.</p>
<h3>[property:Material overrideMaterial]</h3>
<h3>[property:Material overrideMaterial]</h3>
- <div>If not null, it will force everything in the scene to be rendered with that material. Default is null.</div>
+ <p>If not null, it will force everything in the scene to be rendered with that material. Default is null.</p>
<h3>[property:boolean autoUpdate]</h3>
<h3>[property:boolean autoUpdate]</h3>
- <div>
+ <p>
Default is true. If set, then the renderer checks every frame if the scene and its objects needs matrix updates.
Default is true. If set, then the renderer checks every frame if the scene and its objects needs matrix updates.
When it isn't, then you have to maintain all matrices in the scene yourself.
When it isn't, then you have to maintain all matrices in the scene yourself.
- </div>
+ </p>
<h3>[property:Object background]</h3>
<h3>[property:Object background]</h3>
- <div>
+ <p>
If not null, sets the background used when rendering the scene, and is always rendered first. Can be set to a [page:Color] which sets the clear color, a [page:Texture] covering the canvas, or a [page:CubeTexture]. Default is null.
If not null, sets the background used when rendering the scene, and is always rendered first. Can be set to a [page:Color] which sets the clear color, a [page:Texture] covering the canvas, or a [page:CubeTexture]. Default is null.
[page:HTMLElement canvas] -- The HTML canvas element from which to load the texture. <br />
[page:HTMLElement canvas] -- The HTML canvas element from which to load the texture. <br />
[page:Constant mapping] -- How the image is applied to the object. An object type of [page:Textures THREE.UVMapping].
[page:Constant mapping] -- How the image is applied to the object. An object type of [page:Textures THREE.UVMapping].
@@ -48,26 +48,26 @@
[page:Number anisotropy] -- The number of samples taken along the axis through the pixel that has the highest density of texels.
[page:Number anisotropy] -- The number of samples taken along the axis through the pixel that has the highest density of texels.
By default, this value is 1. A higher value gives a less blurry result than a basic mipmap, at the cost of more texture samples being used.
By default, this value is 1. A higher value gives a less blurry result than a basic mipmap, at the cost of more texture samples being used.
Use [page:WebGLrenderer.getMaxAnisotropy renderer.getMaxAnisotropy]() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.<br /><br />
Use [page:WebGLrenderer.getMaxAnisotropy renderer.getMaxAnisotropy]() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.<br /><br />
- </div>
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
- <div>
+ <p>
See the base [page:Texture Texture] class for common properties.
See the base [page:Texture Texture] class for common properties.
- </div>
+ </p>
<h3>[property:boolean needsUpdate]</h3>
<h3>[property:boolean needsUpdate]</h3>
- <div>
+ <p>
True by default. This is required so that the canvas data is loaded.
True by default. This is required so that the canvas data is loaded.
- </div>
+ </p>
<h2>Methods</h2>
<h2>Methods</h2>
- <div>
+ <p>
See the base [page:Texture Texture] class for common methods.
See the base [page:Texture Texture] class for common methods.
[page:Array mipmaps] -- The mipmaps array should contain objects with data, width and height. The mipmaps should be of the correct format and type.<br />
[page:Array mipmaps] -- The mipmaps array should contain objects with data, width and height. The mipmaps should be of the correct format and type.<br />
[page:Number width] -- The width of the biggest mipmap.<br />
[page:Number width] -- The width of the biggest mipmap.<br />
@@ -57,7 +57,7 @@
[page:Number anisotropy] -- The number of samples taken along the axis through the pixel that has the highest density of texels.
[page:Number anisotropy] -- The number of samples taken along the axis through the pixel that has the highest density of texels.
By default, this value is 1. A higher value gives a less blurry result than a basic mipmap, at the cost of more texture samples being used.
By default, this value is 1. A higher value gives a less blurry result than a basic mipmap, at the cost of more texture samples being used.
Use renderer.getMaxAnisotropy() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.<br /><br />
Use renderer.getMaxAnisotropy() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.<br /><br />
- </div>
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
@@ -66,15 +66,15 @@
<h3>[property:boolean flipY]</h3>
<h3>[property:boolean flipY]</h3>
- <div>
+ <p>
False by default. Flipping textures does not work for compressed textures.
False by default. Flipping textures does not work for compressed textures.
- </div>
+ </p>
<h3>[property:boolean generateMipmaps]</h3>
<h3>[property:boolean generateMipmaps]</h3>
- <div>
+ <p>
False by default. Mipmaps can't be generated for compressed textures
False by default. Mipmaps can't be generated for compressed textures
The data argument must be an ArrayBuffer or a typed array view.
The data argument must be an ArrayBuffer or a typed array view.
Further parameters correspond to the properties inherited from [page:Texture], where both magFilter and minFilter default to THREE.NearestFilter. The properties flipY and generateMipmaps are intially set to false.
Further parameters correspond to the properties inherited from [page:Texture], where both magFilter and minFilter default to THREE.NearestFilter. The properties flipY and generateMipmaps are intially set to false.
- </div>
- <div>
+ </p>
+ <p>
The interpretation of the data depends on type and format:
The interpretation of the data depends on type and format:
If the type is THREE.UnsignedByteType, a Uint8Array will be useful for addressing the texel data.
If the type is THREE.UnsignedByteType, a Uint8Array will be useful for addressing the texel data.
If the format is THREE.RGBAFormat, data needs four values for one texel; Red, Green, Blue and Alpha (typically the opacity). Similarly, THREE.RGBFormat specifies a format where only three values are used for each texel.<br />
If the format is THREE.RGBAFormat, data needs four values for one texel; Red, Green, Blue and Alpha (typically the opacity). Similarly, THREE.RGBFormat specifies a format where only three values are used for each texel.<br />
@@ -30,7 +30,7 @@
For the packed types, THREE.UnsignedShort4444Type, THREE.UnsignedShort5551Type or THREE.UnsignedShort565Type, all color components of one texel can be addressed as bitfields within an integer element of a Uint16Array.<br />
For the packed types, THREE.UnsignedShort4444Type, THREE.UnsignedShort5551Type or THREE.UnsignedShort565Type, all color components of one texel can be addressed as bitfields within an integer element of a Uint16Array.<br />
In order to use the types THREE.FloatType and THREE.HalfFloatType, the WebGL implementation must support the respective extensions OES_texture_float and OES_texture_half_float. In order to use THREE.LinearFilter for component-wise, bilinear interpolation of the texels based on these types, the WebGL extensions OES_texture_float_linear or OES_texture_half_float_linear must also be present.
In order to use the types THREE.FloatType and THREE.HalfFloatType, the WebGL implementation must support the respective extensions OES_texture_float and OES_texture_half_float. In order to use THREE.LinearFilter for component-wise, bilinear interpolation of the texels based on these types, the WebGL extensions OES_texture_float_linear or OES_texture_half_float_linear must also be present.
- </div>
+ </p>
<h2>Example</h2>
<h2>Example</h2>
@@ -62,9 +62,9 @@
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:Image image]</h3>
<h3>[property:Image image]</h3>
- <div>
+ <p>
Overridden with a record type holding data, width and height.
Overridden with a record type holding data, width and height.
[page:Number width] -- width of the texture.<br />
[page:Number width] -- width of the texture.<br />
[page:Number height] -- height of the texture.<br />
[page:Number height] -- height of the texture.<br />
-[page:Constant type] -- Default is [page:Textures THREE.UnsignedShortType].
-See [page:Textures type constants] for other choices.<br />
+[page:Constant type] -- Default is [page:Textures THREE.UnsignedShortType].
+See [page:Textures type constants] for other choices.<br />
-[page:Constant mapping] --
-See [page:Textures type constants] for details.<br />
+[page:Constant mapping] --
+See [page:Textures type constants] for details.<br />
-[page:Constant wrapS] -- The default is [page:Textures THREE.ClampToEdgeWrapping].
+[page:Constant wrapS] -- The default is [page:Textures THREE.ClampToEdgeWrapping].
See [page:Textures wrap mode constants] for other choices.<br />
See [page:Textures wrap mode constants] for other choices.<br />
[page:Constant wrapT] -- The default is [page:Textures THREE.ClampToEdgeWrapping].
[page:Constant wrapT] -- The default is [page:Textures THREE.ClampToEdgeWrapping].
@@ -47,66 +45,65 @@
The default is [page:Textures THREE.NearestFilter]. See [page:Textures magnification filter constants] for other choices.<br />
The default is [page:Textures THREE.NearestFilter]. See [page:Textures magnification filter constants] for other choices.<br />
[page:Constant minFilter] -- How the texture is sampled when a texel covers less than one pixel.
[page:Constant minFilter] -- How the texture is sampled when a texel covers less than one pixel.
- The default is [page:Textures THREE.NearestFilter]. See [page:Textures minification filter constants] for other choices.<br />
-
- [page:Number anisotropy] -- The number of samples taken along the axis through the pixel that has the highest density of texels.
- By default, this value is 1. A higher value gives a less blurry result than a basic mipmap, at the cost of more texture samples being used.
- Use [page:WebGLrenderer.getMaxAnisotropy renderer.getMaxAnisotropy]() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.<br />
+ The default is [page:Textures THREE.NearestFilter]. See [page:Textures minification filter constants] for other choices.<br />
- [page:Constant format] -- must be either [page:Textures DepthFormat] (default) or [page:Textures DepthStencilFormat].
- See [page:Textures format constants] for details.<br />
+ [page:Number anisotropy] -- The number of samples taken along the axis through the pixel that has the highest density of texels.
+ By default, this value is 1. A higher value gives a less blurry result than a basic mipmap, at the cost of more texture samples being used.
+ Use [page:WebGLrenderer.getMaxAnisotropy renderer.getMaxAnisotropy]() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.<br />
- </div>
+ [page:Constant format] -- must be either [page:Textures DepthFormat] (default) or [page:Textures DepthStencilFormat].
+ See [page:Textures format constants] for details.<br />
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
- <div>
-See the base [page:Texture Texture] class for common properties
-- the following are also part of the texture class, but have different defaults here.
- </div>
+ <p>
+See the base [page:Texture Texture] class for common properties
+- the following are also part of the texture class, but have different defaults here.
+ </p>
<h3>[page:Texture.format .format]</h3>
<h3>[page:Texture.format .format]</h3>
- <div>
-Either [page:Textures DepthFormat] (default) or [page:Textures DepthStencilFormat].
-See [page:Textures format constants] for details.<br />
- </div>
-
-<h3>[page:Texture.type .type]</h3>
- <div>
-Default is [page:Textures THREE.UnsignedShortType].
-See [page:Textures format constants] for details.<br />
- </div>
-
-<h3>[page:Texture.magFilter .magFilter]</h3>
- <div>
- How the texture is sampled when a texel covers more than one pixel.
- The default is [page:Textures THREE.NearestFilter].
- See [page:Textures magnification filter constants] for other choices.
- </div>
-
-<h3>[page:Texture.minFilter .minFilter]</h3>
- <div>
-How the texture is sampled when a texel covers less than one pixel.
- The default is [page:Textures THREE.NearestFilter].
-See [page:Textures magnification filter constants] for other choices.
- </div>
-
-<h3>[page:Texture.flipY .flipY]</h3>
- <div>
-Depth textures do not need to be flipped so this is *false* by default.
Creates a texture for use with a video texture.<br /><br />
Creates a texture for use with a video texture.<br /><br />
This is almost the same as the base [page:Texture Texture] class, except that it continuosly sets [page:Texture.needsUpdate needsUpdate] to *true* so that the texture is updated as the video plays. Automatic creation of [page:Texture.mipmaps mipmaps] is also disabled.
This is almost the same as the base [page:Texture Texture] class, except that it continuosly sets [page:Texture.needsUpdate needsUpdate] to *true* so that the texture is updated as the video plays. Automatic creation of [page:Texture.mipmaps mipmaps] is also disabled.
- </div>
+ </p>
<h2>Example</h2>
<h2>Example</h2>
- <div>[example:webgl_materials_video materials / video ]</div>
+ <p>[example:webgl_materials_video materials / video ]</p>
<code>
<code>
//assuming you have created a HTML video element with id="video"
//assuming you have created a HTML video element with id="video"
[page:Number anisotropy] -- The number of samples taken along the axis through the pixel that has the highest density of texels.
[page:Number anisotropy] -- The number of samples taken along the axis through the pixel that has the highest density of texels.
By default, this value is 1. A higher value gives a less blurry result than a basic mipmap, at the cost of more texture samples being used.
By default, this value is 1. A higher value gives a less blurry result than a basic mipmap, at the cost of more texture samples being used.
Use [page:WebGLrenderer.getMaxAnisotropy renderer.getMaxAnisotropy]() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.<br /><br />
Use [page:WebGLrenderer.getMaxAnisotropy renderer.getMaxAnisotropy]() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.<br /><br />
- </div>
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
- <div>
+ <p>
See the base [page:Texture Texture] class for common properties.
See the base [page:Texture Texture] class for common properties.
- </div>
+ </p>
<h3>[property:boolean needsUpdate]</h3>
<h3>[property:boolean needsUpdate]</h3>
- <div>
+ <p>
You will not need to set this manually here as it is handled by the [page:VideoTexture.update update] method.
You will not need to set this manually here as it is handled by the [page:VideoTexture.update update] method.
- </div>
+ </p>
<h2>Methods</h2>
<h2>Methods</h2>
- <div>
+ <p>
See the base [page:Texture Texture] class for common methods.
See the base [page:Texture Texture] class for common methods.
- </div>
+ </p>
<h3>[method:null update]()</h3>
<h3>[method:null update]()</h3>
- <div>
+ <p>
This is called automatically and sets [property:boolean needsUpdate] to *true* every time
This is called automatically and sets [property:boolean needsUpdate] to *true* every time
- <div class="desc">[name] can be used to create a decal mesh that serves different kinds of purposes e.g. adding unique details to models, performing dynamic visual environmental changes or covering seams.</div>
+ <p class="desc">[name] can be used to create a decal mesh that serves different kinds of purposes e.g. adding unique details to models, performing dynamic visual environmental changes or covering seams.</p>
<script>
<script>
@@ -32,7 +32,7 @@
<h2>Example</h2>
<h2>Example</h2>
- <div>[example:webgl_decals decals ]</div>
+ <p>[example:webgl_decals decals ]</p>
<code>var geometry = new THREE.DecalGeometry( mesh, position, orientation, size );
<code>var geometry = new THREE.DecalGeometry( mesh, position, orientation, size );
var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:String url] — A string containing the path/URL of the <em>.babylon</em> file.<br />
[page:String url] — A string containing the path/URL of the <em>.babylon</em> file.<br />
[page:function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives the loaded [page:Object3D] as an argument.<br />
[page:function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives the loaded [page:Object3D] as an argument.<br />
[page:function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
[page:function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Begin loading from url and call onLoad with the parsed response content.
Begin loading from url and call onLoad with the parsed response content.
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:String url] — A string containing the path/URL of the <em>.gltf</em> or <em>.glb</em> file.<br />
[page:String url] — A string containing the path/URL of the <em>.gltf</em> or <em>.glb</em> file.<br />
[page:Function onLoad] — A function to be called after the loading is successfully completed. The function receives the loaded JSON response returned from [page:Function parse].<br />
[page:Function onLoad] — A function to be called after the loading is successfully completed. The function receives the loaded JSON response returned from [page:Function parse].<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, that contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, that contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives error as an argument.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Begin loading from url and call the callback function with the parsed response content.
Begin loading from url and call the callback function with the parsed response content.
[page:DRACOLoader dracoLoader] — Instance of THREE.DRACOLoader, to be used for decoding assets compressed with the KHR_draco_mesh_compression extension.
[page:DRACOLoader dracoLoader] — Instance of THREE.DRACOLoader, to be used for decoding assets compressed with the KHR_draco_mesh_compression extension.
- </div>
- <div>
+ </p>
+ <p>
Refer to this [link:https://github.com/mrdoob/three.js/tree/dev/examples/js/libs/draco#readme readme] for the details of Draco and its decoder.
Refer to this [link:https://github.com/mrdoob/three.js/tree/dev/examples/js/libs/draco#readme readme] for the details of Draco and its decoder.
[page:ArrayBuffer data] — glTF asset to parse, as an ArrayBuffer or <em>JSON</em> string.<br />
[page:ArrayBuffer data] — glTF asset to parse, as an ArrayBuffer or <em>JSON</em> string.<br />
[page:String path] — The base path from which to find subsequent glTF resources such as textures and .bin data files.<br />
[page:String path] — The base path from which to find subsequent glTF resources such as textures and .bin data files.<br />
[page:Function onLoad] — A function to be called when parse completes.<br />
[page:Function onLoad] — A function to be called when parse completes.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during parsing. The function receives error as an argument.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during parsing. The function receives error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Parse a glTF-based ArrayBuffer or <em>JSON</em> String and fire [page:Function onLoad] callback when complete. The argument to [page:Function onLoad] will be an [page:object] that contains loaded parts: .[page:Scene scene], .[page:Array scenes], .[page:Array cameras], .[page:Array animations], and .[page:Object asset].
Parse a glTF-based ArrayBuffer or <em>JSON</em> String and fire [page:Function onLoad] callback when complete. The argument to [page:Function onLoad] will be an [page:object] that contains loaded parts: .[page:Scene scene], .[page:Array scenes], .[page:Array cameras], .[page:Array animations], and .[page:Object asset].
[page:Function functionCodeBuilder] - Function that is invoked with funcBuildObject and funcBuildSingleton that allows stringification of objects and singletons.<br>
[page:Function functionCodeBuilder] - Function that is invoked with funcBuildObject and funcBuildSingleton that allows stringification of objects and singletons.<br>
Array of [page:String libLocations] - URL of libraries that shall be added to worker code relative to libPath.<br>
Array of [page:String libLocations] - URL of libraries that shall be added to worker code relative to libPath.<br>
[page:String libPath] - Base path used for loading libraries.<br>
[page:String libPath] - Base path used for loading libraries.<br>
[page:LoaderSupport.WorkerRunnerRefImpl runnerImpl] - The default worker parser wrapper implementation (communication and execution). An extended class could be passed here.
[page:LoaderSupport.WorkerRunnerRefImpl runnerImpl] - The default worker parser wrapper implementation (communication and execution). An extended class could be passed here.
- </div>
- <div>
+ </p>
+ <p>
Validate the status of worker code and the derived worker.
Validate the status of worker code and the derived worker.
[page:String url] — A string containing the path/URL of the <em>.mtl</em> file.<br />
[page:String url] — A string containing the path/URL of the <em>.mtl</em> file.<br />
[page:Function onLoad] — (optional) A function to be called after the loading is successfully completed. The function receives the loaded [page:MTLLoaderMaterialCreator MTLLoader.MaterialCreator] instance.<br />
[page:Function onLoad] — (optional) A function to be called after the loading is successfully completed. The function receives the loaded [page:MTLLoaderMaterialCreator MTLLoader.MaterialCreator] instance.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Begin loading from url and return the loaded material.
Begin loading from url and return the loaded material.
Set base path for resolving texture references. If set this path will be prepended found texture reference. If not set and setPath is, it will be used as texture base path.
Set base path for resolving texture references. If set this path will be prepended found texture reference. If not set and setPath is, it will be used as texture base path.
<li>side: Which side to apply the material. THREE.FrontSide (default), THREE.BackSide, THREE.DoubleSide</li>
<li>side: Which side to apply the material. THREE.FrontSide (default), THREE.BackSide, THREE.DoubleSide</li>
@@ -81,19 +81,19 @@
<li>ignoreZeroRGBs: Ignore values of RGBs (Ka,Kd,Ks) that are all 0's. Default: false</li>
<li>ignoreZeroRGBs: Ignore values of RGBs (Ka,Kd,Ks) that are all 0's. Default: false</li>
<li>invertTrProperty: Use values 1 of Tr field for fully opaque. This option is useful for obj exported from 3ds MAX, vcglib or meshlab. Default: false</li>
<li>invertTrProperty: Use values 1 of Tr field for fully opaque. This option is useful for obj exported from 3ds MAX, vcglib or meshlab. Default: false</li>
- <div class="desc">A loader for loading a <em>.obj</em> resource.<br />
+ <p class="desc">A loader for loading a <em>.obj</em> resource.<br />
The <a href="https://en.wikipedia.org/wiki/Wavefront_.obj_file">OBJ file format</a> is a simple data-format
The <a href="https://en.wikipedia.org/wiki/Wavefront_.obj_file">OBJ file format</a> is a simple data-format
that represents 3D geometry in a human readable format as the position of each vertex, the UV position of
that represents 3D geometry in a human readable format as the position of each vertex, the UV position of
each texture coordinate vertex, vertex normals, and the faces that make each polygon defined as a list of
each texture coordinate vertex, vertex normals, and the faces that make each polygon defined as a list of
vertices, and texture vertices.
vertices, and texture vertices.
- </div>
+ </p>
<h2>Example</h2>
<h2>Example</h2>
@@ -56,12 +56,12 @@
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]( [param:LoadingManager manager] )</h3>
<h3>[name]( [param:LoadingManager manager] )</h3>
- <div>
+ <p>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:String url] — A string containing the path/URL of the <em>.obj</em> file.<br />
[page:String url] — A string containing the path/URL of the <em>.obj</em> file.<br />
[page:Function onLoad] — (optional) A function to be called after the loading is successfully completed. The function receives the loaded [page:Object3D] as an argument.<br />
[page:Function onLoad] — (optional) A function to be called after the loading is successfully completed. The function receives the loaded [page:Object3D] as an argument.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The function receives a XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The function receives a XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives error as an argument.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Begin loading from url and call onLoad with the parsed response content.
Begin loading from url and call onLoad with the parsed response content.
[page:LoadingManager manager] - The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].<br>
[page:LoadingManager manager] - The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].<br>
[page:LoaderSupport.ConsoleLogger logger] - logger to be used
[page:LoaderSupport.ConsoleLogger logger] - logger to be used
- </div>
- <div>
+ </p>
+ <p>
Use [name] to load OBJ data from files or to parse OBJ data from arraybuffer or text.
Use [name] to load OBJ data from files or to parse OBJ data from arraybuffer or text.
[page:String url] - A string containing the path/URL of the file to be loaded.<br>
[page:String url] - A string containing the path/URL of the file to be loaded.<br>
[page:Function onLoad] - A function to be called after loading is successfully completed. The function receives loaded [page:Object3D] as an argument.<br>
[page:Function onLoad] - A function to be called after loading is successfully completed. The function receives loaded [page:Object3D] as an argument.<br>
[page:Function onProgress] - (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br>
[page:Function onProgress] - (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br>
[page:Function onError] - (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br>
[page:Function onError] - (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br>
[page:Function onMeshAlter] - (optional) A function to be called after a new mesh raw data becomes available for alteration.<br>
[page:Function onMeshAlter] - (optional) A function to be called after a new mesh raw data becomes available for alteration.<br>
[page:boolean useAsync] - (optional) If true, uses async loading with worker, if false loads data synchronously.
[page:boolean useAsync] - (optional) If true, uses async loading with worker, if false loads data synchronously.
- </div>
- <div>
+ </p>
+ <p>
Use this convenient method to load a file at the given URL. By default the fileLoader uses an ArrayBuffer.
Use this convenient method to load a file at the given URL. By default the fileLoader uses an ArrayBuffer.
- <div class="desc">A loader for loading a <em>.pcd</em> resource. <br />
+ <p class="desc">A loader for loading a <em>.pcd</em> resource. <br />
Point Cloud Data is a file format for <a href="https://en.wikipedia.org/wiki/Point_Cloud_Library">Point Cloud Library</a>. <br />
Point Cloud Data is a file format for <a href="https://en.wikipedia.org/wiki/Point_Cloud_Library">Point Cloud Library</a>. <br />
Loader support ascii and binary. Compressed binary files are not supported.
Loader support ascii and binary. Compressed binary files are not supported.
- </div>
+ </p>
<h2>Example</h2>
<h2>Example</h2>
@@ -54,44 +54,44 @@
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]( [param:LoadingManager manager] )</h3>
<h3>[name]( [param:LoadingManager manager] )</h3>
- <div>
+ <p>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:String url] — A string containing the path/URL of the <em>.pcd</em> file.<br />
[page:String url] — A string containing the path/URL of the <em>.pcd</em> file.<br />
[page:Function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives loaded [page:Object3D] as an argument.<br />
[page:Function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives loaded [page:Object3D] as an argument.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Begin loading from url and call onLoad with the parsed response content.
Begin loading from url and call onLoad with the parsed response content.
- <div class="desc">A loader for loading a <em>.pdb</em> resource.<br>
+ <p class="desc">A loader for loading a <em>.pdb</em> resource.<br>
The <a href="http://en.wikipedia.org/wiki/Protein_Data_Bank_(file_format)">Protein Data Bank</a> file format is a textual file describing the three-dimensional structures of molecules.
The <a href="http://en.wikipedia.org/wiki/Protein_Data_Bank_(file_format)">Protein Data Bank</a> file format is a textual file describing the three-dimensional structures of molecules.
- </div>
+ </p>
<h2>Example</h2>
<h2>Example</h2>
@@ -56,12 +56,12 @@
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]( [param:LoadingManager manager] )</h3>
<h3>[name]( [param:LoadingManager manager] )</h3>
- <div>
+ <p>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:String url] — A string containing the path/URL of the <em>.pdb</em> file.<br />
[page:String url] — A string containing the path/URL of the <em>.pdb</em> file.<br />
[page:Function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives the object having the following properties. [page:BufferGeometry geometryAtoms], [page:BufferGeometry geometryBonds] and the [page:Object JSON] structure.<br />
[page:Function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives the object having the following properties. [page:BufferGeometry geometryAtoms], [page:BufferGeometry geometryBonds] and the [page:Object JSON] structure.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Begin loading from url and call onLoad with the parsed response content.
Begin loading from url and call onLoad with the parsed response content.
- <div class="desc">A loader for loading a <em>.prwm</em> resource.<br />
+ <p class="desc">A loader for loading a <em>.prwm</em> resource.<br />
Packed Raw WebGL Model is an open-source binary file format for nD geometries specifically designed for
Packed Raw WebGL Model is an open-source binary file format for nD geometries specifically designed for
JavaScript and WebGL with a strong focus on fast parsing (from 1ms to 0.1ms in Chrome 59
JavaScript and WebGL with a strong focus on fast parsing (from 1ms to 0.1ms in Chrome 59
on a MBP Late 2013). The parsing of PRWM file is especially fast when the endianness of the file is
on a MBP Late 2013). The parsing of PRWM file is especially fast when the endianness of the file is
the same as the endianness of the client platform. More information
the same as the endianness of the client platform. More information
on this <a href="https://github.com/kchapelier/PRWM">here</a>.
on this <a href="https://github.com/kchapelier/PRWM">here</a>.
- </div>
+ </p>
<h2>Example</h2>
<h2>Example</h2>
@@ -57,12 +57,12 @@
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]( [param:LoadingManager manager] )</h3>
<h3>[name]( [param:LoadingManager manager] )</h3>
- <div>
+ <p>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:String url] — A string containing the path/URL of the <em>.prwm</em> file. Any <em>*</em> character in the URL will be automatically replaced by <em>le</em> or <em>be</em> depending on the platform endianness.<br />
[page:String url] — A string containing the path/URL of the <em>.prwm</em> file. Any <em>*</em> character in the URL will be automatically replaced by <em>le</em> or <em>be</em> depending on the platform endianness.<br />
[page:Function onLoad] — (optional) A function to be called after the loading is successfully completed. The function receives the loaded [page:BufferGeometry] as an argument.<br />
[page:Function onLoad] — (optional) A function to be called after the loading is successfully completed. The function receives the loaded [page:BufferGeometry] as an argument.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The function receives a XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The function receives a XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives error as an argument.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Begin loading from url and call onLoad with the parsed response content.
Begin loading from url and call onLoad with the parsed response content.
- <div class="desc">A loader for loading a <em>.svg</em> resource.<br >
+ <p class="desc">A loader for loading a <em>.svg</em> resource.<br >
<a href="https://en.wikipedia.org/wiki/Scalable_Vector_Graphics">Scalabe Vector Graphics</a> is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation.
<a href="https://en.wikipedia.org/wiki/Scalable_Vector_Graphics">Scalabe Vector Graphics</a> is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation.
- </div>
+ </p>
<h2>Example</h2>
<h2>Example</h2>
@@ -51,12 +51,12 @@
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]( [param:LoadingManager manager] )</h3>
<h3>[name]( [param:LoadingManager manager] )</h3>
- <div>
+ <p>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:String url] — A string containing the path/URL of the <em>.svg</em> file.<br />
[page:String url] — A string containing the path/URL of the <em>.svg</em> file.<br />
[page:Function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives the loaded [page:SVGDocument] as an argument.<br />
[page:Function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives the loaded [page:SVGDocument] as an argument.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains [page:Integer total] and [page:Integer loaded] bytes.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Begin loading from url and call onLoad with the response content.
Begin loading from url and call onLoad with the response content.
- <div class="desc">A loader for loading a <em>.tga</em> resource. <br />
+ <p class="desc">A loader for loading a <em>.tga</em> resource. <br />
<a href="https://en.wikipedia.org/wiki/Truevision_TGA">TGA</a> is a raster graphics, image file format.
<a href="https://en.wikipedia.org/wiki/Truevision_TGA">TGA</a> is a raster graphics, image file format.
- </div>
+ </p>
<h2>Example</h2>
<h2>Example</h2>
@@ -55,26 +55,26 @@
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]( [param:LoadingManager manager] )</h3>
<h3>[name]( [param:LoadingManager manager] )</h3>
- <div>
+ <p>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
[page:String url] — A string containing the path/URL of the <em>.tga</em> file. <br />
[page:String url] — A string containing the path/URL of the <em>.tga</em> file. <br />
[page:Function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives loaded [page:DataTexture] as an argument.<br />
[page:Function onLoad] — (optional) A function to be called after loading is successfully completed. The function receives loaded [page:DataTexture] as an argument.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, which contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
[page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives the error as an argument.<br />
- </div>
- <div>
+ </p>
+ <p>
Begin loading from url and pass the loaded [page:DataTexture texture] to onLoad. The [page:DataTexture texture] is also directly returned for immediate use (but may not be fully loaded).
Begin loading from url and pass the loaded [page:DataTexture texture] to onLoad. The [page:DataTexture texture] is also directly returned for immediate use (but may not be fully loaded).
[page:VertexNode vertex] - [page:VertexNode] A reference to its destination vertex.<br /><br />
[page:VertexNode vertex] - [page:VertexNode] A reference to its destination vertex.<br /><br />
[page:Face face] - [page:Face] A reference to its face.<br />
[page:Face face] - [page:Face] A reference to its face.<br />
-
- </div>
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:VertexNode vertex]</h3>
<h3>[property:VertexNode vertex]</h3>
- <div>
+ <p>
Reference to the destination vertex. The origin vertex can be obtained by querying the destination of its twin, or of the previous half-edge. Default is undefined.
Reference to the destination vertex. The origin vertex can be obtained by querying the destination of its twin, or of the previous half-edge. Default is undefined.
- </div>
+ </p>
<h3>[property:HalfEdge prev]</h3>
<h3>[property:HalfEdge prev]</h3>
- <div>
+ <p>
Reference to the previous half-edge of the same face. Default is null.
Reference to the previous half-edge of the same face. Default is null.
- </div>
+ </p>
<h3>[property:HalfEdge next]</h3>
<h3>[property:HalfEdge next]</h3>
- <div>
+ <p>
Reference to the next half-edge of the same face. Default is null.
Reference to the next half-edge of the same face. Default is null.
- </div>
+ </p>
<h3>[property:HalfEdge twin]</h3>
<h3>[property:HalfEdge twin]</h3>
- <div>
+ <p>
Reference to the twin half-edge to reach the opposite face. Default is null.
Reference to the twin half-edge to reach the opposite face. Default is null.
- </div>
+ </p>
<h3>[property:Face face]</h3>
<h3>[property:Face face]</h3>
- <div>
+ <p>
Each half-edge bounds a single face and thus has a reference to that face. Default is undefined.
Each half-edge bounds a single face and thus has a reference to that face. Default is undefined.
- </div>
+ </p>
<h2>Methods</h2>
<h2>Methods</h2>
<h3>[method:VertexNode head]()</h3>
<h3>[method:VertexNode head]()</h3>
- <div>Returns the destintation vertex.</div>
+ <p>Returns the destintation vertex.</p>
<h3>[method:VertexNode tail]()</h3>
<h3>[method:VertexNode tail]()</h3>
- <div>Returns the origin vertex.</div>
+ <p>Returns the origin vertex.</p>
<h3>[method:Float length]()</h3>
<h3>[method:Float length]()</h3>
- <div>Returns the [link:https://en.wikipedia.org/wiki/Euclidean_distance Euclidean length]
- (straight-line length) of the edge.</div>
+ <p>Returns the [link:https://en.wikipedia.org/wiki/Euclidean_distance Euclidean length]
+ (straight-line length) of the edge.</p>
<h3>[method:Float lengthSquared]()</h3>
<h3>[method:Float lengthSquared]()</h3>
- <div>Returns the square of the [link:https://en.wikipedia.org/wiki/Euclidean_distance Euclidean length]
- (straight-line length) of the edge.</div>
+ <p>Returns the square of the [link:https://en.wikipedia.org/wiki/Euclidean_distance Euclidean length]
General information about the Quickhull algorithm: Dirk Gregorius. March 2014, Game Developers Conference: [link:http://media.steampowered.com/apps/valve/2014/DirkGregorius_ImplementingQuickHull.pdf Implementing QuickHull].
General information about the Quickhull algorithm: Dirk Gregorius. March 2014, Game Developers Conference: [link:http://media.steampowered.com/apps/valve/2014/DirkGregorius_ImplementingQuickHull.pdf Implementing QuickHull].
- </div>
+ </p>
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]()</h3>
<h3>[name]()</h3>
-
- </div>
+ <p>
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:Float tolerance]</h3>
<h3>[property:Float tolerance]</h3>
- <div>
+ <p>
The epsilon value that is used for internal comparative operations. The calculation of this value depends on the size of the geometry. Default is -1.
The epsilon value that is used for internal comparative operations. The calculation of this value depends on the size of the geometry. Default is -1.
- </div>
+ </p>
<h3>[property:Array faces]</h3>
<h3>[property:Array faces]</h3>
- <div>
+ <p>
The generated faces of the convex hull. Default is an empty array.
The generated faces of the convex hull. Default is an empty array.
- </div>
+ </p>
<h3>[property:Array newFaces]</h3>
<h3>[property:Array newFaces]</h3>
- <div>
+ <p>
This array holds the faces that are generated within a single iteration. Default is an empty array.
This array holds the faces that are generated within a single iteration. Default is an empty array.
- </div>
+ </p>
<h3>[property:VertexList assigned]</h3>
<h3>[property:VertexList assigned]</h3>
- <div>
+ <p>
This [page:VertexList vertex list] holds all vertices that are assigned to a face. Default is an empty vertex list.
This [page:VertexList vertex list] holds all vertices that are assigned to a face. Default is an empty vertex list.
- </div>
+ </p>
<h3>[property:VertexList unassigned]</h3>
<h3>[property:VertexList unassigned]</h3>
- <div>
+ <p>
This [page:VertexList vertex list] holds all vertices that are not assigned to a face. Default is an empty vertex list.
This [page:VertexList vertex list] holds all vertices that are not assigned to a face. Default is an empty vertex list.
- </div>
+ </p>
<h3>[property:Array vertices]</h3>
<h3>[property:Array vertices]</h3>
- <div>
+ <p>
The internal representation of the given geometry data (an array of [page:VertexNode vertices]).
The internal representation of the given geometry data (an array of [page:VertexNode vertices]).
[page:VertexNode vertex] - The vetex to remove.<br /><br />
[page:VertexNode vertex] - The vetex to remove.<br /><br />
[page:Face face] - The target face.<br /><br />
[page:Face face] - The target face.<br /><br />
- <div>Removes a vertex from the 'assigned' list of vertices and from the given face. It also makes sure that the link from 'face' to the first vertex it sees in 'assigned' is linked correctly after the removal.</div>
+ <p>Removes a vertex from the 'assigned' list of vertices and from the given face. It also makes sure that the link from 'face' to the first vertex it sees in 'assigned' is linked correctly after the removal.</p>
[page:Vector3 eyePoint] - The 3D-coordinates of a point.<br /><br />
[page:Vector3 eyePoint] - The 3D-coordinates of a point.<br /><br />
@@ -133,40 +133,40 @@
[page:Face face] - The current face being tested.<br /><br />
[page:Face face] - The current face being tested.<br /><br />
[page:Array horizon] - The edges that form part of the horizon in CCW order.<br /><br />
[page:Array horizon] - The edges that form part of the horizon in CCW order.<br /><br />
- <div>Computes a chain of half edges in CCW order called the 'horizon'. For an edge to be part of the horizon it must join a face that can see 'eyePoint' and a face that cannot see 'eyePoint'.</div>
+ <p>Computes a chain of half edges in CCW order called the 'horizon'. For an edge to be part of the horizon it must join a face that can see 'eyePoint' and a face that cannot see 'eyePoint'.</p>
[page:VertexNode eyeVertex] - The vertex that is added to the hull.<br /><br />
[page:VertexNode eyeVertex] - The vertex that is added to the hull.<br /><br />
- <div>Adds a vertex to the hull with the following algorithm
+ <p>Adds a vertex to the hull with the following algorithm
<ul>
<ul>
<li>Compute the 'horizon' which is a chain of half edges. For an edge to belong to this group it must be the edge connecting a face that can see 'eyeVertex' and a face which cannot see 'eyeVertex'.</li>
<li>Compute the 'horizon' which is a chain of half edges. For an edge to belong to this group it must be the edge connecting a face that can see 'eyeVertex' and a face which cannot see 'eyeVertex'.</li>
<li>All the faces that can see 'eyeVertex' have its visible vertices removed from the assigned vertex list.</li>
<li>All the faces that can see 'eyeVertex' have its visible vertices removed from the assigned vertex list.</li>
<li>A new set of faces is created with each edge of the 'horizon' and 'eyeVertex'. Each face is connected with the opposite horizon face and the face on the left/right.</li>
<li>A new set of faces is created with each edge of the 'horizon' and 'eyeVertex'. Each face is connected with the opposite horizon face and the face on the left/right.</li>
<li>The vertices removed from all the visible faces are assigned to the new faces if possible.</li>
<li>The vertices removed from all the visible faces are assigned to the new faces if possible.</li>
</ul>
</ul>
- </div>
+ </p>
<h3>[method:QuickHull cleanup]()</h3>
<h3>[method:QuickHull cleanup]()</h3>
- <div>Cleans up internal properties after computing the convex hull.</div>
+ <p>Cleans up internal properties after computing the convex hull.</p>
<h3>[method:QuickHull compute]()</h3>
<h3>[method:QuickHull compute]()</h3>
- <div>Starts the execution of the quick hull algorithm.</div>
+ <p>Starts the execution of the quick hull algorithm.</p>
- <div class="desc">[name] is a simplified version of [page:CSS3DRenderer]. The only transformation that is supported is translation.<br />
+ <p class="desc">[name] is a simplified version of [page:CSS3DRenderer]. The only transformation that is supported is translation.<br /><br />
The renderer is very useful if you want to combine HTML based labels with 3D objects. Here too, the respective DOM elements are wrapped into an instance of *CSS2DObject* and added to the scene graph.<br />
The renderer is very useful if you want to combine HTML based labels with 3D objects. Here too, the respective DOM elements are wrapped into an instance of *CSS2DObject* and added to the scene graph.<br />
- Unlike [page:CSS3DRenderer], orthographic cameras are supported.
- </div>
+ </p>
<script>
<script>
@@ -33,9 +32,9 @@
<h2>Examples</h2>
<h2>Examples</h2>
- <div>
+ <p>
[example:webgl_loader_pdb molecules]
[example:webgl_loader_pdb molecules]
- </div>
+ </p>
<h2>Constructor</h2>
<h2>Constructor</h2>
@@ -44,19 +43,19 @@
<h2>Methods</h2>
<h2>Methods</h2>
<h3>[method:Object getSize]()</h3>
<h3>[method:Object getSize]()</h3>
- <div>
+ <p>
Returns an object containing the width and height of the renderer.
Returns an object containing the width and height of the renderer.
- <div class="desc">[name] can be used to apply hierarchical 3D transformations to DOM elements via the CSS3 [link:https://www.w3schools.com/cssref/css3_pr_transform.asp transform] property.<br />
- This renderer is particular interesting if you want to apply 3D effects to a website without canvas based rendering. It can also be used in order to combine DOM elements with WebGL content.<br />
+ <p class="desc">[name] can be used to apply hierarchical 3D transformations to DOM elements
+ via the CSS3 [link:https://www.w3schools.com/cssref/css3_pr_transform.asp transform] property.
+ This renderer is particular interesting if you want to apply 3D effects to a website without
+ canvas based rendering. It can also be used in order to combine DOM elements with WebGL
+ content.<br /><br />
There are, however, some important limitations:
There are, however, some important limitations:
<ul>
<ul>
<li>It's not possible to use the material system of *three.js*.</li>
<li>It's not possible to use the material system of *three.js*.</li>
<li>It's also not possible to use geometries.</li>
<li>It's also not possible to use geometries.</li>
- <li>Only [page:PerspectiveCamera] is supported right now.</li>
</ul>
</ul>
So [name] is just focused on ordinary DOM elements. These elements are wrapped into special objects (*CSS3DObject* or *CSS3DSprite*) and then added to the scene graph.
So [name] is just focused on ordinary DOM elements. These elements are wrapped into special objects (*CSS3DObject* or *CSS3DSprite*) and then added to the scene graph.
The Canvas renderer displays your beautifully crafted scenes <em>not</em> using WebGL,
The Canvas renderer displays your beautifully crafted scenes <em>not</em> using WebGL,
but draws it using the (slower) <a href="http://drafts.htmlwg.org/2dcontext/html5_canvas_CR/Overview.html">Canvas 2D Context</a>
but draws it using the (slower) <a href="http://drafts.htmlwg.org/2dcontext/html5_canvas_CR/Overview.html">Canvas 2D Context</a>
API.<br /><br />
API.<br /><br />
@@ -46,15 +46,15 @@
The "Canvas" in CanvasRenderer means it uses Canvas 2D instead of WebGL.<br /><br />
The "Canvas" in CanvasRenderer means it uses Canvas 2D instead of WebGL.<br /><br />
Don't confuse either CanvasRenderer with the SoftwareRenderer example, which simulates a screen buffer in a Javascript array.
Don't confuse either CanvasRenderer with the SoftwareRenderer example, which simulates a screen buffer in a Javascript array.
- </div>
+ </p>
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]([param:object parameters])</h3>
<h3>[name]([param:object parameters])</h3>
- <div>parameters is an optional object with properties defining the renderer's behaviour. The constructor also accepts no parameters at all. In all cases, it will assume sane defaults when parameters are missing.</div>
+ <p>parameters is an optional object with properties defining the renderer's behaviour. The constructor also accepts no parameters at all. In all cases, it will assume sane defaults when parameters are missing.</p>
- <div>
+ <p>
[page:DOMElement canvas] - A [link:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas canvas]
[page:DOMElement canvas] - A [link:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas canvas]
where the renderer draws its output.
where the renderer draws its output.
This corresponds to the [page:CanvasRenderer.domElement domElement] property below.
This corresponds to the [page:CanvasRenderer.domElement domElement] property below.
@@ -62,14 +62,14 @@
[page:Boolean alpha] - whether the canvas contains an alpha (transparency) buffer or not.
[page:Boolean alpha] - whether the canvas contains an alpha (transparency) buffer or not.
Default is *false*.
Default is *false*.
- </div>
+ </p>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:Object info]</h3>
<h3>[property:Object info]</h3>
- <div>
+ <p>
An object with a series of statistical information about the graphics board memory and the rendering process. Useful for debugging or just for the sake of curiosity. The object contains the following fields:
An object with a series of statistical information about the graphics board memory and the rendering process. Useful for debugging or just for the sake of curiosity. The object contains the following fields:
<ul>
<ul>
<li>render:
<li>render:
@@ -79,93 +79,93 @@
</ul>
</ul>
</li>
</li>
</ul>
</ul>
- </div>
+ </p>
<h3>[property:DOMElement domElement]</h3>
<h3>[property:DOMElement domElement]</h3>
- <div>
+ <p>
A [page:Canvas] where the renderer draws its output.<br />
A [page:Canvas] where the renderer draws its output.<br />
This is automatically created by the renderer in the constructor (if not provided already); you just need to add it to your page.
This is automatically created by the renderer in the constructor (if not provided already); you just need to add it to your page.
- </div>
+ </p>
<h3>[property:Boolean autoClear]</h3>
<h3>[property:Boolean autoClear]</h3>
- <div>
+ <p>
Defines whether the renderer should automatically clear its output before rendering.
Defines whether the renderer should automatically clear its output before rendering.
- </div>
+ </p>
<h3>[property:Boolean sortObjects]</h3>
<h3>[property:Boolean sortObjects]</h3>
- <div>
+ <p>
Defines whether the renderer should sort objects. Default is true.<br />
Defines whether the renderer should sort objects. Default is true.<br />
Note: Sorting is used to attempt to properly render objects that have some degree of transparency. By definition, sorting objects may not work in all cases. Depending on the needs of application, it may be neccessary to turn off sorting and use other methods to deal with transparency rendering e.g. manually determining the object rendering order.
Note: Sorting is used to attempt to properly render objects that have some degree of transparency. By definition, sorting objects may not work in all cases. Depending on the needs of application, it may be neccessary to turn off sorting and use other methods to deal with transparency rendering e.g. manually determining the object rendering order.
- </div>
+ </p>
<h3>[property:boolean sortElements]</h3>
<h3>[property:boolean sortElements]</h3>
- <div>
+ <p>
Defines whether the renderer should sort the face of each object. Default is true.
Defines whether the renderer should sort the face of each object. Default is true.
[name] can be used to render geometric data using SVG. The produced vector graphics are particular useful in the following use cases:
[name] can be used to render geometric data using SVG. The produced vector graphics are particular useful in the following use cases:
- <ul>
- <li>Animated logos or icons</li>
- <li>Interactive 2D/3D diagrams or graphs</li>
- <li>Interactive maps</li>
- <li>Complex or animated user interfaces</li>
- </ul>
+ </p>
+ <ul>
+ <li>Animated logos or icons</li>
+ <li>Interactive 2D/3D diagrams or graphs</li>
+ <li>Interactive maps</li>
+ <li>Complex or animated user interfaces</li>
+ </ul>
+ <p>
[name] has various advantages. It produces crystal-clear and sharp output which is independet of the actual viewport resolution.<br />
[name] has various advantages. It produces crystal-clear and sharp output which is independet of the actual viewport resolution.<br />
SVG elements can be styled via CSS. And they have good accessibility since it's possible to add metadata like title or description (useful for search engines or screen readers).
SVG elements can be styled via CSS. And they have good accessibility since it's possible to add metadata like title or description (useful for search engines or screen readers).
geometry -- The geometry for the set of materials. <br />
geometry -- The geometry for the set of materials. <br />
materials -- The materials for the object.
materials -- The materials for the object.
- </div>
- <div>
+ </p>
+ <p>
Creates a new Group that contains a new mesh for each material defined in materials. Beware that this is not the same as an array of materials which defines multiple materials for 1 mesh.<br />
Creates a new Group that contains a new mesh for each material defined in materials. Beware that this is not the same as an array of materials which defines multiple materials for 1 mesh.<br />
This is mostly useful for objects that need both a material and a wireframe implementation.
This is mostly useful for objects that need both a material and a wireframe implementation.
scene -- The scene to detach the object on. <br />
scene -- The scene to detach the object on. <br />
parent -- The parent to attach the object from.
parent -- The parent to attach the object from.
- </div>
- <div>
+ </p>
+ <p>
Attaches the object to the parent without the moving the object in the worldspace. Beware that to do this the matrixWorld needs to be updated, this can be done by calling the updateMatrixWorld method on the parent object.
Attaches the object to the parent without the moving the object in the worldspace. Beware that to do this the matrixWorld needs to be updated, this can be done by calling the updateMatrixWorld method on the parent object.
child -- The object to remove from the parent <br />
child -- The object to remove from the parent <br />
scene -- The scene to attach the object on. <br />
scene -- The scene to attach the object on. <br />
parent -- The parent to detach the object from.
parent -- The parent to detach the object from.
- </div>
- <div>
+ </p>
+ <p>
Detaches the object from the parent and adds it back to the scene without moving in worldspace. Beware that to do this the matrixWorld needs to be updated, this can be done by calling the updateMatrixWorld method on the parent object.
Detaches the object from the parent and adds it back to the scene without moving in worldspace. Beware that to do this the matrixWorld needs to be updated, this can be done by calling the updateMatrixWorld method on the parent object.