提交 b0e0ebce 编写于 作者: L Lewy Blue 提交者: Mr.doob

Added missing docs for core loaders (#10053)

* Added docs for BinaryTextureLoader and DataTextureLoader

* Created doc for CubeTextureLoader

* Created doc for CompressedTextureLoader

* added fontloader doc

* added doc for AnimationLoader

* Moved examples before Constructor to be consistent across docs

* Added PCDLoader to list.js
上级 082c0986
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">Class for loading an animation in JSON format.</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.AnimationLoader();
// load a resource
loader.load(
// resource URL
'animations/animation.js',
// Function when resource is loaded
function ( animation ) {
// do something with the animation
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
<div>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<div>
Creates a new [name].
</div>
<h2>Methods</h2>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded [page:Texture texture].<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XmlHttpRequest instance, that contain .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
Begin loading from url and pass the loaded animation to onLoad.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -12,34 +12,6 @@
<div class="desc">Class for loading an [page:String AudioBuffer].</div>
<h2>Constructor</h2>
<h3>[name]( [page:String context], [page:LoadingManager manager] )</h3>
<div>
[page:String context] — The [page:String AudioContext] for the loader to use. Default is [page:String window.AudioContext].<br />
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<div>
Creates a new [name].
</div>
<h2>Methods</h2>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded text response.<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XmlHttpRequest instance, that contain .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
Begin loading from url and pass the loaded [page:String AudioBuffer] to onLoad.
</div>
<h2>Example</h2>
<code>
......@@ -81,7 +53,30 @@
);
</code>
<h2>Constructor</h2>
<h3>[name]( [page:String context], [page:LoadingManager manager] )</h3>
<div>
[page:String context] — The [page:String AudioContext] for the loader to use. Default is [page:String window.AudioContext].<br />
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<div>
Creates a new [name].
</div>
<h2>Methods</h2>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded text response.<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XmlHttpRequest instance, that contain .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
Begin loading from url and pass the loaded [page:String AudioBuffer] to onLoad.
</div>
<h2>Source</h2>
......
......@@ -13,6 +13,32 @@
<div class="desc">A loader for loading a <em>.babylon</em> resource.</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.BabylonLoader();
// load a Babylon resource
loader.load(
// resource URL
'models/babylon/skull.babylon',
// Function when resource is loaded
function ( object ) {
scene.add( object );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
[example:webgl_loader_babylon]
<h2>Constructor</h2>
......@@ -50,34 +76,6 @@
Lights are parsed accordingly.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.BabylonLoader();
// load a Babylon resource
loader.load(
// resource URL
'models/babylon/skull.babylon',
// Function when resource is loaded
function ( object ) {
scene.add( object );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
[example:webgl_loader_babylon]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/BabylonLoader.js examples/js/loaders/BabylonLoader.js]
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">
Abstract base class to load generic binary textures formats (rgbe, hdr, ...).<br /><br />
</div>
<h2>Examples</h2>
<div>
See the [link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/RGBELoader.js RGBELoader]
for an example of a derived class.
</div>
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
<div>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use.
Default is [page:LoadingManager THREE.DefaultLoadingManager].<br /><br />
Creates a new [name].
</div>
<h2>Properties</h2>
<h3>[property:LoadingManager loadingManager]</h3>
<div>
loadingManager — the LoadingManager supplied in the constructor, or the [page:LoadingManager THREE.DefaultLoadingManager].<br />
</div>
<h2>Methods</h2>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded texture.<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XmlHttpRequest instance, that contain .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
Begin loading from url and pass the loaded texture to onLoad.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -12,7 +12,33 @@
<div class="desc">A loader for loading a [page:BufferGeometry].</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.BufferGeometryLoader();
// load a resource
loader.load(
// resource URL
'models/json/pressure.json',
// Function when resource is loaded
function ( geometry ) {
var material = new THREE.MeshLambertMaterial( { color: 0xF5F5F5 } );
var object = new THREE.Mesh( geometry, material );
scene.add( object );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
......@@ -48,34 +74,6 @@
Parse a <em>JSON</em> structure and return a [page:BufferGeometry].
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.BufferGeometryLoader();
// load a resource
loader.load(
// resource URL
'models/json/pressure.json',
// Function when resource is loaded
function ( geometry ) {
var material = new THREE.MeshLambertMaterial( { color: 0xF5F5F5 } );
var object = new THREE.Mesh( geometry, material );
scene.add( object );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -13,6 +13,31 @@
<div class="desc">A loader for <em>Collada</em> files.</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.ColladaLoader();
loader.load(
// resource URL
'models/collada/monster/monster.dae',
// Function when resource is loaded
function ( collada ) {
scene.add( collada.scene );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
}
);
</code>
[example:webgl_loader_collada]<br />
[example:webgl_loader_collada_keyframe]<br />
[example:webgl_loader_collada_skinning]<br />
[example:webgl_loader_collada_kinematics]
<h2>Constructor</h2>
......@@ -80,33 +105,6 @@
Apply a skin (vertices, animation, bones) from a <em>collada skin controller</em>, on the given [page:Geometry].
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.ColladaLoader();
loader.load(
// resource URL
'models/collada/monster/monster.dae',
// Function when resource is loaded
function ( collada ) {
scene.add( collada.scene );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
}
);
</code>
[example:webgl_loader_collada]<br />
[example:webgl_loader_collada_keyframe]<br />
[example:webgl_loader_collada_skinning]<br />
[example:webgl_loader_collada_kinematics]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/ColladaLoader.js examples/js/loaders/ColladaLoader.js]
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">
Abstract base class for block based textures loader (dds, pvr, ...).<br /><br />
</div>
<h2>Examples</h2>
<div>
See the [link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/DDSLoader.js DDSLoader]
and [link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/PVRLoader.js PVRLoader]
for examples of a derived classes.
</div>
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
<div>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use.
Default is [page:LoadingManager THREE.DefaultLoadingManager].<br /><br />
Creates a new [name].
</div>
<h2>Properties</h2>
<h3>[property:LoadingManager manager]</h3>
<div>
manager — the LoadingManager supplied in the constructor, or the [page:LoadingManager THREE.DefaultLoadingManager].<br />
</div>
<h2>Methods</h2>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded texture.<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XmlHttpRequest instance, that contain .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
Begin loading from url and pass the loaded texture to onLoad.
</div>
<h3>[method:null setPath]( [page:String value] )</h3>
<div>
Set the path from which to load textures.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">Class for loading a [page:CubeTexture CubeTexture].</div>
<h2>Example</h2>
<code>
var scene = new THREE.Scene();
scene.background = new THREE.CubeTextureLoader()
.setPath( 'textures/cubeMaps/' )
.load( [
'1.png',
'2.png',
'3.png',
'4.png',
'5.png',
'6.png'
] );
</code>
<div>
[example:webgl_materials_cubemap materials / cubemap]<br />
[example:webgl_materials_cubemap_balls_reflection materials / cubemap / balls / reflection]<br />
[example:webgl_materials_cubemap_balls_refraction materials / cubemap / balls / refraction]<br />
[example:webgl_materials_cubemap_dynamic materials / cubemap / dynamic]<br />
[example:webgl_materials_cubemap_dynamic2 materials / cubemap / dynamic2]<br />
[example:webgl_materials_cubemap_refraction materials / cubemap / refraction]
</div>
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
<div>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<div>
Creates a new [name].
</div>
<h2>Properties</h2>
<h3>[property:String crossOrigin]</h3>
<div>
default — *null*.<br />
If set, assigns the *crossOrigin* attribute of the image to the value of *crossOrigin*, prior to starting the load.
</div>
<h2>Methods</h2>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded [page:Texture texture].<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XmlHttpRequest instance, that contain .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
Begin loading from url and pass the loaded [page:Texture texture] to onLoad.
</div>
<h3>[method:null setCrossOrigin]( [page:String value] )</h3>
<div>
Set the crossOrigin attribute.
</div>
<h3>[method:null setPath]( [page:String value] )</h3>
<div>
Set the path from which to load textures.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">This is a synonym for the [page:BinaryTextureLoader BinaryTextureLoader].
See that page for details.
</div>
</body>
</html>
......@@ -13,7 +13,6 @@
<div class="desc">A low level class for loading resources with XmlHttpRequest, used internaly by most loaders.</div>
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
......@@ -61,12 +60,6 @@
[page:String value] — the empty string (default), "arraybuffer", "blob", "document", "json", or "text".
</div>
<h2>Example</h2>
[example:webgl_morphtargets_human]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">
Class for loading a font in JSON format. Returns a [page:Font Font], which is an
array of [page:Shape Shape]s representing the font.<br /><br />
You can convert fonts online using [link:https://gero3.github.io/facetype.js/ facetype.js]
</div>
<h2>Examples</h2>
<div>
[example:webgl_geometry_text geometry / text ]<br />
[example:webgl_geometry_text_earcut geometry / text / earcut]<br />
[example:webgl_geometry_text_pnltri geometry / text / pnltri]<br />
</div>
<code>
var loader = new THREE.FontLoader();
var font = loader.load(
// resource URL
'fonts/helvetiker_bold.typeface.json'
// Function when resource is loaded
function ( font ) {
// do something with the font
scene.add( font );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
<div>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<div>
Creates a new [name].
</div>
<h2>Methods</h2>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded [page:Texture texture].<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XmlHttpRequest instance, that contain .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
Begin loading from url and pass the loaded [page:Texture texture] to onLoad.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -12,12 +12,40 @@
<h1>[name]</h1>
<div class="desc">
A loader for loading a <em>.gltf</em> resource in <em>JSON</em> format.
A loader for loading a *gltf* resource in JSON format.
<br /><br />
The <a href="https://www.khronos.org/gltf">glTF file format</a> is a JSON file format to enable rapid delivery and loading of 3D content.
</div>
<h2>Notes</h2>
<div>
When using custom shaders provided within a glTF file [page:THREE.GLTFLoader.Shaders] should be updated on each render loop. See [example:webgl_loader_gltf] demo source code for example usage.
</div>
<div>
This class is often used with [page:THREE.GLTFLoader.Animations THREE.GLTFLoader.Animations] to animate parsed animations. See [example:webgl_loader_gltf] demo source code for example usage.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.GLTFLoader();
// load a glTF resource
loader.load(
// resource URL
'models/gltf/duck/duck.json',
// Function when resource is loaded
function ( object ) {
scene.add( object.scene );
}
);
</code>
[example:webgl_loader_gltf]
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
......@@ -67,37 +95,6 @@
Parse a glTF-based <em>JSON</em> structure and fire [page:Function callback] when complete. The argument to [page:Function callback] will be an [page:object] that contains loaded parts: .[page:Scene scene], .[page:Array cameras], .[page:Array animations] and .[page:Array shaders]
</div>
<h2>Notes</h2>
<div>
When using custom shaders provided within a glTF file [page:THREE.GLTFLoader.Shaders] should be updated on each render loop. See [example:webgl_loader_gltf] demo source code for example usage.
</div>
<div>
This class is often used with [page:THREE.GLTFLoader.Animations THREE.GLTFLoader.Animations] to animate parsed animations. See [example:webgl_loader_gltf] demo source code for example usage.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.GLTFLoader();
// load a glTF resource
loader.load(
// resource URL
'models/gltf/duck/duck.json',
// Function when resource is loaded
function ( object ) {
scene.add( object.scene );
}
);
</code>
[example:webgl_loader_gltf]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/GLTFLoader.js examples/js/loaders/GLTFLoader.js]
......
......@@ -12,7 +12,38 @@
<div class="desc">A loader for loading an [page:Image].</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.ImageLoader();
// load a image resource
loader.load(
// resource URL
'textures/skyboxsun25degtest.png',
// Function when resource is loaded
function ( image ) {
// do something with it
// like drawing a part of it on a canvas
var canvas = document.createElement( 'canvas' );
var context = canvas.getContext( '2d' );
context.drawImage( image, 100, 100 );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
[example:webgl_shaders_ocean]
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
......@@ -51,39 +82,6 @@
The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.ImageLoader();
// load a image resource
loader.load(
// resource URL
'textures/skyboxsun25degtest.png',
// Function when resource is loaded
function ( image ) {
// do something with it
// like drawing a part of it on a canvas
var canvas = document.createElement( 'canvas' );
var context = canvas.getContext( '2d' );
context.drawImage( image, 100, 100 );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
[example:webgl_shaders_ocean]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -13,6 +13,26 @@
<div class="desc">A loader for loading objects in JSON format.</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.JSONLoader();
// load a resource
loader.load(
// resource URL
'models/animated/monster/monster.js',
// Function when resource is loaded
function ( geometry, materials ) {
var material = new THREE.MultiMaterial( materials );
var object = new THREE.Mesh( geometry, material );
scene.add( object );
}
);
</code>
[example:webgl_loader_json_blender]
<h2>Constructor</h2>
......@@ -54,28 +74,6 @@
Parse a <em>JSON</em> structure and return an [page:object] containing the parsed [page:Geometry geometry] and [page:Array materials].
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.JSONLoader();
// load a resource
loader.load(
// resource URL
'models/animated/monster/monster.js',
// Function when resource is loaded
function ( geometry, materials ) {
var material = new THREE.MultiMaterial( materials );
var object = new THREE.Mesh( geometry, material );
scene.add( object );
}
);
</code>
[example:webgl_loader_json_blender]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -12,6 +12,32 @@
<div class="desc">A loader for loading a [page:Material] in JSON format.</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.MaterialLoader();
// load a resource
loader.load(
// resource URL
'path/to/material.json',
// Function when resource is loaded
function ( material ) {
object.material = material;
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
<h2>Constructor</h2>
......@@ -45,34 +71,6 @@
Parse a <em>JSON</em> structure and create a new [page:Material] of the type [page:String json.type] with parameters defined in the json object.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.MaterialLoader();
// load a resource
loader.load(
// resource URL
'path/to/material.json',
// Function when resource is loaded
function ( material ) {
object.material = material;
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -14,6 +14,26 @@
<div class="desc">A loader for loading an <em>.obj</em> resource.</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.OBJLoader();
// load a resource
loader.load(
// resource URL
'models/monster.obj',
// Function when resource is loaded
function ( object ) {
scene.add( object );
}
);
</code>
[example:webgl_loader_obj]
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
......@@ -50,26 +70,6 @@
If an <em>obj</em> object or group uses multiple materials while declaring faces geometry groups and a [page:MultiMaterial] is used.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.OBJLoader();
// load a resource
loader.load(
// resource URL
'models/monster.obj',
// Function when resource is loaded
function ( object ) {
scene.add( object );
}
);
</code>
[example:webgl_loader_obj]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/OBJLoader.js examples/js/loaders/OBJLoader.js]
......
......@@ -12,6 +12,21 @@
<div class="desc">A loader for loading a JSON resource. Unlike the [page:JSONLoader], this one make use of the <em>.type</em> attributes of objects to map them to their original classes.</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.ObjectLoader();
// assuming we loaded a JSON structure from elsewhere
var object = loader.parse( a_json_object );
scene.add( object );
</code>
[example:webgl_loader_msgpack]
<h2>Constructor</h2>
......@@ -54,22 +69,6 @@
[page:String value] — The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.ObjectLoader();
// assuming we loaded a JSON structure from elsewhere
var object = loader.parse( a_json_object );
scene.add( object );
</code>
[example:webgl_loader_msgpack]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -11,7 +11,28 @@
<h1>[name]</h1>
<div class="desc">A loader for <em>PCD</em> files. Loads ascii and binary. Compressed binary files are not suported.</div>
<div class="desc">A loader for <em>PCD</em> files. Loads ascii and binary.
Compressed binary files are not supported.</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.PCDLoader();
// load a resource
loader.load(
// resource URL
'pointcloud.pcd' ,
// Function when resource is loaded
function ( mesh ) {
scene.add( mesh );
}
);
</code>
[example:webgl_loader_pcd]
<h2>Constructor</h2>
......@@ -52,31 +73,10 @@
[page:String url] — The file name or file url.
</div>
<div>
Parse an <em>pcd</em> binary structure and return an [page:Object3D].<br />
Parse an <em>pcd</em> binary structure and return an [page:Object3D].<br />
The object is converted to [page:Points] with a [page:BufferGeometry] and a [page:PointsMaterial].
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.PCDLoader();
// load a resource
loader.load(
// resource URL
'pointcloud.pcd' ,
// Function when resource is loaded
function ( mesh ) {
scene.add( mesh );
}
);
</code>
[example:webgl_loader_pcd]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/PCDLoader.js examples/js/loaders/PCDLoader.js]
......
......@@ -17,6 +17,33 @@
The <a href="http://en.wikipedia.org/wiki/Protein_Data_Bank_(file_format)">Protein Data Bank file format</a> is a textual file format describing the three-dimensional structures of molecules.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.PDBLoader();
// load a PDB resource
loader.load(
// resource URL
'models/molecules/caffeine.pdb',
// Function when resource is loaded
function ( geometryAtoms, geometryBonds, json ) {
console.log( 'This molecule has ' + json.atoms.length + ' atoms' );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
[example:webgl_loader_pdb]
<h2>Constructor</h2>
......@@ -61,33 +88,6 @@
Parse a <em>(JSON) pdb</em> structure and return two [page:Geometry]: one for atoms, one for bonds.<br />
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.PDBLoader();
// load a PDB resource
loader.load(
// resource URL
'models/molecules/caffeine.pdb',
// Function when resource is loaded
function ( geometryAtoms, geometryBonds, json ) {
console.log( 'This molecule has ' + json.atoms.length + ' atoms' );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
[example:webgl_loader_pdb]
<h2>Source</h2>
......
......@@ -13,31 +13,6 @@
<div class="desc">Class for loading a <em>.tga</em> [page:DataTexture texture].</div>
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
<div>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<div>
Creates a new [name].
</div>
<h2>Methods</h2>
<h3>[method:DataTexture load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded [page:DataTexture].<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XmlHttpRequest instance, that contain .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
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).
</div>
<h2>Example</h2>
<code>
......@@ -70,6 +45,29 @@
[example:webgl_materials_texture_tga]
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
<div>
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<div>
Creates a new [name].
</div>
<h2>Methods</h2>
<h3>[method:DataTexture load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded [page:DataTexture].<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XmlHttpRequest instance, that contain .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
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).
</div>
<h2>Source</h2>
......
......@@ -12,6 +12,35 @@
<div class="desc">Class for loading a [page:Texture texture].</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.TextureLoader();
// load a resource
loader.load(
// resource URL
'textures/land_ocean_ice_cloud_2048.jpg',
// Function when resource is loaded
function ( texture ) {
// do something with the texture
var material = new THREE.MeshBasicMaterial( {
map: texture
} );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
[example:canvas_geometry_earth]
<h2>Constructor</h2>
......@@ -46,39 +75,6 @@
Begin loading from url and pass the loaded [page:Texture texture] to onLoad.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.TextureLoader();
// load a resource
loader.load(
// resource URL
'textures/land_ocean_ice_cloud_2048.jpg',
// Function when resource is loaded
function ( texture ) {
// do something with the texture
var material = new THREE.MeshBasicMaterial( {
map: texture
} );
},
// Function called when download progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
[example:canvas_geometry_earth]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -95,12 +95,18 @@ var list = {
"Loaders": [
[ "AnimationLoader", "api/loaders/AnimationLoader" ],
[ "AudioLoader", "api/loaders/AudioLoader" ],
[ "BabylonLoader", "api/loaders/BabylonLoader" ],
[ "BinaryTextureLoader", "api/loaders/BinaryTextureLoader" ],
[ "BufferGeometryLoader", "api/loaders/BufferGeometryLoader" ],
[ "Cache", "api/loaders/Cache" ],
[ "ColladaLoader", "api/loaders/ColladaLoader" ],
[ "CompressedTextureLoader", "api/loaders/CompressedTextureLoader" ],
[ "CubeTextureLoader", "api/loaders/CubeTextureLoader" ],
[ "DataTextureLoader", "api/loaders/DataTextureLoader" ],
[ "FileLoader", "api/loaders/FileLoader" ],
[ "FontLoader", "api/loaders/FontLoader" ],
[ "GLTFLoader", "api/loaders/GLTFLoader" ],
[ "ImageLoader", "api/loaders/ImageLoader" ],
[ "JSONLoader", "api/loaders/JSONLoader" ],
......@@ -110,6 +116,7 @@ var list = {
[ "MTLLoader", "api/loaders/MTLLoader" ],
[ "OBJLoader", "api/loaders/OBJLoader" ],
[ "ObjectLoader", "api/loaders/ObjectLoader" ],
[ "PCDLoader", "api/loaders/PCDLoader" ],
[ "PDBLoader", "api/loaders/PDBLoader" ],
[ "SVGLoader", "api/loaders/SVGLoader" ],
[ "TextureLoader", "api/loaders/TextureLoader" ],
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册