Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Drawing edges of a mesh in Three.js

Tags:

three.js

mesh

Is there something as Stroke to draw the edges of a mesh?

I would like to have my object to look like this:

Black stroked, white filled object

like image 335
Ph1 Avatar asked Apr 07 '16 09:04

Ph1


People also ask

What is a mesh in three Js?

A mesh object is made up of a geometry and a material. Twelve different geometries are available under "Select Object." These are created using standard classes such as THREE. SphereGeometry and THREE. Icosahedron geometry. The cylinder, cone, hexagonal frustum, and half-cylinder are all made using the class THREE.


1 Answers

EDIT: This answer was outdated, and has been updated.


If you want to render only the edges of your mesh, you can use EdgesGeometry.

var geometry = new THREE.EdgesGeometry( mesh.geometry );

var material = new THREE.LineBasicMaterial( { color: 0xffffff } );

var wireframe = new THREE.LineSegments( geometry, material );

scene.add( wireframe );

You can also use THREE.WireframeGeometry.

For an example showing how to render both edges and faces, see this stackoverflow answer.

three.js r.94

like image 59
WestLangley Avatar answered Oct 22 '22 18:10

WestLangley