three.js ImageBitmapLoader

2023-02-16 17:44 更新

一個把Image加載為ImageBitmap的加載器。 ImageBitmap提供了一種異步且有效的資源的途徑,用于在WebGL中渲染的紋理。

不像FileLoader, ImageBitmapLoader無需避免對同一的URL進行多次請求。

值得注意的是 Texture.flipY 和 Texture.premultiplyAlpha 在 ImageBitmap 中會被忽略。不像常規(guī)圖像上傳到 GPU 時需要這些配置,ImageBitmap 是創(chuàng)建位圖時需要它們。比如你需要通過 ImageBitmapLoader.setOptions 來設(shè)置等效的選項。詳情請參閱 WebGL specification 規(guī)范。

代碼示例

// 初始化一個加載器
const loader = new THREE.ImageBitmapLoader();

// set options if needed
loader.setOptions( { imageOrientation: 'flipY' } );

// 加載一個圖片資源
loader.load(
	// 資源的URL
	'textures/skyboxsun25degtest.png',

	// onLoad回調(diào)
	function ( imageBitmap ) {
		const texture = new THREE.CanvasTexture( imageBitmap );
		const material = new THREE.MeshBasicMaterial( { map: texture } );
	},

	// 目前暫不支持onProgress的回調(diào)
	undefined,

	// onError回調(diào)
	function ( err ) {
		console.log( 'An error happened' );
	}
);

例子

WebGL / loader / ImageBitmap

構(gòu)造函數(shù)

ImageBitmapLoader( manager : LoadingManager )

manager — 加載器使用的loadingManager,默認為THREE.DefaultLoadingManager.

創(chuàng)建一個新的ImageBitmapLoader.

屬性

共有屬性請參見其基類Loader。

.isImageBitmapLoader : Boolean

只讀標志,用于檢查給定對象是否屬于 ImageBitmapLoader 類型。

.options : String

一個可選對象,用來設(shè)置內(nèi)部使用的createImageBitmap工廠方法, 默認為undefined.

方法

共有方法請參見其基類Loader。

.load ( url : String, onLoad : Function, onProgress : Function, onError : Function ) : undefined

url — 文件的URL或者路徑,也可以為 Data URI.
onLoad — 加載完成時將調(diào)用?;卣{(diào)參數(shù)為將要加載的image.
onProgress — 此回調(diào)函數(shù)暫時不支持
onError — 在加載錯誤時被調(diào)用。

從URL中進行加載,并返回將包含數(shù)據(jù)的image對象。

.setOptions ( options : Object ) : this

設(shè)置createImageBitmap的選項對象。

src/loaders/ImageBitmapLoader.js


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

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號