Question

我具有planeGeometry，并且我的顶点比其他顶点高，因此某些顶点具有不同的z索引以生成类似地形的纹理。

我想在不同的平面上添加草，沙，雪等不同的纹理。

如何将材料添加到不同的平面。

这是生成平面几何的方法。 https://github.com/mrdoob/three.js/blob/master/src/geometries/PlaneGeometry.js

    var indices = [];
    var vertices = [];
    var normals = [];
    var uvs = [];

    // generate vertices, normals and uvs

    for ( iy = 0; iy < gridY1; iy ++ ) {
        var y = iy * segment_height - height_half;
        for ( ix = 0; ix < gridX1; ix ++ ) {
            var x = ix * segment_width - width_half;
            vertices.push( x, - y, 0 );
            normals.push( 0, 0, 1 );
            uvs.push( ix / gridX );
            uvs.push( 1 - ( iy / gridY ) );
        }
    }

    // indices

    for ( iy = 0; iy < gridY; iy ++ ) {

        for ( ix = 0; ix < gridX; ix ++ ) {
            var a = ix + gridX1 * iy;
            var b = ix + gridX1 * ( iy + 1 );
            var c = ( ix + 1 ) + gridX1 * ( iy + 1 );
            var d = ( ix + 1 ) + gridX1 * iy;
            // faces
            indices.push( a, b, d );
            indices.push( b, c, d );
        }
    }

    // build geometry

    this.setIndex( indices );
    this.addAttribute( 'position', new Float32BufferAttribute( vertices, 3 ) );
    this.addAttribute( 'normal', new Float32BufferAttribute( normals, 3 ) );
    this.addAttribute( 'uv', new Float32BufferAttribute( uvs, 2 ) );

这是应该怎么做：

//Loading in Texture:

var loader = new THREE.TextureLoader();
var texture = loader.load('grass.jpg');
//Creating material:

var material = new THREE.MeshBasicMaterial({
    map: texture,
    overdraw: true,
    wireframe: false
});
var materials = [];
materials.push(material);
mesh = new THREE.Mesh(geometry, materials);
// Applying this one to faces that need certain material:
// https://threejs.org/docs/#api/en/core/BufferGeometry.addGroup
geometry.addGroup();

基本上，我甚至需要在第一个平面上添加纹理，但是它总是在整个几何体上添加纹理，然后我可以自己创建循环，该循环确实会创建休息的纹理。

将多个纹理应用于相同的几何

0 个答案: