three.js LoadingManager

2023-02-16 17:44 更新

其功能是處理并跟蹤已加載和待處理的數(shù)據(jù)。如果未手動設(shè)置加強(qiáng)管理器,則會為加載器創(chuàng)建和使用默認(rèn)全局實(shí)例加載器管理器。

一般來說,默認(rèn)的加載管理器已足夠使用了,但有時候也需要設(shè)置單獨(dú)的加載器 - 例如,如果你想為對象和紋理顯示單獨(dú)的加載條。

代碼示例

下面的例子將介紹,如何使用加載管理器來跟蹤 OBJLoader 的加載進(jìn)度流程。

const manager = new THREE.LoadingManager();
manager.onStart = function ( url, itemsLoaded, itemsTotal ) {

	console.log( 'Started loading file: ' + url + '.\nLoaded ' + itemsLoaded + ' of ' + itemsTotal + ' files.' );

};

manager.onLoad = function ( ) {

	console.log( 'Loading complete!');

};


manager.onProgress = function ( url, itemsLoaded, itemsTotal ) {

	console.log( 'Loading file: ' + url + '.\nLoaded ' + itemsLoaded + ' of ' + itemsTotal + ' files.' );

};

manager.onError = function ( url ) {

	console.log( 'There was an error loading ' + url );

};

const loader = new THREE.OBJLoader( manager );
loader.load( 'file.obj', function ( object ) {

	//

} );

除了觀察進(jìn)度流程之外,還可以使用LoadingManager在加載期間覆寫資源URL。當(dāng)某資源來自拖拽事件、 WebSockets、WebRTC或其他API時,此方法可以有所幫助。下面顯示了如何使用Blob URL加載內(nèi)存模型的示例。

// 將文件拖入網(wǎng)頁時創(chuàng)建的Blob或File對象。
const blobs = {'fish.gltf': blob1, 'diffuse.png': blob2, 'normal.png': blob3};

const manager = new THREE.LoadingManager();

// 使用URL回調(diào)初始化加載管理器。
const objectURLs = [];
manager.setURLModifier( ( url ) => {

	url = URL.createObjectURL( blobs[ url ] );

	objectURLs.push( url );

	return url;

} );

// 像通常一樣加載,然后撤消blob URL
const loader = new THREE.GLTFLoader( manager );
loader.load( 'fish.gltf', (gltf) => {

	scene.add( gltf.scene );

	objectURLs.forEach( ( url ) => URL.revokeObjectURL( url ) );

});

例子

WebGL / loader / fbx
WebGL / loader / obj
WebGL / materials / physical / reflectivity
WebGL / postprocesing / outline

構(gòu)造方法

LoadingManager( onLoad : Function, onProgress : Function, onError : Function )

onLoad — (可選) 所有加載器加載完成后,將調(diào)用此函數(shù)。
onProgress — (可選) 當(dāng)每個項目完成后,將調(diào)用此函數(shù)。
onError — (可選) 當(dāng)一個加載器遇到錯誤時,將調(diào)用此函數(shù)。
創(chuàng)建一個新的 LoadingManager.

屬性

.onStart : Function

此函數(shù)在加載開始時被調(diào)用。 有如下參數(shù):

url — 被加載的項的url。
itemsLoaded — 目前已加載項的個數(shù)。
itemsTotal — 總共所需要加載項的個數(shù)。

該函數(shù)默認(rèn)為undefined。

.onLoad : Function

所有的項目加載完成后將調(diào)用此函數(shù)。默認(rèn)情況下,該函數(shù)是未定義的,除非在構(gòu)造函數(shù)中傳入。

.onProgress : Function

此方法加載每一個項,加載完成時進(jìn)行調(diào)用。 有如下參數(shù):

url — 被加載的項的url。
itemsLoaded — 目前已加載項的個數(shù)。
itemsTotal — 總共所需要加載項的個數(shù)。

默認(rèn)情況下,該函數(shù)為undefined,除非在構(gòu)造函數(shù)中傳入。

.onError : Function

此方法將在任意項加載錯誤時,進(jìn)行調(diào)用。 有如下參數(shù):

url — 加載發(fā)生錯誤的項目的url

默認(rèn)情況下,該函數(shù)為undefined,除非在構(gòu)造函數(shù)中傳入。

方法

.addHandler ( regex : Object, loader : Loader ) : this

regex — 正則表達(dá)式。

loader — 裝載機(jī)。

使用給定的正則表達(dá)式注冊加載程序??捎糜诙x加載特定文件應(yīng)使用的加載程序。一個典型的用例是覆蓋紋理的默認(rèn)加載器。

// add handler for TGA textures
manager.addHandler( /\.tga$/i, new TGALoader() );

.getHandler ( file : String ) : Loader

file — 文件路徑。

可用于檢索給定文件路徑的已注冊加載程序。

.removeHandler ( regex : Object ) : this

regex — 正則表達(dá)式。

刪除給定正則表達(dá)式的加載程序。

.resolveURL ( url : String ) : String

url — 所要加載的url

給定URL,使用URL修飾符回調(diào)(如果有)并返回已解析的URL。如果未設(shè)置URL修飾符,則返回原始URL。

.setURLModifier ( callback : Function ) : this

callback — 設(shè)置URL修飾符成功時回調(diào)。使用url參數(shù)進(jìn)行回調(diào),并且必須返回 resolvedURL 。

如果設(shè)置了回調(diào),則在發(fā)送請求之前將向每個資源URL傳遞回調(diào)。回調(diào)可以返回最初的URL,也可以返回新URL以覆蓋加載行為。 此行為可用于從.ZIP、拖拽API和數(shù)據(jù)URI中加載資源文件。

注意:以下方法被設(shè)計為由加載器內(nèi)部調(diào)用。你不應(yīng)該直接調(diào)用它們。

.itemStart ( url : String ) : undefined

url — 所要加載的url

任何使用管理器的加載器都會調(diào)用此方法, 當(dāng)加載器需要開始加載URL時。

.itemEnd ( url : String ) : undefined

url — 所要加載的url

任何使用管理器的加載器都會調(diào)用此方法, 當(dāng)加載器需要加載URL結(jié)束時。

.itemError ( url : String ) : undefined

url — 所要加載的url

任何使用管理器的加載器都會調(diào)用此方法, 當(dāng)加載器出現(xiàn)加載錯誤時。

src/loaders/LoadingManager.js


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號