Skip to content

Commit

Permalink
Merge pull request #5731 from TatumCreative/docs-renderers
Browse files Browse the repository at this point in the history 
Renderer docs
  • Loading branch information
@mrdoob
mrdoob committed Dec 7, 2014
2 parents d4e5594 + b2b98c8 commit 48c2a37
Show file tree
Hide file tree
Showing 5 changed files with 188 additions and 85 deletions.
52 changes: 39 additions & 13 deletions docs/api/cameras/CubeCamera.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,20 +11,46 @@

<h1>[name]</h1>

<div class="desc">Camera with cube projection</div>

<div class="desc">Creates 6 cameras that render to a [page:WebGLRenderTargetCube].</div>

<h2>Examples</h2>

<div>[example:webgl_materials_cubemap_dynamic materials / cubemap / dynamic ]</div>
<div>[example:webgl_materials_cubemap_dynamic2 materials / cubemap / dynamic2 ]</div>
<div>[example:webgl_materials_cubemap_dynamic2 shading / physical ]</div>

<code>//Create cube camera
var cubeCamera = new THREE.CubeCamera( 1, 100000, 128 );
scene.add( cubeCamera );

//Create car
var chromeMaterial = new THREE.MeshLambertMaterial( { color: 0xffffff, ambient: 0xffffff, envMap: cubeCamera.renderTarget } );
var car = new Mesh( carGeometry, chromeMaterial );
scene.add( car );

//Update the render target cube
car.setVisible( false );
cubeCamera.position.copy( car.position );
cubeCamera.updateCubeMap( renderer, scene );

//Render the scene
car.setVisible( true );
renderer.render( scene, camera );
</code>


<h2>Constructor</h2>


<h3>[name]([page:Float near], [page:Float far], [page:Float cubeResolution])</h3>
<h3>[name]([page:number near], [page:number far], [page:number cubeResolution])</h3>
<div>
near -- Camera frustum near plane. <br />
far -- Camera frustum far plane. <br />
cubeResolution -- The size of the render target image.
near -- The near clipping distance. <br />
far -- The far clipping distance <br />
cubeResolution -- Sets the width of the cube.
</div>
<div>
todo
Constructs a CubeCamera that contains 6 [page:PerspectiveCamera PerspectiveCameras] that then
render to a [page:WebGLRenderTargetCube]
</div>


Expand All @@ -34,20 +60,20 @@ <h2>Properties</h2>

<h3>[property:WebGLRenderTargetCube renderTarget]</h3>
<div>
The camera renders to this target.
</div>
The cube texture that gets generated.
</div>

<h2>Methods</h2>



<h3>[method:todo updateCubeMap]([page:WebGLRenderer], [page:Scene])</h3>
<h3>[method:todo updateCubeMap]([page:todo renderer], [page:todo scene])</h3>
<div>
renderer -- The renderer to use for this camera. <br />
scene -- The scene to render.
renderer -- The current WebGL renderer <br />
scene -- The current scene
</div>
<div>
todo
Call this to update the renderTarget.
</div>

<h2>Source</h2>
Expand Down
44 changes: 25 additions & 19 deletions docs/api/renderers/CanvasRenderer.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,12 +98,7 @@ <h3>[property:boolean sortElements]</h3>
<h2>Methods</h2>


<h3>[method:number getMaxAnisotropy]()</h3>
<div>
This returns the anisotropy level of the textures.
</div>

<h3>[method:todo render]( [page:Scene scene], [page:Camera camera])</h3>
<h3>[method:null render]( [page:Scene scene], [page:Camera camera])</h3>
<div>
scene -- The scene to render. <br />
camera -- the camera to view the scene.
Expand All @@ -112,12 +107,12 @@ <h3>[method:todo render]( [page:Scene scene], [page:Camera camera])</h3>
Render a scene using a camera.
</div>

<h3>[method:todo clear]()</h3>
<h3>[method:null clear]()</h3>
<div>
Tells the renderer to clear its color drawing buffer with the clearcolor.
</div>

