Я хочу дать каждой грани сферы THREE.js собственную текстуру. Поэтому я позволяю SphereGeometry вычислять вершины и преобразовывать каждую грань в PlaneGeometry, используя вершины граней.
THREE.SpherePlaneGeometry = function ( v1, v2, v3, v4 ) {
THREE.Geometry.call( this );
var normal = new THREE.Vector3( 0, 1, 0 );
this.vertices.push( v1.clone() );
this.vertices.push( v2.clone() );
this.vertices.push( v3.clone() );
this.vertices.push( v4.clone() );
var face = new THREE.Face4( 0, 1, 2, 3 );
face.normal.copy( normal );
face.vertexNormals.push( normal.clone(), normal.clone(), normal.clone(), normal.clone() );
this.faces.push( face );
var uvs = [
new THREE.UV( 1.0, 0.0 ),
new THREE.UV( 0.0, 0.0 ),
new THREE.UV( 0.0, 1.0 ),
new THREE.UV( 1.0, 1.0 ),
];
this.faceVertexUvs[ 0 ].push( uvs );
};
чтобы убедиться, что все это выполняется позже с возвращенной геометрией:
geometry.computeCentroids();
geometry.computeFaceNormals();
geometry.verticesNeedUpdate = true;
geometry.uvsNeedUpdate = true;
geometry.normalsNeedUpdate = true;
geometry.tangentsNeedUpdate = true;
geometry.elementsNeedUpdate = true;
geometry.dynamic = true;
Применяя эту текстуру:
Я получил этот результат:
Что можно сделать, чтобы убрать искажение между красной и зеленой точками? Для полюсов одна вершина используется дважды, но может быть лучше, есть идеи?