Skip to content

T
three.js

Ablesons / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

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

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

Merge pull request #5485 from vincent/doc.loaders 

Loaders documentation
上级 3341b59f ffe2c5dc
展开全部 隐藏空白更改
内联 并排
Showing with 1529 addition and 261 deletion
docs/api/loaders/BabylonLoader.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<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">A loader for loading a <em>.babylon</em> resource.</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>
<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:Object3D].<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 call onLoad with the parsed response content.
</div>
<h3>[method:Object3D parse]( [page:Object json] )</h3>
<div>
[page:Object json] — The <em>JSON</em> structure to parse.
</div>
<div>
Parse a <em>JSON</em> structure and return an [page:Object3D object] or a [page:Scene scene].<br />
Found objects are converted to [page:Mesh] with a [page:BufferGeometry] and a default [page:MeshPhongMaterial].<br />
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]
</body>
</html>
docs/api/loaders/BufferGeometryLoader.html
浏览文件 @ d23db267
......@@ -9,36 +9,72 @@
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<div class="desc">A loader for loading a [page:BufferGeometry].</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<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>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<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:BufferGeometry].<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 call onLoad with the parsed response content.
</div>
<h3>[method:BufferGeometry parse]( [page:Object json] )</h3>
<div>
todo
[page:Object json] — The <em>JSON</em> structure to parse.
</div>
<div>
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]
......
docs/api/loaders/Cache.html
浏览文件 @ d23db267
......@@ -9,36 +9,58 @@
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<div class="desc">A simple caching classe, used internaly by [page:XHRLoader].</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h3>[name]()</h3>
<div>
Creates a new [name].
</div>
<h2>Properties</h2>
<h3>todo</h3>
<h3>[property:Object files]</h3>
<div>
todo
</div>
An [page:Object object] that hold cached values.
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<h3>[method:null add]( [page:String key], value )</h3>
<div>
[page:String key] — required. A string key <br />
[page:Object] value — <br />
</div>
<div>
Adds a cache entry with that key to hold the value. If this key already holds a value, it is overwritten.
</div>
<h3>[method:null get]( [page:String key] )</h3>
<div>
[page:String key] — required. A string key <br />
</div>
<div>
Get the value of key. If the key does not exist the null value is returned.
</div>
<h3>[method:null remove]( [page:String key] )</h3>
<div>
[page:String key] — required. A string key <br />
</div>
<div>
todo
Remove the cached value associated with the key.
</div>
<h3>[method:null clear]()</h3>
<div>
Remove all values from the cache.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
docs/api/loaders/ColladaLoader.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<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">A loader for loading an <em>.babylon</em> resource.</div>
<h2>Constructor</h2>
<h3>[name]()</h3>
<div>
Creates a new [name].
</div>
<h2>Properties</h2>
<h3>[property:Array options]</h3>
<div>
&nbsp;.[page:Boolean centerGeometry] — Force [page:Geometry] to always be centered at the local origin of the containing [page: Mesh].<br />
&nbsp;.[page:Boolean convertUpAxis] — Axis conversion is done for geometries, animations, and controllers.<br />
&nbsp;.[page:Boolean subdivideFaces] — Force subdivision into multiple [page: Face3].<br />
&nbsp;.[page:String upAxis] — X, Y or Z<br />
&nbsp;.[page:Boolean defaultEnvMap] — Cubemap to use for reflective or refractive materials.<br />
</div>
<h3>[property:Object geometries]</h3>
<div>
Parsed <em>.dae</em> geometries.
</div>
<h2>Methods</h2>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress] )</h3>
<div>
[page:String url] — required<br />
[page:function onLoad] — Will be called when load completes. The argument will be an [page:Object object] containing loaded resources.<br />
[page:function onProgress] — Will be called while load progresses. The argument will be an object containing .[page:Integer total] and .[page:Integer loaded] bytes.<br />
</div>
<div>
Begin loading from url and call onLoad with the parsed response content.
</div>
<h3>[method:Object parse]( [page:Document doc], [page:Function callBack], [page:String url] )</h3>
<div>
[page:Document doc] — The <em>XML</em> document to parse.<br />
[page:Function callBack] — Will be called when parse completes.<br />
[page:String url] — The base url from which to find subsequent resources.<br />
</div>
<div>
Parse an <em>XML Document</em> and return an [page:Object object] that contain loaded parts: .[page:Scene scene], .[page:Array morphs], .[page:Array skins], .[page:Array animations], .[page:Object dae]
</div>
<h3>[method:null setPreferredShading]( [page:Integer shading] )</h3>
<div>
[page:Integer shading] — required
</div>
<div>
Set the .[page:Integer shading] property on the resource's materials.<br />
Options are [page:Materials THREE.SmoothShading], [page:Materials THREE.FlatShading], [page:Materials THREE.NoShading].
</div>
<h3>[method:null applySkin]( [page:Geometry geometry], [page:Object instanceCtrl], [page:Integer frame] )</h3>
<div>
[page:Geometry geometry] — required<br />
[page:Object instanceCtrl] — required. A collada <em>skinController</em><br />
[page:Integer frame] — optionnal. Default is 40<br />
</div>
<div>
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();
// load a Babylon resource
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/OBJLoader.js examples/js/loaders/BabylonLoader.js]
</body>
</html>
docs/api/loaders/ImageLoader.html
浏览文件 @ d23db267
......@@ -9,46 +9,79 @@
<body>
<h1>[name]</h1>
<div class="desc">A loader for loading an [page:Image image].</div>
<div class="desc">A loader for loading an [page:Image].</div>
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]([page:LoadingManager manager])</h3>
<div>
manager -- The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<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>
<h3>[property:String crossOrigin]</h3>
<div>
The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
</div>
<h2>Methods</h2>
<h3>[method:Image load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
onLoad -- Will be called when load completes. The argument will be the loaded Imageloader.
onProgress -- Will be called while load progresses. The argument will be the progress event.
onError -- Will be called when load errors.
url — required
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded Imageloader.<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the progress event.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
Begin loading from url and return the [page:Image image] object that will contain the data.
</div>
Begin loading from url and return the [page:Image image] object that will contain the data.
</div>
<h3>[method:todo setCrossOrigin]([page:String value])</h3>
<h3>[method:null setCrossOrigin]( [page:String value] )</h3>
<div>
value -- The crossOrigin string.
[page:String value] — The crossOrigin string.
</div>
<div>
The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
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>
......
docs/api/loaders/JSONLoader.html
浏览文件 @ d23db267
......@@ -15,54 +15,148 @@
<h2>Constructor</h2>
<h3>[name]([page:Boolean showStatus])</h3>
<h3>[name]( [page:Boolean showStatus] )</h3>
<div>
showStatus -- todo
[page:Boolean showStatus] — Show the status of loading div.
</div>
<div>
todo
Creates a new [name].
</div>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>[property:boolean withCredentials]</h3>
<div>
todo
</div>
If true, the ajax request will use cookies.
</div>
<h2>Properties inherited from [page:Loader]</h2>
<h3>[property:Boolean showStatus]</h3>
<div>If true, show loading status in the statusDomElement.</div>
<h3>[property:DOMElement statusDomElement]</h3>
<div>This is the recipient of status messages.</div>
<h3>[property:Function onLoadStart]</h3>
<div>Will be called when load starts.</div>
<div>The default is a function with empty body.</div>
<!--
<h3>[property:Function onLoadProgress]</h3>
<div>Will be called while load progresses.</div>
<div>The default is a function with empty body.</div>
-->
<h3>[property:Function onLoadComplete]</h3>
<div>Will be called when load completes.</div>
<div>The default is a function with empty body.</div>
<h2>Methods</h2>
<h3>[method:todo load]( [page:String url], [page:Function callback], [page:String texturePath] )</h3>
<h3>[method:null load]( [page:String url], [page:Function callback], [page:String texturePath] )</h3>
<div>
[page:String url] — required<br />
[page:Function callback] — required. Will be called when load completes. The arguments will be the loaded [page:Object3D] and the loaded [page:Array materials].<br />
[page:String texturePath] — optional. If not specified, textures will be assumed to be in the same folder as the Javascript model file.
</div>
<h3>[method:null loadAjaxJSON]([page:JSONLoader context], [page:String url], [page:Function callback], [page:String texturePath], [page:Function callbackProgress])</h3>
<div>
[page:JSONLoader context] — The [page:JSONLoader] instance<br />
[page:String url] — required<br />
[page:Function callback] — required. This function will be called with the loaded model as an instance of [page:Geometry geometry] when the load is completed.<br />
[page:String texturePath] — Base path for textures.<br />
[page:Function callbackProgress] — Will be called while load progresses. The argument will be an [page:Object] containing two attributes: .[page:Integer total] and .[page:Integer loaded] bytes.
</div>
<div>
Begin loading from url and call <em>callback</em> with the parsed response content.
</div>
<h3>[method:Object3D parse]( [page:Object json], [page:String texturePath] )</h3>
<div>
url — required<br />
callback — required. This function will be called with the loaded model as an instance of [page:Geometry geometry] when the load is completed.<br />
texturePath — optional. If not specified, textures will be assumed to be in the same folder as the Javascript model file.
[page:String json] — JSON object to parse.<br />
[page:String texturePath] — Base path for textures.
</div>
<div>
Parse a <em>JSON</em> structure and return an [page:Object] containing the parsed .[page:Geometry] and .[page:Array materials].
</div>
<h2>Methods inherited from [page:Loader]</h2>
<h3>[method:todo parse]([page:todo json], [page:todo texturePath])</h3>
<h3>[method:Boolean needsTangents]( [page:Array materials] )</h3>
<div>
json -- todo <br />
texturePath -- todo
[page:Array materials] — an array of [page:Material]
</div>
<div>
todo
Checks if the loaded object needs tangents based on its materials.
</div>
<h3>[method:todo loadAjaxJSON]([page:todo context], [page:todo url], [page:todo callback], [page:todo texturePath], [page:todo callbackProgress])</h3>
<h3>[method:null updateProgress]( [page:object progress] )</h3>
<div>
context -- todo <br />
url -- todo <br />
callback -- todo <br />
texturePath -- todo <br />
callbackProgress -- todo
[page:Object progress] — an object containing loaded(contains the amount of bytes loaded) and optionally total (containing the total amount of bytes).
</div>
<div>
todo
Updates the DOM object with the progress made.
</div>
<h3>[method:Material createMaterial]( [page:object m], [page:string texturePath] )</h3>
<div>
[page:Object m] — The parameters to create the material. <br />
[page:String texturePath] — The base path of the textures.
</div>
<div>
Creates the Material based on the parameters m.
</div>
<h3>[method:Array initMaterials]( [page:Array materials], [page:string texturePath] )</h3>
<div>
[page:Array materials] — an array of parameters to create materials. <br />
[page:String texturePath] — The base path of the textures.
</div>
<div>
Creates an array of [page:Material] based on the array of parameters m. The index of the parameters decide the correct index of the materials.
</div>
<h3>[method:String extractUrlBase]( [page:string url] )</h3>
<div>
[page:String url] — The url to extract the base url from.
</div>
<div>
Extract the base from the URL.
</div>
<h3>[method:DOMElement addStatusElement]()</h3>
<div>
Add a DOM element to indicate the progress and return the DOMElement
</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.MeshFaceMaterial( 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]
......
docs/api/loaders/Loader.html
浏览文件 @ d23db267
......@@ -15,9 +15,9 @@
<h2>Constructor</h2>
<h3>[name]([page:Boolean showStatus])</h3>
<h3>[name]( [page:Boolean showStatus] )</h3>
<div>
showStatus -- Show the status of loading div.
[page:Boolean showStatus] — Show the status of loading div.
</div>
<div>
Creates a new [name]. This should be called as base class.
......@@ -28,10 +28,10 @@
<h3>[property:Boolean showStatus]</h3>
<div>If true, show loading status in the statusDomElement.</div>
<h3>[property:DOMElement statusDomElement]</h3>
<div>This is the recipient of status messages.</div>
<h3>[property:Function onLoadStart]</h3>
<div>Will be called when load starts.</div>
<div>The default is a function with empty body.</div>
......@@ -39,63 +39,63 @@
<h3>[property:Function onLoadProgress]</h3>
<div>Will be called while load progresses.</div>
<div>The default is a function with empty body.</div>
<h3>[property:Function onLoadComplete]</h3>
<div>Will be called when load completes.</div>
<div>The default is a function with empty body.</div>
<h3>[property:string crossOrigin]</h3>
<div>
The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
</div>
<h2>Methods</h2>
<h3>[method:Boolean needsTangents]([page:Array materials])</h3>
<h3>[method:Boolean needsTangents]( [page:Array materials] )</h3>
<div>
materials -- an array of [page:Material]
[page:Array materials] — an array of [page:Material]
</div>
<div>
Checks if the loaded object needs tangents based on its materials.
</div>
<h3>[method:todo updateProgress]([page:object progress])</h3>
<h3>[method:null updateProgress]( [page:object progress] )</h3>
<div>
progress -- an object containing loaded(contains the amount of bytes loaded) and optionally total (containing the total amount of bytes).
[page:Object progress] — an object containing loaded(contains the amount of bytes loaded) and optionally total (containing the total amount of bytes).
</div>
<div>
Updates the DOM object with the progress made.
</div>
<h3>[method:Material createMaterial]([page:object m], [page:string texturePath])</h3>
<h3>[method:Material createMaterial]( [page:object m], [page:string texturePath] )</h3>
<div>
m -- The parameters to create the material. <br />
texturePath -- The base path of the textures.
[page:Object m] — The parameters to create the material. <br />
[page:String texturePath] — The base path of the textures.
</div>
<div>
Creates the Material based on the parameters m.
</div>
<h3>[method:Array initMaterials]([page:Array materials], [page:string texturePath])</h3>
<h3>[method:Array initMaterials]( [page:Array materials], [page:string texturePath] )</h3>
<div>
materials -- an array of parameters to create materials. <br />
texturePath -- The base path of the textures.
[page:Array materials] — an array of parameters to create materials. <br />
[page:String texturePath] — The base path of the textures.
</div>
<div>
Creates an array of [page:Material] based on the array of parameters m. The index of the parameters decide the correct index of the materials.
</div>
<h3>[method:todo extractUrlBase]([page:string url])</h3>
<h3>[method:String extractUrlBase]( [page:string url] )</h3>
<div>
url -- The url to extract the base url from.
[page:String url] — The url to extract the base url from.
</div>
<div>
Extract the base from the URL.
Extract the base from the URL.
</div>
<h3>[method:DOMElement addStatusElement]()</h3>
<div>
Add a DOM element to indicate the progress and returns the DOMElement
Add a DOM element to indicate the progress and return the DOMElement
</div>
......
docs/api/loaders/LoadingManager.html
浏览文件 @ d23db267
......@@ -11,71 +11,78 @@
<div class="desc">Handles and keeps track of loaded and pending data.</div>
<code>
var manager = new THREE.LoadingManager();
manager.onProgress = function ( item, loaded, total ) {
var manager = new THREE.LoadingManager();
manager.onProgress = function ( item, loaded, total ) {
console.log( item, loaded, total );
console.log( item, loaded, total );
};
};
var loader = new THREE.OBJLoader( manager );
loader.load( 'file.obj', function ( object ) {
var loader = new THREE.OBJLoader( manager );
loader.load( 'file.obj', function ( object ) {
//
//
} );
} );
</code>
<h2>Constructor</h2>
<h3>[name]([page:function onLoad], [page:function onProgress], [page:function onError])</h3>
<h3>[name]( [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:function onLoad] -- The function that needs to be called when all loaders are done.
[page:function onProgress] -- The function that needs to be called when an item is complete.
[page:function onError] -- The function that needs to be called when an item is errors.
[page:Function onLoad] — The function that needs to be called when all loaders are done.<br />
[page:Function onProgress] — The function that needs to be called when an item is complete.<br />
[page:Function onError] — The function that needs to be called when an item is errors.
</div>
<div>
Creates a [name].
</div>
<h2>Properties</h2>
<h3>[property:function onLoad]</h3>
<h3>[property:Function onLoad]</h3>
<div>
The function that needs to be called when all loaders are done.
</div>
The function that needs to be called when all loaders are done.
</div>
<h3>[property:function onProgress]</h3>
<h3>[property:Function onProgress]</h3>
<div>
The function that needs to be called when an item is complete. The arguments are url(The url of the item just loaded),<br />
loaded(the amount of items already loaded), total( The total amount of items to be loaded.)
</div>
</div>
<h3>[property:function onError]</h3>
<h3>[property:Function onError]</h3>
<div>
The function that needs to be called when an item errors.
</div>
</div>
<h2>Methods</h2>
<h3>[method:todo itemStart]( [page:String url] )</h3>
<h3>[method:null itemStart]( [page:String url] )</h3>
<div>
url — the url to load
[page:String url] — the url to load
</div>
<div>
This should be called by any loader used by the manager when the loader starts loading an url. These shouldn't be called outside a loader.
</div>
<h3>[method:todo itemEnd]( [page:String url] )</h3>
<h3>[method:null itemEnd]( [page:String url] )</h3>
<div>
url — the url to load
[page:String url] — the loaded url
</div>
<div>
This should be called by any loader used by the manager when the loader ended loading an url. These shouldn't be called outside a loader.
</div>
<h2>Example</h2>
[example:webgl_loader_obj]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
docs/api/loaders/MTLLoader.html 0 → 100644
浏览文件 @ d23db267
<!D]OCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<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">A loader for loading an <em>.mtl</em> resource, used internaly by [page:OBJMTLLoader] and [page:UTF8Loader].</div>
<h2>Constructor</h2>
<h3>[name]( [page:String baseUrl], [page:Object options], [page:String crossOrigin] )</h3>
<div>
[page:String baseUrl] — The base url from which to find subsequent resources.<br />
[page:Object options] — Options passed to the created material (side, wrap, normalizeRGB, ignoreZeroRGBs, invertTransparency).<br />
[page:String crossOrigin] — The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.<br />
</div>
<div>
Creates a new [name].
</div>
<h2>Properties</h2>
<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:MTLLoaderMaterialCreator MTLLoader.MaterialCreator] instance.<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 return the loaded material.
</div>
<h3>[method:MTLLoaderMaterialCreator parse]( [page:String text] )</h3>
<div>
[page:String text] — The textual <em>mtl</em> structure to parse.
</div>
<div>
Parse a <em>mtl</em> text structure and return a [page:MTLLoaderMaterialCreator] instance.<br />
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/[name].js examples/js/loaders/[name].js]
</body>
</html>
docs/api/loaders/MaterialLoader.html
浏览文件 @ d23db267
......@@ -9,15 +9,15 @@
<body>
<h1>[name]</h1>
<div class="desc">A loader for loading an [page:Material material].</div>
<div class="desc">A loader for loading a [page:Material] in JSON format.</div>
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]([page:LoadingManager manager])</h3>
<div>
manager -- The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<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>
......@@ -25,32 +25,60 @@
<h2>Methods</h2>
<h3>[method:Image load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
onLoad -- Will be called when load completes. The argument will be the loaded Imageloader.
onProgress -- Will be called while load progresses. The argument will be the progress event.
onError -- Will be called when load errors.
url — required
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded [page:Material].<br />
[page:Function onProgress] — Will be called while load progresses. The argument will be the progress event.<br />
[page:Function onError] — Will be called when load errors.<br />
</div>
<div>
Begin loading from url and return the [page:Material material] object that will contain the data.
</div>
Begin loading from url and return the [page:Material] object that will contain the data.
</div>
<h3>[method:todo setCrossOrigin]([page:String value])</h3>
<h3>[method:null setCrossOrigin]( [page:String value] )</h3>
<div>
value -- The crossOrigin string.
[page:String value] — The crossOrigin string.
</div>
<div>
The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
<h3>[method:todo parse]([page:Object json])</h3>
<div>
json -- The json object containing the parameters of the Material.
<h3>[method:Material parse]( [page:Object json] )</h3>
<div>
[page:Object json] — The json object containing the parameters of the Material.
</div>
<div>
Creates a new [page:Material material] of the type 'json.type' and with parameters defined in the json object.
</div>
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>
......
docs/api/loaders/OBJLoader.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<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">A loader for loading an <em>.obj</em> resource.</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>
<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:Object3D].<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 call onLoad with the parsed response content.
</div>
<h3>[method:Object3D parse]( [page:String text] )</h3>
<div>
[page:String text] — The textual <em>obj</em> structure to parse.
</div>
<div>
Parse an <em>obj</em> text structure and return an [page:Object3D].<br />
Found objects are converted to [page:Mesh] with a [page:BufferGeometry] and a default [page:MeshLambertMaterial].
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.OBJLoader();
// load a resource
loader.load(
// resource URL
'models/skinned/UCS_config.json',
// 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]
</body>
</html>
docs/api/loaders/OBJMTLLoader.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<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">A loader for loading a <em>.obj</em> and its <em>.mtl</em> together.</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>
<h2>Methods</h2>
<h3>[method:null load]( [page:String objUrl], [page:String mtlUrl], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
[page:String objUrl] — required. URL to the <em>.obj</em> resource<br />
[page:String mtlUrl] — required. URL to the <em>.mtl</em> resource<br />
[page:Function onLoad] — Will be called when both resources load complete. The argument will be the loaded [page:Object3D].<br />
[page:Function onProgress] — Will be called while both load progress. 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 urls and call onLoad with the parsed response content.
</div>
<h3>[method:Object3D parse]( [page:String text], [page:Function mtllibCallback] )</h3>
<div>
[page:String text] — required. The textual <em>obj</em> structure to parse.<br/>
[page:Function mtllibCallback] — optional. Callback to handle <em>mtllib</em> declaration.<br/>
</div>
<div>
Parse an <em>obj</em> text structure and return an [page:Object3D].<br />
Found objects are converted to [page:Mesh] with a [page:BufferGeometry] and materials are converted to [page:MeshLambertMaterial].
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.OBJMTLLoader();
// load an obj / mtl resource pair
loader.load(
// OBJ resource URL
'obj/male02/male02.obj',
// MTL resource URL
'obj/male02/male02_dds.mtl',
// Function when both resources are loaded
function ( object ) {
scene.add( object );
},
// Function called when downloads progress
function ( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
// Function called when downloads error
function ( xhr ) {
console.log( 'An error happened' );
}
);
</code>
[example:webgl_loader_obj_mtl]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/OBJMTLLoader.js examples/js/loaders/OBJMTLLoader.js]
</body>
</html>
docs/api/loaders/ObjectLoader.html
浏览文件 @ d23db267
......@@ -9,36 +9,66 @@
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<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>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<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>todo</h3>
<h2>Methods</h2>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
todo
</div>
[page:String url] — required<br />
[page:Function onLoad] — Will be called when load completes. The argument will be the loaded [page:Object3D object].<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 call onLoad with the parsed response content.
</div>
<h2>Methods</h2>
<h3>[method:Object3D parse]( [page:Object json] )</h3>
<div>
[page:Object json] — required. The JSON source to parse<br />
</div>
<div>
Parse a <em>JSON</em> content and return a threejs object.
</div>
<h3>todo</h3>
<div>todo</div>
<h3>[method:null setCrossOrigin]( [page:String value] )</h3>
<div>
todo
[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]
......
docs/api/loaders/PDBLoader.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<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">
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>
<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>
<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. URL to the <em>.pdb</em> file<br />
[page:Function onLoad] — Will be called when load completes. The arguments will be an [page:Geometry geometryAtoms], [page:Geometry geometryBonds] and the [page:Object JSON] structure.<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 call onLoad with the parsed response content.
</div>
<h3>[method:Object parsePDB]( [page:String text] )</h3>
<div>
[page:String text] — The textual <em>pdb</em> structure to parse.
</div>
<div>
Parse a <em>pdb</em> text and return a <em>JSON</em> structure.<br />
</div>
<h3>[method:null createModel]( [page:Object json], [page:Function callback] )</h3>
<div>
[page:Object json] — The <em>(JSON) pdb</em> structure to parse.<br />
[page:Function callback] — Will be called when parse completes, with three arguments: [page:Geometry geometryAtoms], [page:Geometry geometryBonds] and the original [page:Object json].<br />
</div>
<div>
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>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/PDBLoader.js examples/js/loaders/PDBLoader.js]
</body>
</html>
docs/api/loaders/SVGLoader.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<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">A loader for loading an <em>.svg</em> resource.</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>
<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:SVGDocument].<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 call onLoad with the response content.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/SVGLoader.js examples/js/loaders/SVGLoader.js]
</body>
</html>
docs/api/loaders/SceneLoader.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<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">A loader for loading a [page:Scene] from a <em>JSON</em> resource.</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>
<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 an [page:Object] containing the loaded components.<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 call onLoad with the parsed scene.
</div>
<h3>[method:Object parse]( [page:Object json], [page:Function callbackFinished], [page:String url] )</h3>
<div>
[page:Object json] — The <em>JSON</em> structure to parse.<br />
[page:Function callbackFinished] — Will be called when parse completes.<br />
[page:String url] — Will be used as base for assets' relative URLs.<br />
</div>
<div>
Parse a <em>JSON</em> scene description and return a new [page:Object] with fully instantiated Three.js objects.
</div>
<h3>[method:null setCrossOrigin]( [page:String value] )</h3>
<div>
[page:String value] — The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
<h3>[method:null addGeometryHandler]( [page:String typeID], [page:Function loaderClass] )</h3>
<div>
[page:String typeID] — The type to handle.<br />
[page:Function loaderClass] — The handler class.<br />
</div>
<div>
Add an handler for a specific geometry type.
</div>
<h3>[method:null addHierarchyHandler]( [page:String typeID], [page:Function loaderClass] )</h3>
<div>
[page:String typeID] — The type to handle.<br />
[page:Function loaderClass] — The handler class.<br />
</div>
<div>
Add an handler for a specific object type.
</div>
<h2>Example</h2>
<code>
// instantiate a loader
var loader = new THREE.SceneLoader();
// Handle STL geometries
loader.addGeometryHandler( "stl", THREE.STLLoader );
// Handle OBJ objects
loader.addHierarchyHandler( "obj", THREE.OBJLoader );
// load a JSON resource
loader.load(
// resource URL
'scenes/test_scene.js',
// Function when resource is loaded
function ( result ) {
scene.add( result.scene );
},
// 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_scene]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/SceneLoader.js examples/js/loaders/SceneLoader.js]
</body>
</html>
docs/api/loaders/TGALoader.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<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 <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>
// instantiate a loader
var loader = new THREE.TGALoader();
// load a resource
var texture = loader.load(
// resource URL
'textures/crate_grey8.tga'
// Function when resource is loaded
function ( texture ) {
console.log( 'Texture is loaded' );
},
// 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' );
}
);
var material = new THREE.MeshPhongMaterial( {
color: 0xffffff,
map: texture
} );
</code>
[example:webgl_materials_texture_tga]
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/TGALoader.js examples/js/loaders/TGALoader.js]
</body>
</html>
docs/api/loaders/TextureLoader.html
浏览文件 @ d23db267
......@@ -10,86 +10,73 @@
<h1>[name]</h1>
<div class="desc">Class for loading a [page:Texture texture].</div>
<div class="desc">Unlike other loaders, this one emits events instead of using predefined callbacks. So if you're interested in getting notified when <em>things</em> happen, you need to add listeners to the object.</div>
<h2>Constructor</h2>
<h3>[name]()</h3>
<div>
todo
</div>
<h2>Constructor</h2>
<h2>Events</h2>
<h3>load</h3>
<div class="desc">
Dispatched when the texture has completed loading
</div>
<h3>[name]( [page:LoadingManager manager] )</h3>
<div>
content — loaded texture object
</div>
<h3>error</h3>
<div class="desc">
Dispatched when the texture can't be loaded
[page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
</div>
<div>
message — error message
Creates a new [name].
</div>
<h2>Properties</h2>
<h3>[property:todo crossOrigin]</h3>
<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:todo load]( [page:String url] )</h3>
<div>
url — required
</div>
<div class="desc">Begin loading from <em>url</em></div>
<h3>[method:todo dispatchEvent]([page:todo event])</h3>
<div>
event -- todo
</div>
<div>
todo
</div>
<h2>Methods</h2>
<h3>[method:todo hasEventListener]([page:todo type], [page:todo listener])</h3>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
type -- todo <br />
listener -- todo
[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>
todo
Begin loading from url and pass the loaded [page:Texture texture] to onLoad.
</div>
<h3>[method:todo removeEventListener]([page:todo type], [page:todo listener])</h3>
<div>
type -- todo <br />
listener -- todo
</div>
<div>
todo
</div>
<h3>[method:todo addEventListener]([page:todo type], [page:todo listener])</h3>
<div>
type -- todo <br />
listener -- todo
</div>
<div>
todo
</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>
......
docs/api/loaders/XHRLoader.html
浏览文件 @ d23db267
......@@ -7,38 +7,70 @@
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h1>[name]</h1>
<h2>Example</h2>
<div class="desc">A low level class for loading resources with XmlHttpRequest, used internaly by most loaders.</div>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<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>todo</h3>
<h3>[property:Cache cache]</h3>
<div>
todo
</div>
A [page:Cache cache] instance that hold the response from each request made through this loader, so each file is requested once.
</div>
<h3>[property:String crossOrigin]</h3>
<div>
The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
<h3>[property:String responseType]</h3>
<div>
Can be set to change the response type.
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<h3>[method:null load]( [page:String url], [page:Function onLoad], [page:Function onProgress], [page:Function onError] )</h3>
<div>
todo
[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 return the [page:String text] response that will contain the data.
</div>
<h3>[method:null setCrossOrigin]( [page:String value] )</h3>
<div>
[page:String value] — The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
</div>
<h3>[method:null setResponseType]( [page:String value] )</h3>
<div>
[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]
......
docs/api/loaders/glTFLoader.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
[page:Loader] &rarr;
<h1>[name]</h1>
<div class="desc">
A loader for loading a <em>.gltf</em> resource in <em>JSON</em> 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>Constructor</h2>
<h3>[name]( )</h3>
<div>
Creates a new [name].
</div>
<h2>Properties</h2>
<h2>Methods</h2>
<h3>[method:Object3D load]( [page:String url], [page:Function callback] )</h3>
<div>
[page:String url] — required<br />
[page:Function callback] — Will be called when load completes. The argument will be an [page:Object] containing the loaded .[page:Object3D scene], .[page:Array cameras] and .[page:Array animations].<br />
</div>
<div>
Begin loading from url and call the callback function with the parsed response content.
</div>
<h2>Notes</h2>
<div>
This class is often used with [page:glTFAnimator THREE.glTFAnimator] to animate parsed animations.
</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/gltf/glTFLoader.js examples/js/loaders/gltf/glTFLoader.js]
</body>
</html>
docs/api/materials/ShaderMaterial.html
浏览文件 @ d23db267
......@@ -11,13 +11,13 @@
<h1>[name]</h1>
<div class="desc">Material rendered with custom shaders. A shader is a small program written in [link:https://www.opengl.org/documentation/glsl/ GLSL] to run on the GPU. You may want to use a custom shader if you need to:
<div class="desc">Material rendered with custom shaders. A shader is a small program written in [link:https://www.opengl.org/documentation/glsl/ GLSL] to run on the GPU. You may want to use a custom shader if you need to:
<ul>
<li>implement an effect not included with any of the built-in [page:Material materials]</li>
<li>combine many objects into a single [page:Geometry] or [page:BufferGeometry] in order to improve performance</li>
<li>associate custom data with individual vertices ("custom attributes")</li>
</ul>
Note that a ShaderMaterial will only be rendered properly by [page:WebGLRenderer], since the GLSL code in the vertexShader and fragmentShader properties must be compiled and run on the GPU using WebGL.
Note that a ShaderMaterial will only be rendered properly by [page:WebGLRenderer], since the GLSL code in the vertexShader and fragmentShader properties must be compiled and run on the GPU using WebGL.
</div>
<h3>Example</h3>
......@@ -39,7 +39,7 @@
</code>
<h3>Vertex shaders and fragment shaders</h3>
<p>You can specify two different types of shaders for each material:
<p>You can specify two different types of shaders for each material:
<ul>
<li>The *vertex shader* runs first; it recieves *attributes*, calculates/manipulates the position of each individual vertex, and passes additional data (*varying*s) to the fragment shader.</li>
<li>The *fragment shader* runs second; it sets the color of each individual "fragment" (pixel) rendered to the screen.</li>
......@@ -69,13 +69,13 @@
Custom attributes and uniforms must be declared both in your GLSL shader code (within *vertexShader* and/or *fragmentShader*), <emph>and</emph> in the *attributes* and *uniforms* properties of your ShaderMaterial. The declaration in the material is necessary to ensure [page:WebGLRenderer] passes your attribute/uniform data in a buffer to the GPU when the shader is run. Note that *varying*s only need to be declared within the shader code (not within the material).
</p>
<p>
To declare a custom attribute, use the *attributes* property of the material:
To declare a custom attribute, use the *attributes* property of the material:
<code>
attributes: {
vertexOpacity: { type: 'f', value: [] }
}
</code>
Each attribute must have a *type* property and a *value* property.
Each attribute must have a *type* property and a *value* property.
<table>
<caption><a id="attribute-types">Attribute types</a></caption>
<thead>
......@@ -113,7 +113,7 @@
</tr>
</tbody>
</table>
The way attribute data is stored depends on whether you're using [page:BufferGeometry] or [page:Geometry]:
The way attribute data is stored depends on whether you're using [page:BufferGeometry] or [page:Geometry]:
<ul>
<li>When using [page:Geometry], attribute data is stored directly on the <emph>material</emph>, using the attribute's *value* array; each element of *value* should correspond to one vertex. To update an attribute, set the *needsUpdate* flag to true on the material attribute:
<code>
......@@ -135,7 +135,7 @@
time: { type: "f", value: 1.0 },
resolution: { type: "v2", value: new THREE.Vector2() }
}
</code>
</code>
Each uniform must have a <a href="#uniform-types">*type*</a> and a *value*:
<table>
<caption><a id="uniform-types">Uniform types</a></caption>
......@@ -221,7 +221,7 @@
{ type: 'f', value: 1.0 }
</code>
where *type* is a <a href="#uniform-types">uniform type string</a>, and *value* is the value of the uniform. Names must match the name of the uniform, as defined in the GLSL code. Note that uniforms are refreshed on every frame, so updating the value of the uniform will immediately update the value available to the GLSL code.
</div>
</div>
<h3>[property:Object attributes]</h3>
<div>
......@@ -230,12 +230,12 @@
<code>
{ type: 'f', value: [1.0, 0.5, 2.0, ...] }
</code>
where *type* is an <a href="#attribute-types">attribute type string</a>, and *value* is an array containing an attribute value for each vertex in the geometry (or *undefined* if using [page:BufferGeometry]). Names must match the name of the attribute, as defined in the GLSL code.
where *type* is an <a href="#attribute-types">attribute type string</a>, and *value* is an array containing an attribute value for each vertex in the geometry (or *undefined* if using [page:BufferGeometry]). Names must match the name of the attribute, as defined in the GLSL code.
</p>
<p>
Note that attribute buffers are <emph>not</emph> refreshed automatically when their values change; if using [page:Geometry], set <code>needsUpdate = true</code> on the attribute definition. If using [page:BufferGeometry], set <code>needsUpdate = true</code> on the [page:BufferAttribute].
</p>
</div>
</div>
<h3>[property:Object defines]</h3>
<div>
......@@ -251,49 +251,49 @@
#define FOO 15
#define BAR true
</code>
in the GLSL code.
</div>
in the GLSL code.
</div>
<h3>[property:String fragmentShader]</h3>
<div>
Fragment shader GLSL code. This is the actual code for the shader. In the example above, the *vertexShader* and *fragmentShader* code is extracted from the DOM; it could be passed as a string directly or loaded via AJAX instead.
</div>
</div>
<h3>[property:String vertexShader]</h3>
<div>
Vertex shader GLSL code. This is the actual code for the shader. In the example above, the *vertexShader* and *fragmentShader* code is extracted from the DOM; it could be passed as a string directly or loaded via AJAX instead.
</div>
</div>
<h3>[property:Boolean lights]</h3>
<div>
Defines whether this material uses lighting; true to pass uniform data related to lighting to this shader
</div>
</div>
<h3>[property:Boolean morphTargets]</h3>
<div>
Defines whether the material uses morphTargets; true morphTarget attributes to this shader
</div>
</div>
<h3>[property:Boolean morphNormals]</h3>
<div>
Defines whether the material uses morphNormals; true to pass morphNormal attributes to this shader
</div>
</div>
<h3>[property:Boolean wireframe]</h3>
<div>
Render geometry as wireframe (using GL_LINES instead of GL_TRIANGLES). Default is false (i.e. render as flat polygons).
</div>
</div>
<h3>[property:Number vertexColors]</h3>
<div>
Define how the vertices are colored, by defining how the *colors* attribute gets populated. Possible values are [page:Materials THREE.NoColors], [page:Materials THREE.FaceColors] and [page:Materials THREE.VertexColors]. Default is THREE.NoColors.
</div>
<h3>[property:Boolean skinning]</h3>
<div>
Define whether the material uses skinning; true to pass skinning attributes to the shader. Default is false.
</div>
</div>
<h3>[property:Boolean fog]</h3>
<div>Define whether the material color is affected by global fog settings; true to pass fog uniforms to the shader. Default is false.</div>
......@@ -302,7 +302,7 @@
<h3>[property:Number shading]</h3>
<div>
Define shading type, which determines whether normals are smoothed between vertices; possible values are [page:Materials THREE.SmoothShading] or [page:Materials THREE.FlatShading]. Default is THREE.SmoothShading.
</div>
</div>
<h3>[property:Number linewidth]</h3>
<div>Controls line thickness; only effective if the material is attached to a [page:Line]. Default is 1.</div>
......@@ -321,7 +321,7 @@
<h3>[method:ShaderMaterial clone]()</h3>
<div>
Generates a shallow copy of this material. Note that the vertexShader and fragmentShader are copied <emph>by reference</emph>, as are the definitions of the *attributes*; this means that clones of the material will share the same compiled [page:WebGLProgram]. However, the *uniforms* are copied <emph>by value</emph>, which allows you to have different sets of uniforms for different copies of the material.
Generates a shallow copy of this material. Note that the vertexShader and fragmentShader are copied <emph>by reference</emph>, as are the definitions of the *attributes*; this means that clones of the material will share the same compiled [page:WebGLProgram]. However, the *uniforms* are copied <emph>by value</emph>, which allows you to have different sets of uniforms for different copies of the material.
</div>
<h2>Source</h2>
......
docs/list.js
浏览文件 @ d23db267
......@@ -46,15 +46,25 @@ var list = {
"Loaders": [
[ "BabylonLoader", "api/loaders/BabylonLoader" ],
[ "BufferGeometryLoader", "api/loaders/BufferGeometryLoader" ],
[ "Cache", "api/loaders/Cache" ],
[ "ColladaLoader", "api/loaders/ColladaLoader" ],
[ "glTFLoader", "api/loaders/glTFLoader" ],
[ "ImageLoader", "api/loaders/ImageLoader" ],
[ "JSONLoader", "api/loaders/JSONLoader" ],
[ "Loader", "api/loaders/Loader" ],
[ "LoadingManager", "api/loaders/LoadingManager" ],
[ "MaterialLoader", "api/loaders/MaterialLoader" ],
[ "MTLLoader", "api/loaders/MTLLoader" ],
[ "OBJLoader", "api/loaders/OBJLoader" ],
[ "OBJMTLLoader", "api/loaders/OBJMTLLoader" ],
[ "ObjectLoader", "api/loaders/ObjectLoader" ],
[ "PDBLoader", "api/loaders/PDBLoader" ],
[ "SVGLoader", "api/loaders/SVGLoader" ],
[ "SceneLoader", "api/loaders/SceneLoader" ],
[ "TextureLoader", "api/loaders/TextureLoader" ],
[ "TGALoader", "api/loaders/TGALoader" ],
[ "XHRLoader", "api/loaders/XHRLoader" ]
],
......@@ -164,7 +174,7 @@ var list = {
[ "CubeCamera", "api/extras/cameras/CubeCamera" ]
],
"Extras / Core": [
[ "Curve", "api/extras/core/Curve" ],
[ "CurvePath", "api/extras/core/CurvePath" ],
......
examples/index.html
浏览文件 @ d23db267
......@@ -173,6 +173,7 @@
"webgl_lines_splines",
"webgl_loader_assimp2json",
"webgl_loader_awd",
"webgl_loader_babylon",
"webgl_loader_collada",
"webgl_loader_collada_keyframe",
"webgl_loader_collada_skinning",
......
examples/js/loaders/SVGLoader.js
浏览文件 @ d23db267
......@@ -15,9 +15,11 @@ THREE.SVGLoader.prototype = {
load: function ( url, onLoad, onProgress, onError ) {
var scope = this;
var parser = new DOMParser();
var loader = new THREE.XHRLoader();
var loader = new THREE.XHRLoader( scope.manager );
loader.setCrossOrigin( this.crossOrigin );
loader.load( url, function ( svgString ) {
......
examples/models/babylon/skull.babylon 0 → 100644
浏览文件 @ d23db267
此差异已折叠。
examples/webgl_loader_babylon.html 0 → 100644
浏览文件 @ d23db267
<!DOCTYPE html>
<html lang="en">
<head>
<title>three.js webgl - loaders - Babylon loader</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<style>
body {
font-family: Monospace;
background-color: #000;
color: #fff;
margin: 0px;
overflow: hidden;
}
#info {
color: #fff;
position: absolute;
top: 10px;
width: 100%;
text-align: center;
z-index: 100;
display:block;
}
#info a, .button { color: #f00; font-weight: bold; text-decoration: underline; cursor: pointer }
</style>
</head>
<body>
<div id="info">
<a href="http://threejs.org" target="_blank">three.js</a> - BabylonLoader test
</div>
<script src="../build/three.min.js"></script>
<script src="js/loaders/BabylonLoader.js"></script>
<script>
var container;
var camera, scene, renderer;
var mouseX = 0, mouseY = 0;
var windowHalfX = window.innerWidth / 2;
var windowHalfY = window.innerHeight / 2;
init();
animate();
function init() {
container = document.createElement( 'div' );
document.body.appendChild( container );
camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 2000 );
camera.position.z = 100;
// scene
scene = new THREE.Scene();
var ambient = new THREE.AmbientLight( 0x101030 );
scene.add( ambient );
var directionalLight = new THREE.DirectionalLight( 0xffeedd );
directionalLight.position.set( 0, 0, 1 );
scene.add( directionalLight );
// texture
var manager = new THREE.LoadingManager();
manager.onProgress = function ( item, loaded, total ) {
console.log( item, loaded, total );
};
var texture = new THREE.Texture();
var material = new THREE.MeshBasicMaterial( { color: 'red' } );
var onProgress = function ( xhr ) {
if ( xhr.lengthComputable ) {
var percentComplete = xhr.loaded / xhr.total * 100;
console.log( Math.round(percentComplete, 2) + '% downloaded' );
}
};
var onError = function ( xhr ) {
};
// model
var loader = new THREE.BabylonLoader( manager );
loader.load( 'models/babylon/skull.babylon', function ( babylonScene ) {
scene.add( babylonScene );
}, onProgress, onError );
//
renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild( renderer.domElement );
document.addEventListener( 'mousemove', onDocumentMouseMove, false );
//
window.addEventListener( 'resize', onWindowResize, false );
}
function onWindowResize() {
windowHalfX = window.innerWidth / 2;
windowHalfY = window.innerHeight / 2;
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize( window.innerWidth, window.innerHeight );
}
function onDocumentMouseMove( event ) {
mouseX = ( event.clientX - windowHalfX ) / 2;
mouseY = ( event.clientY - windowHalfY ) / 2;
}
//
function animate() {
requestAnimationFrame( animate );
render();
}
function render() {
camera.position.x += ( mouseX - camera.position.x ) * .05;
camera.position.y += ( - mouseY - camera.position.y ) * .05;
camera.lookAt( scene.position );
renderer.render( scene, camera );
}
</script>
</body>
</html>
src/loaders/BufferGeometryLoader.js
浏览文件 @ d23db267
......@@ -16,7 +16,7 @@ THREE.BufferGeometryLoader.prototype = {
var scope = this;
var loader = new THREE.XHRLoader();
var loader = new THREE.XHRLoader( scope.manager );
loader.setCrossOrigin( this.crossOrigin );
loader.load( url, function ( text ) {
......
src/loaders/MaterialLoader.js
浏览文件 @ d23db267
......@@ -16,7 +16,7 @@ THREE.MaterialLoader.prototype = {
var scope = this;
var loader = new THREE.XHRLoader();
var loader = new THREE.XHRLoader( scope.manager );
loader.setCrossOrigin( this.crossOrigin );
loader.load( url, function ( text ) {
......@@ -43,7 +43,7 @@ THREE.MaterialLoader.prototype = {
if ( json.shininess !== undefined ) material.shininess = json.shininess;
if ( json.uniforms !== undefined ) material.uniforms = json.uniforms;
if ( json.vertexShader !== undefined ) material.vertexShader = json.vertexShader;
if ( json.fragmentShader !== undefined ) material.fragmentShader = json.fragmentShader;
if ( json.fragmentShader !== undefined ) material.fragmentShader = json.fragmentShader;
if ( json.vertexColors !== undefined ) material.vertexColors = json.vertexColors;
if ( json.shading !== undefined ) material.shading = json.shading;
if ( json.blending !== undefined ) material.blending = json.blending;
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或