<h3>[method:todo setClearColor]([page:Color color], [page:number alpha])</h3>
<h3>[method:null setClearColor]([page:Color color], [page:number alpha])</h3>
<div>
color -- The color to clear the canvas with. <br />
alpha -- The alpha channel to clear the canvas with.
Expand All @@ -126,17 +121,8 @@ <h3>[method:todo setClearColor]([page:Color color], [page:number alpha])</h3>
This set the clearColor and the clearAlpha.
</div>

<h3>[method:todo setFaceCulling]()</h3>
<div>
Empty function to keep compability with [page:WebglRenderer].
</div>

<h3>[method:todo supportsVertexTextures]()</h3>
<div>
Empty function to keep compability with [page:WebglRenderer].
</div>

<h3>[method:todo setSize]([page:Number width], [page:Number height], [page:boolean updateStyle])</h3>
<h3>[method:null setSize]([page:Number width], [page:Number height], [page:boolean updateStyle])</h3>
<div>
width -- The width of the drawing canvas. <br />
height -- The height of the drawing canvas. <br />
Expand All @@ -146,14 +132,34 @@ <h3>[method:todo setSize]([page:Number width], [page:Number height], [page:boole
This set the size of the drawing canvas and if updateStyle is set, then the css of the canvas is updated too.
</div>

<h3>[method:todo setClearColorHex]([page:number hex], [page:number alpha])</h3>
<h3>[method:null setClearColorHex]([page:number hex], [page:number alpha])</h3>
<div>
hex -- The the hexadecimal value of the color to clear the canvas with. <br />
alpha -- The alpha channel to clear the canvas with.
</div>
<div>
This set the clearColor and the clearAlpha.
</div>

<h3>[method:number getClearColorHex]()</h3>
<div>
Returns the [page:number hex] color.
</div>

<h3>[method:number getClearAlpha]()</h3>
<div>
Returns the alpha value.
</div>

<h2>Empty Methods to Maintain Compatibility with [page:WebglRenderer]</h2>
<div>
[method:null clearColor]()<br/>
[method:null clearDepth]()<br/>
[method:null clearStencil]()<br/>
[method:null setFaceCulling]()<br/>
[method:null supportsVertexTextures]()<br/>
[method:number getMaxAnisotropy]() - returns 1 <br/>
</div>

<h2>Source</h2>

Expand Down
85 changes: 84 additions & 1 deletion docs/api/renderers/WebGLRenderTarget.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,17 +19,100 @@ <h3>[name]([page:Number width], [page:Number height], [page:Object options])</h3
<div>
width -- The width of the renderTarget. <br />
height -- The height of the renderTarget. <br />
options -- The options of the renderTarget. They are alot like the options of a texture.
options -- The options sets the properties of the render target.
</div>
<div>
Creates a new renderTarget with a certain width and height.
</div>

<h2>Properties</h2>

<h3>[property:number wrapS]</h3>
<div>
The default is THREE.ClampToEdgeWrapping, where the edge is clamped to the outer edge texels. The other two choices are THREE.RepeatWrapping and THREE.MirroredRepeatWrapping.
</div>

<h3>[property:number wrapT]</h3>
<div>
The default is THREE.ClampToEdgeWrapping, where the edge is clamped to the outer edge texels. The other two choices are THREE.RepeatWrapping and THREE.MirroredRepeatWrapping.
</div>

<h3>[property:number magFilter]</h3>
<div>
How the texture is sampled when a texel covers more than one pixel. The default is THREE.LinearFilter, which takes the four closest texels and bilinearly interpolates among them. The other option is THREE.NearestFilter, which uses the value of the closest texel.
</div>

<h3>[property:number minFilter]</h3>
<div>
How the texture is sampled when a texel covers less than one pixel. The default is THREE.LinearMipMapLinearFilter, which uses mipmapping and a trilinear filter. Other choices are THREE.NearestFilter, THREE.NearestMipMapNearestFilter, THREE.NearestMipMapLinearFilter, THREE.LinearFilter, and THREE.LinearMipMapNearestFilter. These vary whether the nearest texel or nearest four texels are retrieved on the nearest mipmap or nearest two mipmaps. Interpolation occurs among the samples retrieved.
</div>

<h3>[property:number anisotropy]</h3>
<div>
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 renderer.getMaxAnisotropy() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.
</div>

<h3>[property:Vector2 repeat]</h3>
<div>
How many times the texture is repeated across the surface, in each direction U and V.
</div>

<h3>[property:Vector2 offset]</h3>
<div>
How much a single repetition of the texture is offset from the beginning, in each direction U and V. Typical range is 0.0 to 1.0.
</div>

<h3>[property:number format]</h3>
<div>
The default is THREE.RGBAFormat for the texture. Other formats are: THREE.AlphaFormat, THREE.RGBFormat, THREE.LuminanceFormat, and THREE.LuminanceAlphaFormat. There are also compressed texture formats, if the S3TC extension is supported: THREE.RGB_S3TC_DXT1_Format, THREE.RGBA_S3TC_DXT1_Format, THREE.RGBA_S3TC_DXT3_Format, and THREE.RGBA_S3TC_DXT5_Format.
</div>

<h3>[property:number type]</h3>
<div>
The default is THREE.UnsignedByteType. Other valid types (as WebGL allows) are THREE.ByteType, THREE.ShortType, THREE.UnsignedShortType, THREE.IntType, THREE.UnsignedIntType, THREE.FloatType, THREE.UnsignedShort4444Type, THREE.UnsignedShort5551Type, and THREE.UnsignedShort565Type.
</div>

<h3>[property:boolean depthBuffer]</h3>
<div>
Renders to the depth buffer. Default is true.
</div>

<h3>[property:boolean stencilBuffer]</h3>
<div>
Renders to the stencil buffer. Default is true.
</div>

<h3>[property:boolean generateMipmaps]</h3>
<div>
Whether to generate mipmaps (if possible) for a texture. True by default.
</div>

<h3>[property:WebGLRenderTarget shareDepthFrom]</h3>
<div>
Shares the depth from another WebGLRenderTarget. Default is null.
</div>


<h2>Methods</h2>

<h3>[method:null setSize]( [page:Number width], [page:Number height] )</h3>
<div>
Sets the size of the renderTarget.
</div>

<h3>[method:RenderTarget clone]()</h3>
<div>
Creates a copy of the render target.
</div>

<h3>[method:null dispose]()</h3>
<div>
Dispatches a dispose event.
</div>





<h3>[page:EventDispatcher EventDispatcher] methods are available on this class.</h3>

Expand Down
30 changes: 19 additions & 11 deletions docs/api/renderers/WebGLRenderTargetCube.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,34 +7,42 @@
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
[page:WebGLRenderTarget] &rarr;

<h1>[name]</h1>

<div class="desc">todo</div>
<div class="desc">[page:CubeCamera] uses this as its [page:WebGLRenderTarget]</div>

<h2>Examples</h2>

<div>See [page:CubeCamera] for examples.</div>


<h2>Constructor</h2>


<h3>[name]([page:todo width], [page:todo height], [page:todo options])</h3>
<div>
width -- todo <br />
height -- todo <br />
options -- todo
</div>
<h3>[name]([page:Number width], [page:Number height], [page:Object options])</h3>
<div>
todo
width -- The width of the renderTarget. <br />
height -- The height of the renderTarget. <br />
options -- The options sets the properties of the render target.
</div>


<h3>[name]()</h3>


<h2>Properties</h2>

<h3>[property:integer activeCubeFace]</h3>
<div>
The activeCubeFace property corresponds to a cube side (PX 0, NX 1, PY 2, NY 3, PZ 4, NZ 5) and is
used and set internally by the [page:CubeCamera].
</div>

<h3>See [page:WebGLRenderTarget] for inherited properties</h3>


<h2>Methods</h2>

<h3>See [page:WebGLRenderTarget] for inherited methods</h3>


<h2>Source</h2>
Expand Down
Loading

0 comments on commit 48c2a37

Please sign in to comment.