相关疑难解决方法(0)

我试图在一个平面上有多个材料来制作一个简单的地形编辑器.所以我创建了几个材质,并尝试为我的平面中的每个顶点指定一个材质索引:

var materials = [];
materials.push(new THREE.MeshFaceMaterial( { color: 0xff0000 }));
materials.push(new THREE.MeshFaceMaterial( { color: 0x00ff00 }));
materials.push(new THREE.MeshFaceMaterial( { color: 0x0000ff }));
// Plane
var planegeo = new THREE.PlaneGeometry( 500, 500, 10, 10 );
planegeo.materials = materials;
for(var i = 0; i <  planegeo.faces.length; i++)
{
    planegeo.faces[i].materialIndex = (i%3);
}

planegeo.dynamic = true;
this.plane = THREE.SceneUtils.createMultiMaterialObject(planegeo, materials);

但是如果我使用MeshBasicMaterial而不是FaceMaterial,我总是在着色器中得到一大堆错误,或者只得到一个全红色的平面.任何帮助都是伟大的thx!

有人可以验证three.js r53的以下代码吗？

它来自这个问题:如何在Three.js立方体中使用多种材料？

我尝试了这个代码和一些变化,但我没有得到可见的立方体.我的纹理图像按照它们的名称命名.

var materials = [];

for (var i=0; i<6; i++) {
  var img = new Image();
  img.src = i + '.png';
  var tex = new THREE.Texture(img);
  img.tex = tex;

  img.onload = function() {
      this.tex.needsUpdate = true;
  };

  var mat = new THREE.MeshBasicMaterial({color: 0xffffff, map: tex});
  materials.push(mat);
}

var cubeGeo = new THREE.CubeGeometry(400, 400, 400, 1, 1, 1, materials);
var cube = new THREE.Mesh(cubeGeo, new THREE.MeshFaceMaterial());

所以我正在尝试建立一个由瓷砖组成的基于3D的世界.

我已经成功地使用平面几何和高度值等设法做到了这一点.但是现在我已经到了可能需要改变一切的地步.

问题是我想要一个瓷砖有多个纹理(使用着色器因为我想要混合它们).我能够全局地做到这一点(因此每个图块将具有相同的纹理+使用一些uv映射).

但是我无法理解我将如何指定哪个图块具有哪些纹理(并且我有大约100个纹理),因为平面几何图形只有1个着色器材质.而且我也不确定通过着色器发送100个纹理是否是一个好主意？

所以我的问题基本归结为:

有没有一种体面/高效的方式将平铺/顶点链接到纹理,所以我可以保持平面几何.

- 如果是的话:怎么样？

- 如果不是:我应该单独创建每个图块(因此是1x1的平面)并将它们合并在一起(性能/顶点混合？)因此它充当单个平面(在这种情况下,合并平面由许多1x1平面组成)和每块瓷砖使用着色器(1x1平面)？

这些事情一般如何完成？

编辑:

一些额外的信息,因为似乎我的问题不是很清楚:

我想要的是一个瓷砖(2个面)有多个"materialIndexes"来表示.目前我需要有1个图块才能有3个纹理,所以我可以使用特定算法将它们混合在着色器中.

例如,我想要一个心形(红色的心/黑色背景)作为纹理,而不是基于我想要混合/更改其他2个纹理的颜色,所以我可以得到例如木心和蓝色背景.或者例如,我应该能够在正方形上均匀地混合4个纹理,每个纹理占正方形的1/4.但这里的重点不是纹理必须做什么,而是我如何为我的面孔/瓷砖指定这样的3,4或更多纹理.