0

Buenas amigos, necesito saber como hacer un grafico 3D (algun tipo de estructura o caja) que en su interior trace una linea de acuerdo a unos valores que se les pasaran. Adjunto imagen de lo que quiero hacer.

He intentado crear un cubo sin textura, donde solo se vea las lineas que lo denotan, transparente para comenzar, pero tengo un problema con las texturas, en el editor online pero no me deja ver como se gustaria el codigo de edicion.

Producto del editor online

Lo que trato de implementar:

Lo que se intenta hacer

Link(s):
EDITOR ONLINE: threejs.org/editor/
PAGINA OFICIAL: threejs.org/

2
  • 2
    Hola @Jose. En el título mencionas a three.js. Tendrías muchísimas más chances de obtener una buena respuesta si das más detalles. ¿qué intentaste hasta ahora (por más que no funcione)? Encontrarás el enlace para editar debajo de pregunta
    – Mariano
    el 15 nov. 2016 a las 21:21
  • Gracias por el concejo @Mariano el 16 nov. 2016 a las 13:32

1 respuesta 1

2

Primero que nada: ¿Que versión de Three.js estás utilizando?.

Esta pregunta es debido a que en la versión inferior a la 81 puedes utilizar el objeto EdgeHelper para hacer las aristas y para quitar la malla que tienes en las caras del cubo en el MeshBasicMaterial tienes que pasarle el valor wireframe: False:

shape3D_material = new THREE.MeshBasicMaterial({
    color:0x9E0000,
    wireframe: false,
    transparent: true,
    opacity: this.shapes_settings.opacity
});

Después de esto agregaremos el objeto EdgesHelper:

shape3D                             =   new THREE.Mesh(shape3D_geometry,    shape3D_material);

this.scene.add(shape3D);

//  Generamos las aristas
edges                               =   new THREE.EdgesHelper(shape3D, 0x808080);
edges.material.linewidth            =   3;

this.scene.add(edges);

introducir la descripción de la imagen aquí

Nota: Lo de la versión te lo comento porque este objeto EdgeHelper fue removida en la versión 81.

En la versión 81 en adelante, si no mal recuerdo podrías usar:

  • WireframeGeometry

Puedes checar en la documentación oficial y puedes checar este ejemplo:

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.