等距房间生成 X、Y 着色

Question

我想生成一个等角房间，我想用这种风格上色：

但是我当前的代码给出了这个结果：

这是我当前的代码（我不知道，如果它是用这种方法生成块的正确方法。也许任何人都可以帮助我，它是如何正确工作的？

for(let iX = 0; iX < 10; iX++) {
    for(let iZ = 0; iZ < 10; iZ++) {
        if(iX % 2 == 0) {
            material = material1;
        } else {
            material = material2;
        }
        
        var box = generateBox(1, 0.1, 1, material);

        box.name = `box-${iX}-${iZ}`;

        box.position.set(iX, box.geometry.parameters.height / 2, iZ);

        room.add(box);
    }
}

Answer 1

您仅根据 iX 变量的值更改 material 样式。相反，您应该根据 iX 和 iZ 变量的值更改它，如下所示：

if ((iX + iZ) % 2 === 0) {
  material = material1;
} else {
  material = material2;
}

等距房间生成 X、Y 着色

Isometric Room Generating X, Y Coloring

javascript

three.js

isometric