In my attempt to draw lines on a THREE.mesh using a SphereGeometry for the geometry and a MeshBasicMaterial for the material, I encountered some challenges.
Initially, I used the following code snippet:
var segments = 32 var geometry = new THREE.SphereGeometry(3, segments, segments, 0, Math.PI * 2, 0, Math.PI * 2);
var material = new THREE.MeshBasicMaterial({color: 0x900000});
var sphere = new THREE.Mesh(geometry, material);
scene.add(sphere); Unfortunately, this code did not produce the desired lines on the mesh.
As an alternative approach, I also experimented with the following code:
var sphere = new THREE.Object3D();
sphere.add( new THREE.LineSegments(
new THREE.Geometry(),
new THREE.LineBasicMaterial({
color: 0xffffff,
transparent: true,
opacity: 0.5
})
));
sphere.add( new THREE.Mesh(
new THREE.Geometry(),
new THREE.MeshPhongMaterial({
color: 0x156289,
emissive: 0x072534,
side: THREE.DoubleSide,
shading: THREE.FlatShading
})
));
scene.add(sphere); Even with this code variation, the lines on the mesh were still not displayed as expected.
For these experiments, I utilized the three.min.js version 74.