Мне нужно применить текстуру к объекту ExtrudeGeometry.
Форма представляет собой круг, а путь выдавливания состоит из двух векторов:
- Один для вершины.
- Один для дна.
Я выбрал цилиндрическую геометрию не потому, что мне нужно разместить верхние и нижние части моей геометрии в точных положениях, а также потому, что созданная геометрия не всегда будет чисто вертикальной (например, наклонный цилиндр).
Вот изображение сечения (один верхний вектор, один нижний вектор и фигура, выдавленная между этими двумя векторами).
и изображение текстуры, которую я пытаюсь применить.
Все, что я хочу сделать, это обернуть это изображение по вертикальным сторонам моего объекта только один раз.
Вот мой код:
var biVectors = [ new THREE.Vector3( this.startVector.x, this.startVector.y, this.startVector.z ) , new THREE.Vector3( this.endVector.x, this.endVector.y, this.endVector.z ) ];
var wellSpline = new THREE.SplineCurve3(biVectors);
var extrudeSettings = {
steps : 1,
material: 0,
extrudeMaterial: 1,
extrudePath : wellSpline
};
var pts = [];
for (var i = 0; i <= this.segments; i++) {
var theta = (i / this.segments) * Math.PI * 2;
pts.push( new THREE.Vector3(Math.cos(theta) * this.diameter , Math.sin(theta) * this.diameter, 0) );
}
var shape = new THREE.Shape( pts );
var geometry = new THREE.ExtrudeGeometry( shape, extrudeSettings );
var texture = THREE.ImageUtils.loadTexture( 'textures/sampleTexture2.jpg' );
texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
texture.flipY = false;
var material = new THREE.MeshBasicMaterial( { map: texture } );
var slice = new THREE.Mesh( geometry, material );
var faceNormals = new THREE.FaceNormalsHelper( slice );
console.log("face normals: ", faceNormals);
myCanvas.scene.add( faceNormals );
slice.parentObject = this;
myCanvas.scene.add( slice );
this.object3D = slice;
}
Теперь, как вы можете видеть, отображение совсем не правильное.
Я прочитал много информации об этой проблеме за последние 3 дня. Но у меня заканчиваются варианты, так как я новичок в THREE.JS.
Я думаю, что мне нужно переопределить координаты UV, но я понятия не имею, как это сделать.
Кажется, что наложение текстуры на объект, подобный цилиндру, в THREE.JS совсем не просто.
Может ли кто-нибудь помочь мне в этом вопросе?
CylnderGeometry
и применить к нему матрицу сдвига, чтобы получить желаемый наклонный эффект? stackoverflow.com/questions/25639268/ - person WestLangley   schedule 27.01.2015ExtrudeGeometry
. - person WestLangley   schedule 28.01.2015