0
354
VistasThree.js extruir verticalmente
Soy nuevo en three.js y quiero extruir una forma verticalmente. Puedo establecer los puntos de la forma 2D, pero cuando la extruyo, la extrusión ocurre a lo largo del eje z. Quiero extruir la forma a lo largo del eje y, ¿cómo puedo hacer que esto suceda de la manera más simple? (En este ejemplo, sé que podría usar una geometría de caja, porque estoy extruyendo un rectángulo, pero es solo por simplicidad, quiero extruir formas complejas).
Una cosa que intenté fue rotar la malla después de extruirla, pero eso me confunde con el punto de inicio (hace que sea más difícil calcular las posiciones de los objetos contenidos en los objetos extruidos).
Entonces, para mantenerlo simple, quiero algo como esto, sin rotaciones.
mi código:
export function createStorageLocation(storageLocation: StorageLocation) { const shape = new Shape(); shape.moveTo(0, 0); shape.lineTo(0, 200 / 100); shape.lineTo(400 / 100, 200 / 100); shape.lineTo(400 / 100, 0); shape.lineTo(0, 0); const extrudeSettings: ExtrudeGeometryOptions = { steps: 2, depth: 10, bevelEnabled: false, bevelThickness: 1, bevelSize: 1, bevelOffset: 0, bevelSegments: 1, }; const geometry = new ExtrudeGeometry(shape, extrudeSettings); const material = new MeshStandardMaterial({ color: 'blue', opacity: 0.7, transparent: false, }); const location = new Mesh(geometry, material); const axesHelper = new AxesHelper(5); location.add(axesHelper); location.position.set( storageLocation.startPoint.x / 100, storageLocation.startPoint.y / 100, storageLocation.startPoint.z / 100 ); return location; } estado actual de la aplicación: 
2 Respuestas
Responde la pregunta0
ExtrudeGeometry supone que la forma que se va a extruir está definida en el plano xy y que la extrusión se hará a lo largo de + z . Ver, por ejemplo, las líneas 421-449 del código fuente , en particular la línea 432:
v( vert.x, vert.y, depth / steps * s ); Donde v(x, y, z) es una función miembro que empuja un triple de coordenadas en la matriz de vértices del objeto; vert.x y vert.y son las coordenadas x e y de la forma que se está extruyendo; y depth / steps * s produce la coordenada z de la extrusión en un paso particular.
Además, la presunción de que la forma está en el plano xy es necesaria porque los objetos Shape son bidimensionales; la Planicie del plano xy es el único mundo que conocen.
Para obtener el comportamiento que desea ( es decir , sin rotaciones), debe implementarlo usted mismo. Puede comenzar con lo que ExtrudeGeometry hace internamente y trasplantar la extrusión del eje z al eje y . La lógica es bastante trivial en el caso de un rectángulo con una ruta de extrusión recta (como sus ejemplos aquí), volviéndose más compleja en proporción a la complejidad de la forma y la ruta de extrusión, pero sigue siendo mucho más compleja que morder una bala y usando el método de extrusión y luego rotación.
0
Muy bien, encontré una solución con rotación y traslación, lo que arruiné fue que giré la malla, no la geometría. Pero todavía tengo curiosidad sobre la forma correcta de hacer esto. Código de trabajo:
export function createStorageLocation(storageLocation: StorageLocation) { const shape = new Shape(); shape.moveTo(0, 0); shape.lineTo(0, 200 / 100); shape.lineTo(400 / 100, 200 / 100); shape.lineTo(400 / 100, 0); shape.lineTo(0, 0); const extrudeSettings: ExtrudeGeometryOptions = { steps: 2, depth: 10, bevelEnabled: false, bevelThickness: 1, bevelSize: 1, bevelOffset: 0, bevelSegments: 1, }; const geometry = new ExtrudeGeometry(shape, extrudeSettings); geometry.rotateX(MathUtils.degToRad(-90)); geometry.translate(0, 0, 200 / 100); const material = new MeshStandardMaterial({ color: 'blue', opacity: 0.7, transparent: false, }); const location = new Mesh(geometry, material); const axesHelper = new AxesHelper(5); location.add(axesHelper); location.position.set( storageLocation.startPoint.x / 100, storageLocation.startPoint.y / 100, storageLocation.startPoint.z / 100 ); location.updateMatrix(); return location; }resultado:
