Come modificare il modo in cui l'ombreggiatura appare nei cubi in Three.js?

Question

Sto creando un piccolo gioco usando Three.js e tutto sta andando bene a parte i problemi di ombreggiatura shome con i cubi. Fondamentalmente sto costruendo un livello di gioco semplicemente facendo cadere dei cubetti testurizzati per formare un labirinto. Il problema è che quando i cubi sono uno accanto all'altro, ognuno è ombreggiato in modo tale da sembrare un'entità separata e non parte di un muro più grande.

Ecco un esempio, notare l'illusione di un unico muro si perde:

C'è una diversa tecnica di ombreggiatura dovrei usare o c'è una bella proprietà da impostare da qualche parte per cambiare questa comportamento di ombreggiamento?

Questo è il mio modello di cubo:

{ 

    "metadata" : 
    { 
     "formatVersion" : 3, 
     "generatedBy" : "Blender 2.60 Exporter", 
     "vertices"  : 8, 
     "faces"   : 6, 
     "normals"  : 8, 
     "colors"  : 0, 
     "uvs"   : 4, 
     "materials"  : 1, 
     "morphTargets" : 0 
    }, 

    "scale" : 1.000000, 
    "materials": [{ 
     "DbgColor" : 15658734, 
     "DbgIndex" : 0, 
     "DbgName" : "WallCube", 
     "colorAmbient" : [1.0, 1.0, 1.0], 
     "colorDiffuse" : [1.0, 1.0, 1.0], 
     "colorSpecular" : [0.15, 0.15, 0.15], 
     "mapDiffuse" : "../../textures/walls/stone/stone.png", 
     "mapDiffuseWrap" : ["repeat", "repeat"], 
     "mapNormal" : "../../textures/walls/stone/stone_normal.png", 
     "mapNormalFactor" : 1.0, 
     "shading" : "Lambert", 
     "specularCoef" : 25, 
     "transparency" : 1.0, 
     "vertexColors" : false 
    }], 

    "vertices": [50.000000,-50.000000,-50.000000,50.000000,-50.000000,50.000000,-50.000000,-50.000000,50.000000,-50.000000,-50.000000,-50.000000,50.000000,50.000000,-50.000000,50.000000,50.000000,50.0000050,-50.000000,50.000000,50.000000,-50.000000,50.000000,-50.000000], 

    "morphTargets": [], 

    "normals": [1.000000,-1.000000,-1.000000,1.000000,-1.000000,1.000000,-1.000000,-1.000000,1.000000,-1.000000,-1.000000,-1.000000,1.000000,1.000000,-1.000000,-1.000000,1.000000,-1.000000,-1.000000,1.000000,1.000000,1.000000,1.000000,1.000000], 

    "colors": [], 

    "uvs": [[0.000000,1.000000,1.000000,1.000000,1.000000,0.000000,0.000000,0.000000]], 

    "faces": [43,0,1,2,3,0,0,1,2,3,0,1,2,3,43,4,7,6,5,0,0,1,2,3,4,5,6,7,43,0,4,5,1,0,1,2,3,0,0,4,7,1,43,1,5,6,2,0,1,2,3,0,1,7,6,2,43,2,6,7,3,0,1,2,3,0,2,6,5,3,43,4,0,3,7,0,3,0,1,2,4,0,3,5] 

} 

e questo è come lo carico:

JSONLoader = new THREE.JSONLoader(); 

Light = new THREE.PointLight(0xFFFFFF); 
Light.position = {x:0, y:75, z:350}; 

Meshes = []; 
JSONLoader.load("../assets/models/cube.js", function(Geometry) 
{ 
    for (var MeshIndex = 0; MeshIndex <= 5; MeshIndex++) 
    { 
     Meshes[MeshIndex] = new THREE.Mesh(Geometry, new THREE.MeshFaceMaterial()); 
     Meshes[MeshIndex].position.x = MeshIndex * 100; 
     Scene.add(Meshes[MeshIndex]); 
    } 
}); 

Scene.add(Light); 

Tutte le idee come fare i cubetti di apparire come una parete continua?

Answer 1

JSONLoader.load("../assets/models/cube.js", function(Geometry) 
{ 
    Geometry.materials[ 0 ].shading = THREE.FlatShading; 

    // ... 
} 

Questo è stato gentilmente risposto da alteredq sul sito three.js.

https://github.com/mrdoob/three.js/issues/1258#issuecomment-3834489