帮助!我试图在THREEjs中创建和合并两个不同的对象。我有一个图像,我需要它在整个合并对象上拉伸一次。目前它正在做两次,一次在顶部,一次在底部,就像它们仍然是两个独立的对象。
var texture = new THREE.TextureLoader().load('//s1.postimg.org/26dva6d58v/peace.png');
texture.alphaTest = 0.9;
texture.needsUpdate = true;
color = new THREE.MeshStandardMaterial( {
side: THREE.DoubleSide,
color: 0x949494,
map: texture
} );
var size = {'top': 1.395, 'bottom': 1.11, 'height': 3.5};
cylinderGeo1 = new THREE.CylinderGeometry( size.top, size.bottom, size.height, 50, null, true );
cylinderGeo1.applyMatrix( new THREE.Matrix4().makeTranslation(0, size.height/2, 0) );
cylinder1 = new THREE.Mesh(cylinderGeo1);
cylinderGeo2 = new THREE.CylinderGeometry( size.top * 2,size.top, size.height, 50, null, true );
cylinderGeo2.applyMatrix( new THREE.Matrix4().makeTranslation(0, (size.height/2) + size.height, 0) );
cylinder2 = new THREE.Mesh(cylinderGeo2);
cupGeo = new THREE.Geometry();;
cylinder1.updateMatrix();
cupGeo.merge(cylinderGeo1, cylinder1.matrix);
cylinder2.updateMatrix();
cupGeo.merge(cylinderGeo2, cylinder2.matrix);
cup = new THREE.Mesh(cupGeo, color);
cup.updateMatrix();
scene.add(cup);
https://jsfiddle.net/dj2k6y8t/16/
[edit]您可能需要放大画布才能进行渲染。