youpilat13 youpilat13 - 1 year ago 175
Javascript Question

Draw lines of mesh on SphereGeometry

I try to draw lines of a THREE.mesh whose geometry is done with

and material with

To achieve this, I have used the following snippet code:

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);


This snippet doesn't produce the expected lines.

Instead of above code, I tried also to do:

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



The lines of mesh aren't displayed too.

I use three.min.js version 74.

Answer Source

Use THREE.WireframeHelper class.

var wireframe = new THREE.WireframeHelper( sphere, 0x00ff00 );
scene.add( wireframe );

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download