问如何禁用three.js来调整图像的大小？

EN

three.js实际上是想让帮你一个忙。

因为它是开源的，所以我们可以读取WebGLRenderer.js的源代码，并看到setTexture方法调用(非公共可见的)方法uploadTexture。

后者有这样的支票：

if ( textureNeedsPowerOfTwo( texture ) && isPowerOfTwo( image ) === false ){

    image = makePowerOfTwo( image );
}

这本身就解释得很清楚。

现在，您可能会想知道textureNeedsPowerOfTwo实际上检查了什么。让我们看看。

function textureNeedsPowerOfTwo( texture ) {

        if ( texture.wrapS !== THREE.ClampToEdgeWrapping || texture.wrapT !== THREE.ClampToEdgeWrapping ) return true;
        if ( texture.minFilter !== THREE.NearestFilter && texture.minFilter !== THREE.LinearFilter ) return true;

        return false;
}

如果您对与夹子不同的纹理使用包装，或者使用不最近或不线性的筛选，则纹理将被缩放。

如果您对这个代码感到惊讶，我强烈建议您看看关于使用纹理的MDN页面。

引文

陷阱:这些纹理非动力的两个纹理不能与mipmapping一起使用，它们不能“重复”(瓷砖或包装)。..。 在不执行上述配置的情况下，WebGL需要返回实心黑色: rgba(0,0,0,1)，从而使两个纹理的NPOT非幂的所有示例都失败。

因此，使用带有的NPOT纹理，不正确的纹理参数将为您提供好的旧实心黑色。

由于three.js是开源的，所以您可以编辑本地副本并删除“违规”检查。

然而，一种更好、更简单和更易于维护的方法是简单地缩放UV映射。毕竟，它只是为了这个用例而存在。