如何使用 Three.js 获取纹理尺寸

Fre*_*oud 3 javascript textures three.js

我想知道是否可以获得纹理的尺寸?我用这条线来设置我的纹理:

const texture = THREE.ImageUtils.loadTexture(src)
Run Code Online (Sandbox Code Playgroud)

也许有必要加载图像以获取其尺寸(但是否只能使用 javascript,而不是 html 及其 div ?)?

我希望我之后创建的材料适合纹理尺寸。

The*_*m01 6

首先,THREE.ImageUtils.loadTexture在最新的 THREE.js (r90) 中已弃用。看一眼THREE.TextureLoader

也就是说,您可以从加载的纹理中获取图像及其属性。

texture.image
Run Code Online (Sandbox Code Playgroud)

根据图像格式,您应该能够访问width/height属性,这将是您的纹理尺寸。

请注意:加载纹理是异步的,因此您需要定义onLoad回调。

var loader = new THREE.TextureLoader();
var texture = loader.load( "./img.png", function ( tex ) {
    // tex and texture are the same in this example, but that might not always be the case
    console.log( tex.image.width, tex.image.height );
    console.log( texture.image.width, texture.image.height );
} );
Run Code Online (Sandbox Code Playgroud)

  • 值得注意的是,从调用“TextureLoader.load()”返回的纹理可能还不包含图像。而在回调函数中它确实如此。这是因为“load()”函数的异步特性。 (3认同)