// Retrieving the mesh and integrating it into the scene.
var loader = new THREE.JSONLoader();
loader.load( "models/cubic.js", function(geometry){
// var material = new THREE.MeshLambertMaterial({color: 0x55B663});
alert(geometry.faces.length);
//for ( var i = 0; i < geometry.faces.length; i ++ ) {
var face = geometry.faces[ 2];
face.color.setHex(0x55B663 );
var face = geometry.faces[ 3 ];
face.color.setHex(0x55B663 );
var face = geometry.faces[ 4];
face.color.setHex(0xFFFF00 );
var face = geometry.faces[ 5 ];
face.color.setHex(0xFFFF00 );
var face = geometry.faces[ 8];
face.color.setHex(0x666600 );
var face = geometry.faces[ 9 ];
face.color.setHex(0x666600 );
var face = geometry.faces[ 6];
face.color.setHex(0x1A1A00 );
var face = geometry.faces[ 7 ];
face.color.setHex(0x1A1A00 );
var face = geometry.faces[ 10];
face.color.setHex(0x00001a);
var face = geometry.faces[ 11 ];
face.color.setHex(0x00001a);
var face = geometry.faces[ 1];
face.color.setHex(0x200614);
var face = geometry.faces[ 0 ];
face.color.setHex(0x200614);
//}
mesh1 = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { vertexColors: THREE.FaceColors } ));
//mesh1 = new THREE.Mesh(geometry, material);
scene.add(mesh1);
mesh1.position.x=-3;
});
<input id="color" type="text" />
<button id="submit" type="submit">submit</button>
Is it possible to enable users to input their desired color for the object?
In the code above, colors for each face of the object are hardcoded but there is a need to implement user input for setting the colors dynamically.