Three.js: Compatibilidad con geometría sólida constructiva (CSG)

Puedo intentarlo este fin de semana ... déjame ver cómo te va.

Um, agregué un OrbitControls e inspeccionando el resultado no parece muy correcto. ¿Estás seguro de que esta biblioteca está suficientemente probada?
Por favor, haga algunas pruebas antes de intentar 'almacenarlo en búfer' 😉

Agregarlo a la base del código central puede ser un poco complicado, la versión actual ( v1 branch ) está en TypeScript. Funciona bien con r100 (e incluso r103 ) mil: ejemplos

No creo que agruparlo en la carpeta src/ sea ​​la dirección correcta, pero actualizarlo para admitir BufferGeometry suena prometedor. Si la biblioteca está bien probada, no tengo idea. :)

Agregarlo a la base del código central puede ser un poco complicado, la versión actual ( v1 branch ) está en TypeScript. Funciona bien con r100 (e incluso r103 ) mil: ejemplos

Por lo que se desarrolla activamente. No vi esa etiqueta. Y ... ¡parece que la etiqueta v1 es compatible con BufferGeometry! @TresPez

Voto para no incluir funciones de CSG en este repositorio. Mejor ThreeCSG es compatible si es necesario.

Por lo que se desarrolla activamente. No vi esa etiqueta. Y ... ¡parece que la etiqueta v1 es compatible con BufferGeometry! @TresPez

No lo creo, esta es la única mención de BufferGeometry en la versión v1:

