3

尝试在three.js 中将纹理应用于我的对象时，我一直遇到问题。每当我尝试对挤出的几何体进行纹理处理时，纹理就不会出现。在放弃了一段时间然后回来挖掘更多之后，我发现 ExtrudedGeometry.js 在应用纹理时使用了世界坐标。

我想将其更改为局部坐标，以便我的纹理正确包裹。我一直在寻找一段时间，但似乎找不到与此主题相关的任何内容。以下是帮助我走到这一步的讨论，包括紫外线发生器。

https://github.com/mrdoob/three.js/issues/1396

https://github.com/mrdoob/three.js/issues/1824

BoundingUVGenerator = {
generateTopUV: function( geometry, extrudedShape, extrudeOptions, indexA, indexB, indexC) {
    var ax = geometry.vertices[ indexA ].x,
        ay = geometry.vertices[ indexA ].y,

        bx = geometry.vertices[ indexB ].x,
        by = geometry.vertices[ indexB ].y,

        cx = geometry.vertices[ indexC ].x,
        cy = geometry.vertices[ indexC ].y,

        bb = extrudedShape.getBoundingBox(),
        bbx = (bb.maxX - bb.minX),
        bby = (bb.maxY - bb.minY)

    return [
        new THREE.UV( ( ax - bb.minX ) / bbx, 1 - ( ay - bb.minY ) / bby ),
        new THREE.UV( ( bx - bb.minX ) / bbx, 1 - ( by - bb.minY ) / bby ),
        new THREE.UV( ( cx - bb.minX ) / bbx, 1 - ( cy - bb.minY ) / bby )
    ];
},

generateBottomUV: function( geometry, extrudedShape, extrudeOptions, indexA, indexB, indexC) {
    return this.generateTopUV( geometry, extrudedShape, extrudeOptions, indexA, indexB, indexC );
},

generateSideWallUV: function( geometry, extrudedShape, wallContour, extrudeOptions,
                              indexA, indexB, indexC, indexD, stepIndex, stepsLength,
                              contourIndex1, contourIndex2 ) {
    var ax = geometry.vertices[ indexA ].x,
        ay = geometry.vertices[ indexA ].y,
        az = geometry.vertices[ indexA ].z,

        bx = geometry.vertices[ indexB ].x,
        by = geometry.vertices[ indexB ].y,
        bz = geometry.vertices[ indexB ].z,

        cx = geometry.vertices[ indexC ].x,
        cy = geometry.vertices[ indexC ].y,
        cz = geometry.vertices[ indexC ].z,

        dx = geometry.vertices[ indexD ].x,
        dy = geometry.vertices[ indexD ].y,
        dz = geometry.vertices[ indexD ].z;

    var amt = extrudeOptions.amount,
        bb = extrudedShape.getBoundingBox(),
        bbx = bb.maxX - bb.minX,
        bby = bb.maxY - bb.minY;

    if ( Math.abs( ay - by ) < 0.01 ) {
        return [
            new THREE.UV( ax / bbx, az / amt),
            new THREE.UV( bx / bbx, bz / amt),
            new THREE.UV( cx / bbx, cz / amt),
            new THREE.UV( dx / bbx, dz / amt)
        ];
    } else {
        return [
            new THREE.UV( ay / bby, az / amt ),
            new THREE.UV( by / bby, bz / amt ),
            new THREE.UV( cy / bby, cz / amt ),
            new THREE.UV( dy / bby, dz / amt )
        ];
    }
}};

我真的可以在这方面使用一些帮助。这是我一直在处理的一个问题，但我还没有找到任何东西。

4

0 回答 0