Skip to content

T
three.js

车家大少爷 / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

提交 f2c79358 编写于 作者: M Mr.doob 提交者： GitHub
浏览文件
操作

Merge pull request #12266 from cg-cnu/doc-loaders 

Refined documentation for loaders
上级 31d8b0ae 99c0ba50
隐藏空白更改
内联 并排
Showing with 204 addition and 88 deletion
docs/examples/loaders/BabylonLoader.html
浏览文件 @ f2c79358
......@@ -8,10 +8,12 @@
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">A loader for loading a <em>.babylon</em> resource.</div>
<div class="desc">A loader for loading a <em>.babylon</em> resource. <br />
The <a href="https://doc.babylonjs.com/generals/file_format_map_(.babylon)"> .babylon </a> file format used by
<a href="https://www.babylonjs.com/">Babylon.js</a>.
</div>
<h2>Example</h2>
......@@ -23,17 +25,23 @@
loader.load(
// resource URL
'models/babylon/skull.babylon',
// Function when resource is loaded
// called when resource is loaded
function ( object ) {
scene.add( object );
},
// Function called when download progresses
// called when loading is in progress
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// Function called when download errors
// called when loading has errors
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
......@@ -57,10 +65,10 @@
<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:Object3D].<br />
[page:function onProgress] — Will be called while load progresses. The argument will be the XMLHttpRequest instance, which contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:function onError] — Will be called when load errors.<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 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 />
</div>
<div>
Begin loading from url and call onLoad with the parsed response content.
......
docs/examples/loaders/GLTFLoader.html
浏览文件 @ f2c79358
......@@ -11,9 +11,7 @@
[page:Loader] &rarr;
<h1>[name]</h1>
<div class="desc">
A loader for *glTF* 2.0 resources.
<br /><br />
<div class="desc"> A loader for loading <em>glTF 2.0</em> resource. <br />
<a href="https://www.khronos.org/gltf">glTF</a> (GL Transmission Format) is an
<a href="https://github.com/KhronosGroup/glTF/tree/master/specification/2.0">open format specification</a>
for efficient delivery and loading of 3D content. Assets may be provided either in JSON (.gltf)
......@@ -48,19 +46,38 @@
<h2>Example</h2>
<code>
// Instantiate a loader
var loader = new THREE.GLTFLoader();
// Load a glTF resource
loader.load( 'models/gltf/duck/duck.gltf', function ( gltf ) {
scene.add( gltf.scene );
gltf.animations; // Array&lt;THREE.AnimationClip&gt;
gltf.scene; // THREE.Scene
gltf.scenes; // Array&lt;THREE.Scene&gt;
gltf.cameras; // Array&lt;THREE.Camera&gt;
} );
</code>
// Instantiate a loader
var loader = new THREE.GLTFLoader();
// Load a glTF resource
loader.load(
// resource URL
'models/gltf/duck/duck.gltf',
// called when the resource is loaded
function ( gltf ) {
scene.add( gltf.scene );
gltf.animations; // Array&lt;THREE.AnimationClip&gt;
gltf.scene; // THREE.Scene
gltf.scenes; // Array&lt;THREE.Scene&gt;
gltf.cameras; // Array&lt;THREE.Camera&gt;
},
// called when loading is in progresses
function ( xhr ) {
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// called when loading has errors
function ( error ) {
console.log( 'An error happened' );
}
);
</code>
[example:webgl_loader_gltf]
......@@ -81,10 +98,10 @@
<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 JSON response returned from [page:Function parse].<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XMLHttpRequest instance, that contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<br />
[page:String url] — A string containing the path/URL of the <em>.gltf</em> or <em>.glb</em> file.<br />
[page:Function onLoad] — (optional) 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 onError] — (optional) A function to be called if an error occurs during loading. The function receives error as an argument.<br />
</div>
<div>
Begin loading from url and call the callback function with the parsed response content.
......
docs/examples/loaders/MTLLoader.html
浏览文件 @ f2c79358
......@@ -11,7 +11,10 @@
<h1>[name]</h1>
<div class="desc">A loader for loading an <em>.mtl</em> resource, used internaly by [page:OBJMTLLoader] and [page:UTF8Loader].</div>
<div class="desc">A loader for loading an <em>.mtl</em> resource, used internaly by [page:OBJMTLLoader] and [page:UTF8Loader].<br />
The Material Template Library format (MTL) or .MTL File Format is a companion file format to .OBJ that describes surface shading
(material) properties of objects within one or more .OBJ files.
</div>
<h2>Constructor</h2>
......@@ -23,7 +26,7 @@
Creates a new [name].
</div>
<!-- <h2>Properties</h2> -->
<h2>Properties</h2>
<h2>Methods</h2>
......@@ -31,10 +34,10 @@
<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:MTLLoaderMaterialCreator MTLLoader.MaterialCreator] instance.<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XMLHttpRequest instance, which contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<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 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 />
</div>
<div>
Begin loading from url and return the loaded material.
......
docs/examples/loaders/OBJLoader.html
浏览文件 @ f2c79358
......@@ -11,7 +11,12 @@
<h1>[name]</h1>
<div class="desc">A loader for loading an <em>.obj</em> resource.</div>
<div 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
that represents 3D geometry in a human redeable 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
vertices, and texture vertices.
</div>
<h2>Example</h2>
......@@ -24,9 +29,23 @@
loader.load(
// resource URL
'models/monster.obj',
// Function when resource is loaded
// called when resource is loaded
function ( object ) {
scene.add( object );
},
// called when loading is in progresses
function ( xhr ) {
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// called when loading has errors
function ( error ) {
console.log( 'An error happened' );
}
);
</code>
......@@ -51,10 +70,10 @@
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — A string representing the path to the obj file. Required.<br />
[page:Function onLoad] — A function to be called when the load completes. The function receives loaded [page:Object3D] as an argument.<br />
[page:Function onProgress] — 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] — A function to be called if the request fails. The function receives the error.<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 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 />
</div>
<div>
Begin loading from url and call onLoad with the parsed response content.
......
docs/examples/loaders/OBJLoader2.html
浏览文件 @ f2c79358
......@@ -11,7 +11,12 @@
<h1>[name]</h1>
<div class="desc">A loader for loading an <em>.obj</em> resource.</div>
<div 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
that represents 3D geometry in a human redeable 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
vertices, and texture vertices.
</div>
<h2>Examples</h2>
......@@ -67,15 +72,15 @@
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError], [page:Function onMeshAlter], [page:boolean useAsync] )</h3>
<div>
[page:String url] - URL of the file to load<br>
[page:Function onLoad] - Called after loading was successfully completed<br>
[page:Function onProgress] - Called to report progress of loading. The argument will be the XMLHttpRequest instance, which contains .[page:Integer total] and .[page:Integer loaded] bytes.<br>
[page:Function onError] - Called after an error occurred during loading.<br>
[page:Function onMeshAlter] - Called after a new mesh raw data becomes available to allow alteration<br>
[page:boolean useAsync] - If true uses async loading with worker, if false loads data synchronously
[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 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 onError] - (optional) A function to be called if an error occurrs 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:boolean useAsync] - (optional) If true, uses async loading with worker, if false loads data synchronously.
</div>
<div>
Use this convenient method to load an OBJ file at the given URL. Per default the fileLoader uses an arraybuffer.
Use this convenient method to load an OBJ file at the given URL. By default the fileLoader uses an arraybuffer.
</div>
......
docs/examples/loaders/PCDLoader.html
浏览文件 @ f2c79358
......@@ -11,8 +11,10 @@
<h1>[name]</h1>
<div class="desc">A loader for <em>PCD</em> files. Loads ascii and binary.
Compressed binary files are not supported.</div>
<div 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 />
Loader support ascii and binary. Compressed binary files are not supported.
</div>
<h2>Example</h2>
......@@ -24,10 +26,24 @@
// load a resource
loader.load(
// resource URL
'pointcloud.pcd' ,
// Function when resource is loaded
'pointcloud.pcd',
// called when the resource is loaded
function ( mesh ) {
scene.add( mesh );
},
// called when loading is in progresses
function ( xhr ) {
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// called when loading has errors
function ( error ) {
console.log( 'An error happened' );
}
);
</code>
......@@ -56,10 +72,10 @@
<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:Object3D].<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XMLHttpRequest instance, which contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<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 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 />
</div>
<div>
Begin loading from url and call onLoad with the parsed response content.
......
docs/examples/loaders/PDBLoader.html
浏览文件 @ f2c79358
......@@ -11,10 +11,8 @@
<h1>[name]</h1>
<div class="desc">
A loader for loading a <em>.pdb</em> resource.
<br /><br />
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 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.
</div>
<h2>Example</h2>
......@@ -27,7 +25,7 @@
loader.load(
// resource URL
'models/molecules/caffeine.pdb',
// Function when resource is loaded
// called when the resource is loaded
function ( pdb ) {
var geometryAtoms = pdb.geometryAtoms;
......@@ -35,14 +33,19 @@
var json = pdb.json;
console.log( 'This molecule has ' + json.atoms.length + ' atoms' );
},
// Function called when download progresses
// called when loading is in progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
// called when loading has errors
function ( error ) {
console.log( 'An error happened' );
}
);
</code>
......@@ -67,10 +70,10 @@
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String url] — required. URL to the <em>.pdb</em> file<br />
[page:Function onLoad] — Will be called when load completes. The arguments will be an [page:BufferGeometry geometryAtoms], [page:BufferGeometry geometryBonds] and the [page:Object JSON] structure.<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XMLHttpRequest instance, which contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<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 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 />
</div>
<div>
Begin loading from url and call onLoad with the parsed response content.
......
docs/examples/loaders/SVGLoader.html
浏览文件 @ f2c79358
......@@ -11,9 +11,47 @@
<h1>[name]</h1>
<div class="desc">A loader for loading an <em>.svg</em> resource.</div>
<div 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.
</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',
// called when the resource is loaded
function ( pdb ) {
var geometryAtoms = pdb.geometryAtoms;
var geometryBonds = pdb.geometryBonds;
var json = pdb.json;
console.log( 'This molecule has ' + json.atoms.length + ' atoms' );
},
// called when loading is in progresses
function ( xhr ) {
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// called when loading has errors
function ( error ) {
console.log( 'An error happened' );
}
);
</code>
[example:webgl_loader_svg]
<h2>Constructor</h2>
<h3>[name]( [page:LoadingManager manager] )</h3>
......@@ -31,10 +69,10 @@
<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:SVGDocument].<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the XMLHttpRequest instance, which contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<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 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 />
</div>
<div>
Begin loading from url and call onLoad with the response content.
......
docs/examples/loaders/TGALoader.html
浏览文件 @ f2c79358
......@@ -10,8 +10,9 @@
<body>
<h1>[name]</h1>
<div class="desc">Class for loading a <em>.tga</em> [page:DataTexture texture].</div>
<div 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.
</div>
<h2>Example</h2>
......@@ -23,20 +24,26 @@
var texture = loader.load(
// resource URL
'textures/crate_grey8.tga'
// Function when resource is loaded
// called when loading is completed
function ( texture ) {
console.log( 'Texture is loaded' );
},
// Function called when download progresses
// called when the loading is in progresses
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// Function called when download errors
function ( xhr ) {
// called when the loading failes
function ( error ) {
console.log( 'An error happened' );
}
);
var material = new THREE.MeshPhongMaterial( {
color: 0xffffff,
map: texture
......@@ -60,10 +67,10 @@
<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, which contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
[page:Function onError] — Will be called when load errors.<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 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 />
</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).
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或