0

In my project I am creating LineSegments (LineMesh) with modified geometry (changing the vertex positions) from another mesh and with MeshBasicMaterialwith black color.Adding the LineMesh to the already existing Mesh. Everything works fine. But now I want to hide particular part of the mesh by setting visible property to false by taking the materialIndex from the faces of geometry.But in this, the previously created mesh is hiding but LineMesh added to it is not hiding. Is it possible to hide particular part of LineMesh and also wanted to know whether LineMesh will support MultiMaterial.So that it will be easy for me to apply visibility, transparent property to particular part of Mesh.

var mesh, renderer, scene, camera, materials;

init();
animate();

function init() {

// renderer
renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

// scene
scene = new THREE.Scene();

// camera
camera = new THREE.PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 10000 );
camera.position.z = 300;
camera.lookAt( scene.position );

// directional
var light = new THREE.DirectionalLight( 0xffffff );
light.position.set( 1, 1, 1 );
scene.add( light );

// ambient
var ambient = new THREE.AmbientLight( 0x222222 );
scene.add( ambient );

// geometry
var geometry = new THREE.BoxGeometry( 100, 100, 100, 4, 4, 4 );

// materials
materials = [
    new THREE.MeshLambertMaterial( { color: 0xffff00, side: THREE.DoubleSide } ),
    new THREE.MeshBasicMaterial( { color: 0x00ffff, side: THREE.DoubleSide } )
];

// assign material to each face
for( var i = 0; i < geometry.faces.length; i++ ) {
    geometry.faces[ i ].materialIndex = THREE.Math.randInt( 0, 1 );
}
geometry.sortFacesByMaterialIndex(); // optional, to reduce draw calls

// mesh
mesh = new THREE.Mesh( geometry, materials );
scene.add( mesh );

mat = new THREE.LineBasicMaterial({color: 0x000000});
mesh2= new THREE.LineSegments(geometry, mat);
mesh.add(mesh2);

}

function animate() {

requestAnimationFrame( animate );

mesh.rotation.x += 0.01;
mesh.rotation.y += 0.02;
mesh.rotation.z += 0.03;

renderer.render( scene, camera );

}

This below code is not to be working for LineSegments

mesh2= new THREE.LineSegments(geometry, new THREE.MultiMaterial(materials));
Edric
  • 24,639
  • 13
  • 81
  • 91
Aasha joney
  • 508
  • 5
  • 23
  • Your code doesn't match your question. You say you're creating `LineSegments`, but the code says you're using `Line` and `LinePieces` (which is deprecated). I was also unable to get any lines to draw at all, even when I switched them to `LineSegments`, and added them directly to the scene without the box mesh. Please update your code to a current working example, and we'll be able to help debug further. – TheJim01 Sep 01 '17 at 14:18
  • To be clear, I am having a JSON model having 2 material array for 2 different parts. I am using multimaterial to push these material information.With the help of material ID, I could turn on and off the part visibility. And also I would like to add LineSegments to the mesh.And now when I turn on off the part visibility, the line mesh is still on scene.And we could only control the visibility of LineMesh on a whole but not on a single part since it does not support multimaterial. – Aasha joney Sep 04 '17 at 07:01
  • I have edited the post @TheJim01 – Aasha joney Sep 04 '17 at 07:14
  • What version of three.js are you using? `MultiMaterial` was recently deprecated in favor of a simple array. I'm not saying that upgrading will fix your problem (I haven't tried it myself--I'm currently on mobile), but it might. – TheJim01 Sep 04 '17 at 14:18
  • I am using THREE.js version 83 @TheJim01 – Aasha joney Sep 05 '17 at 03:51
  • Then how could it be solved ? – Aasha joney Sep 05 '17 at 03:51
  • To my knowledge (and I'm honestly not that familiar with `Geometry`), `LineSegments` does not appear to support the concept of `materialIndex` like `Mesh` does, at least not from a `Geometry` type geometry object. If you switch to `BufferGeometry`, you can use [groups](https://threejs.org/docs/#api/core/BufferGeometry.groups) to achieve what you want. If you're using `JSONLoader`, you could potentially modify it to use `BufferGeometry` directly. – TheJim01 Sep 06 '17 at 20:57
  • It seems like line does not support BufferGeometry . – Aasha joney Sep 07 '17 at 04:28
  • Both `Line` and `LineSegments` can take `BufferGeometry` as their geometry parameter. – TheJim01 Sep 07 '17 at 15:04

0 Answers0