function convertGeometryToTriangles(geometry) {
        if (isBufferGeometry(geometry)) {
            throw new Error('threecsg: Only Three.Geometry is supported.');
        }

¿Alguien ha intentado ponerse en contacto con el propietario de ThreeCSG para ver cuáles son sus planes o si están dispuestos a aceptar relaciones públicas para apoyar a BufferGeometry? También estoy un poco interesado en esto.

Parece que nadie preguntó allí sobre BufferGeometry ...

¿Por qué no cambiar la conversación a https://github.com/chandlerprall/ThreeCSG? Apuesto a que @chandlerprall estaría feliz de ver tal interés en su proyecto 😊

FWIW hay una nueva rama v1 en ThreeCSG que es una reescritura y limpieza completas. Necesita optimizar el algoritmo de selector de plano y luego está listo para publicar npm. Me encantaría si alguien quisiera contribuir con funciones adicionales (consulte también https://github.com/chandlerprall/ThreeCSG/issues/51)

Para tu información:

Además de https://github.com/chandlerprall/ThreeCSG , las siguientes bibliotecas de CSG se mencionaron en el reciente hilo del foro Discourse:

• https://evanw.github.io/csg.js/
• https://github.com/jscad/OpenJSCAD.org

No tengo opinión sobre si alguno de estos tres debería servir como base para el soporte de CSG de three.js.

Hice otra conversión de la biblioteca madebyevan CSG que puede resultarle útil ... funciona con los tres actuales (103) y solucionó algunos problemas que tenía con el módulo anterior. Permite geometrías de búfer pero solo convirtiéndolas en geometrías internamente.

https://github.com/manthrax/THREE-CSGMesh

Espero que esto ayude a alguien y siéntete libre de dar comentarios / sugerencias.

@manthrax Tu proyecto sería una buena adición al siguiente hilo en el foro three.js para que las personas que buscan un complemento lo encuentren👍

https://discourse.threejs.org/t/looking-for-updated-plug-in-for-csg/6785

¡Impresionante! No estoy seguro de cuán factible sea, pero creo que cualquiera de estas soluciones se beneficiaría de algunos ejemplos que demuestren el rendimiento y las capacidades de edición en tiempo real que tienen muchos editores de motores ahora.

Mi preferencia personal es mantener CSG fuera de la biblioteca y desarrollarlo de forma independiente.

Estoy de acuerdo con esto, pero podría ser útil tener un conjunto oficial de "repositorios relacionados". Creé una organización que podemos usar para esto si decidimos seguir adelante. github.com/threejs es tomado por @enricomarino , pero github.com/three-js estaba allí. Transferiré la propiedad a quien sea, ¡simplemente pensé que era bueno saltar sobre el nombre!

Entonces, esta organización está disponible para cualquiera que quiera crear proyectos relacionados con three.js que no encajan aquí.

https://github.com/three-js

Creé la organización https://github.com/threejs para alojar proyectos relacionados con three.js.

En realidad, en ese momento, pensé en dividir el repositorio mono "three.js" en varios repositorios,
como "threejs / core", "treejs / examples", "threejs / editor", "threejs / docs",
dado que "mrdoob / three.js" se ha vuelto muy grande y pesado para descargar ...
Pero esta es otra historia...

Si desea utilizarlo, ¡la organización está a su disposición!

Agregué una demostración y una captura de pantalla a la biblioteca:

https://github.com/manthrax/THREE-CSGMesh

¡Avísame si alguien necesita ayuda!

@yomboprime @ThreeDfish
Agregué una captura de pantalla y una demostración a la biblioteca CSG que porté. Avíseme si lo encuentra útil.
https://github.com/manthrax/THREE-CSGMesh

@yomboprime @ThreeDfish
Agregué una captura de pantalla y una demostración a la biblioteca CSG que porté. Avíseme si lo encuentra útil.
https://github.com/manthrax/THREE-CSGMesh

@ThreeDfish Si todavía está interesado, puedo crear una función CSG.toBufferGeometry en esta biblioteca. El CSG aún aceptaría Geometry como entrada, pero la salida podría ser Geometry (para más operaciones booleanas) o BufferGeometry (salida final para renderizado).
¿Qué opinas @manthrax ?

@enricomarino, ¿puedes darme acceso a github.com/threejs? Me gustaría configurar un repositorio con modelos de prueba para LWOLoader . Por cierto, eres una persona difícil de encontrar los datos de contacto de 😛

@yomboprime No estoy seguro de lo que estás preguntando ...

La versión que porté acepta mallas BufferGeometry o Geometry ... genera Geometry, que se puede convertir a BufferGeometry con

mesh.geometry = new THREE.BufferGeometry().fromGeometry(mesh.geometry)

Por lo tanto, no sé si realmente se necesita una función auxiliar adicional, ya que la conversión es bastante sencilla.

Desafortunadamente, la conversión Geometry -> BufferGeometry tiene bastante pérdida: desindexará la geometría indexada y aumentará el recuento de vértices, además de agregar colores de vértice (blancos). El resultado final como BufferGeometry probablemente sería ideal.

La operación de CSG no se preocupa por la indexación. Opera y genera 3 verts únicos por triángulo sin importar qué.

Tampoco maneja colores de vértice.

Optimizar la malla resultante es algo que puede / debe hacerse con otras herramientas / funciones auxiliares, en mi humilde opinión.

De lo contrario, solo se trata de duplicar una funcionalidad tonta que en realidad debería estar en una biblioteca separada.

Estoy de acuerdo en que definitivamente hay un espacio en términos de utilidad para optimizar la geometría en THREE.js. El problema se aplica a algo más que BufferGeometry. Pero aplicar optimizaciones a búferes grandes, a través de js, en tiempo de ejecución, son operaciones complicadas ... y cualquier técnica que aplique para reducir la complejidad, es decir, octtree / kdtree lo que sea ... se complica bastante rápido y requiere su propio conjunto de paramaterizaciones, etc.

Siento que hay una compensación entre el código "complejidad / flexibilidad / utilidad" vs "ultra optimizado para la gpu" que en una configuración sin javascript, optimizaría para el último, pero en un escenario js / web, apuntaría a el primero, y solo si decide que necesita seguir con el segundo, usaría algo como wabasm para procesar los datos.

Sin mencionar que estas operaciones de CSG ya son bastante lentas ... La demostración en mi git es apenas interactiva con solo 10 operaciones por cuadro en una caja y una esfera de 8 subdivisiones ...

Dicho esto ... acabo de ver la demostración de babilonia csg ... y estoy bastante seguro de que es una adaptación de la misma biblioteca,
Y tampoco se está haciendo en tiempo real en esa demostración.
https://www.babylonjs.com/demos/csg/

Aquí está la versión que convertí haciendo un ejemplo más simple en tiempo real:

http://vectorslave.com/csg/CSGDemo.html

Estoy de acuerdo en que las operaciones de CSG no son especialmente amigables en tiempo real, y que la biblioteca no necesita fingir que lo son. Sin embargo, tenga en cuenta que Geometry eventualmente se eliminará de la biblioteca three.js y se moverá a examples/js/* y examples/jsm/* . En ese punto, es casi seguro que a los usuarios les resultará más fácil usar BufferGeometry como resultado. Si el código CSG tiene una dependencia interna de Geometry, eso parece estar bien, por supuesto.

Yo lo diría así ...

Si desea encadenar operaciones, ingresar Geometry y generar Geometry tiene sentido, ya que CSG opera solo en esa estructura de datos.

Pero tenga en cuenta que Geometry pronto ya no se podrá renderizar, por lo que la salida tendrá que convertirse a BufferGeometry en el paso final.

@manthrax La implementación de QuickHull usa un conjunto propio de clases para que las operaciones topológicas sean más fáciles de realizar. Por ejemplo, una implementación de medio borde es mucho mejor que trabajar con Geometry en este contexto. Dado que Geometry se centra en la renderización, otros tipos de clases podrían funcionar mejor incluso para CSG.

Apreciamos los comentarios @WestLangley @ Mugen87 .
Buscaré hacer que funcione de forma nativa con BufferGeometry en preparación para la desaprobación de Geometry.
También quiero agregar color y material / apoyo grupal.

@enricomarino En realidad, estaba planeando enviarle un mensaje para ver qué planeaba hacer con la organización, ya que estaba considerando sacarlo de mi nombre de usuario y dividir un poco las cosas. Aún no estoy seguro de cómo debería verse, pero ¿le gustaría agregarme a la organización por ahora?

@mrdoob seguro!

Hola a todos ... Hice una demostración más brillante de la biblioteca CSG y solucioné un error en la generación normal, si alguien está interesado:

http://vectorslave.com/csg/CSGShinyDemo.html

y el gh:
https://github.com/manthrax/THREE-CSGMesh

Estoy buscando agregar una versión de optimización de BufferGeometry y algo que preserve la separación de material entre las entradas, por lo que podría usarse directamente para algo como un software SCAD.

Solo pensé en dejar estos enlaces aquí para inspirarme y en caso de que alguien quiera sumergirse realmente en ellos. Encontré esta herramienta CSG en Unity que tiene un rendimiento y capacidades de creación de contenido realmente impresionantes:

https://assetstore.unity.com/packages/tools/modeling/realtime-csg-69542

Y parece que el creador ha escrito algunos artículos sobre la implementación (hay seis partes en total):

http://sandervanrossen.blogspot.com/2010/05/realtime-csg-optimizations.html
http://sandervanrossen.blogspot.com/2010/05/realtime-csg-part-5.html

Porté una biblioteca csg y funciona muy bien en este momento.
Puedo actualizar este proyecto si es necesario.

https://github.com/FishOrBear/csg.ts

¿Algún avance en esto?

¡la biblioteca de @manthrax funciona perfectamente!

@manthrax

Estoy buscando agregar una versión de optimización de BufferGeometry

¿Está usando THREE.Geometry en este momento?

así que no pude dejarlo descansar y miré en https://github.com/jscad/csg.js, que es la biblioteca principal de CSG de https://openjscad.org/
Lo busqué y escribí mi propio adaptador THREE BufferGeometry y en realidad es MUCHO más rápido que la biblioteca en la que @manthrax basó su código. (y es compatible con la coloración de vértices)

por el mismo dado que usa esferas con 32 caras para cortar los ojos,
THREE-CSGMesh tomó 112 segundos,
jscad / csg tomó 2.5 segundos !!!

eso es 45 veces más rápido ...

Estoy pensando en crear una biblioteca a partir de eso, déjame saber lo que piensas al respecto ...

@SebiTimeWaster

¿Está disponible en un repositorio en cualquier lugar? Parece que csg.js también es una licencia del MIT.

@mrdoob

Estoy buscando agregar una versión de optimización de BufferGeometry

¿Está utilizando THREE.Geometry en este momento?

Observando brevemente la base de código, parece que sí, todavía usa THREE.Geometry, pero solo en la entrada y salida para convertirlo hacia y desde una estructura interna para operaciones CSG.

todavía no, si hay interés crearía uno ...

todavía no, si hay interés crearía uno ...

¡Je, creo que este hilo es una prueba de interés! Pero al menos me interesa comprobarlo si tienes una versión más rápida. Ya no tengo una necesidad inmediata, pero es posible que lo necesite en el futuro. Sería bueno tener acceso a la biblioteca para CSG en tres, incluso si es solo un ejemplo rápido de cómo comenzar con csg.js en three.js.

todavía no, si hay interés crearía uno ...

Sí, ¡un ejemplo / solución oficial para csg sería genial!

Estoy en ello...

Casi he terminado con un puerto BufferGeometry de
Necesita un poco de limpieza, para lo cual encontraré tiempo esta semana, luego lo compartiré aquí.

@mrdoob ¿quieres una biblioteca CSG en este repositorio? Si es así, haré un PR. De lo contrario, haré un nuevo repositorio para él.

@SebiTimeWaster No vi tu comentario antes, oops. Cuanto más mejor, supongo 😁

@looeee ¿ es un puerto completo o simplemente un contenedor? Parecía que csg.js tenía que convertir datos en muchas estructuras internas para las operaciones de CSG de todos modos, ¿verdad? Parecía que debería poder convertir desde y hacia BufferGeometry al entrar y salir.

@looeee, ¿te refieres a un nuevo repositorio aquí ?
Sería interesante, pero supongo que mrdoob aún no está listo.

No estoy seguro de que este repositorio sea el lugar correcto para mantener una biblioteca CSG completa ... ¿quizás agregar un ejemplo, usando una compilación minificada de la biblioteca CSG en examples/js(m)/libs/ ?

Entonces, aquí está mi opinión sobre todo (se basa en https://github.com/jscad/csg.js):
https://github.com/SebiTimeWaster/three-csg
con un ejemplo (prueba de esfuerzo):
https://sebitimewaster.github.io/three-csg/examples/example2.html

@looeee, ¿qué tal si implementas la misma prueba de esfuerzo, luego podemos comparar y optimizar nuestro código entre nosotros ...

@looeee ¿ es un puerto completo o simplemente un contenedor?

Tengo una rama que es prácticamente un contenedor para csg.js con algunos cambios menores:

• modularizó el código
• alineó los nombres de las funciones a three.js y usó Vector3 lugar de una clase de vector personalizada,
• mejoras menores de la API

Esa rama está completa y la compartiré una vez que la ordene un poco. Sin embargo, es lento.

Tengo otra rama en la que estoy trabajando en mejoras de velocidad. Hay mucho que se puede hacer aquí, principalmente en el cálculo de salidas tempranas para evitar tanto procesamiento como sea posible.

@SebiTimeWaster , he echado un vistazo rápido a su código y creo que está haciendo algo como esto usando esferas delimitadoras para cada polígono. Intentaré recrear tu ejemplo usando mi biblioteca cuando encuentre el tiempo.

@SebiTimeWaster ¿ Puede su implementación csg manejar coordenadas de textura?

Así es como se ven las coordenadas de textura en la mía.

Aquí está el repositorio:
https://github.com/looeee/threejs-csg

Hay dos ramas, _master_, que está bastante cerca de un contenedor de csg.js como describí anteriormente, y _advanced_. Allí he expresado todas las operaciones de CSG usando los métodos LogicalOR y complement :

Unión : _ (Izquierda || Derecha) _
Restar : _! (! Izquierda || Derecha) _
Intersección : _! (! Izquierda ||! Derecha) _

Hacer eso hace que las operaciones sean un poco más fáciles de razonar y también hace que la resta y la intersección sean un poco más rápidas. También hay algunos experimentos con hacer una combinación y eliminación basada en cuadros delimitadores de alto nivel antes de realizar las operaciones CSG completas, lo que proporciona algunas aceleraciones decentes al realizar muchas operaciones a la vez.

Sin embargo, un mejor enfoque, y lo que parece ser el más utilizado en otras implementaciones, es crear un BVH de geometrías y operaciones y atravesar el árbol para generar la geometría final.

@SebiTimeWaster, por ahora, he decidido buscar implementaciones alternativas de CSG en lugar de ir más allá con esta. Si hay algo útil de mi repositorio, no dude en tomarlo.

EDITAR: Este tweet resume exactamente mis sentimientos.

Parece que la fuente del complemento Realtime CSG para Unity que vinculé anteriormente se publicó en Github y tiene licencia del MIT si alguien está interesado en profundizar en eso:

https://github.com/LogicalError/realtime-CSG-for-unity

También tiene algunas publicaciones técnicas sobre su complemento CSG en su blog, si retrocede un poco:

https://sandervanrossen.blogspot.com/search?q=Realtime+CSG

También hubo una nueva charla de GDC de él en marzo de este año sobre CSG:

https://www.youtube.com/watch?v=Iqmg4gblreo

Yo mismo no he jugado con su trabajo en Unity, pero el rendimiento en los videos se ve muy bien.

También existe este que se basa en Unity CSG pero es una aplicación de C # independiente, podría ser más fácil de entender. Sin embargo, es un poco más antiguo, por lo que es posible que no esté tan desarrollado.

https://github.com/LogicalError/Realtime-CSG-demo

El motor Godot también tiene CSG que probé y tiene un rendimiento muy decente. docs / code .

También hay Carve CSG y xcsg (que usa Carve) y Cork .

Me pregunto si la mejor solución aquí sería tomar una de estas soluciones existentes (probablemente Carve ya que es CPP y parece que se usa en muchos otros paquetes) y convertirla a Wasm.

Me pregunto si la mejor solución aquí sería tomar una de estas soluciones existentes (probablemente Carve ya que es CPP y parece que se usa en muchos otros paquetes) y convertirla a Wasm.

Estoy menos familiarizado con emscripten, pero no parece un mal enfoque. Sin embargo, parece que Carve y Cork tienen licencia GPL y LGPL, así que eso es algo a tener en cuenta.

Aparentemente, Blender acaba de actualizar su herramienta de operaciones booleanas y, según este tweet, utiliza enfoques de este documento:

http://www.cs.columbia.edu/cg/mesh-arrangements/