I am interested in creating a unique surface that showcases a square meshed colormap with distinct colors assigned to each face. Currently, I've managed to develop the geometry by drawing inspiration from @LeeStemkoski but I'm facing an issue where the colors are being interpolated between faces. Is there a method to make the colors align specifically between integer values xx and xx+1, yy and yy+1? Alternatively, are there more effective ways to generate this mesh other than using THREE.ParametricGeometry
for ( var i = 0; i < graphGeometry.faces.length; i++ )
{
face = graphGeometry.faces[ i ];
numberOfSides = ( face instanceof THREE.Face3 ) ? 3 : 4;
for( var j = 0; j < numberOfSides; j++ )
{
vertexIndex = face[ faceIndices[ j ] ];
//face.vertexColors[ j ] = graphGeometry.colors[ vertexIndex ];
point = graphGeometry.vertices[ vertexIndex ];
color = new THREE.Color( 0x0000ff );
xx = Math.round(point.x+nx/2);
yy = Math.round(point.y+ny/2);
ii = nx*yy+xx;
color.setHSL( 0.7 * (max - frame[ii]) / (max-min), 1, 0.5 );
face.vertexColors[ j ] = color;
}
}