Estoy haciendo un motor 3D de proyección en perspectiva en javascript, enlace a continuación, y me encontré con este problema que quiero parchear. Cuando las caras se cruzan, una como un todo se representa encima de la otra.

Aquí hay una descripción general de cómo funciona mi sistema actualmente: cómo funciona actualmente es que obtiene todos los puntos requeridos (usando un montón de matrices de rotación y traslaciones) y una lista de todas las caras (referenciadas usando un índice a la lista de puntos (como [[2,5,4],[3,1,6,4],[2,1,3]) necesarios para la representación, luego obtiene una lista de las caras, cada una con los puntos específicos reemplazados por los puntos reales en lugar de un índice para los puntos en la lista (como [[[1,2,3],[2,1,5],[2,1,3]],[[2,1,4] ,[-2,-4,1],[0,2,6],[2,1,3]],[[1,2,3],[-2,-4,1],[2, 1,4]]]) de tal manera que se pueda cortar en una cierta Z de tal manera que no se puedan ver las cosas detrás de ellos. Luego se corta el Z usando vectores y encontrando sus intersecciones con el plano Z, cortando las partes del caras en la parte posterior del plano mientras conservan la forma exacta de las mismas en la parte frontal del plano. Luego, las caras se ordenan para renderizar, usando clasificación rápida y obteniendo la distancia promedio de la cámara para cada punto en la cara. Luego ellos se prestan a este orden.

Mi problema es que cuando dos caras se cruzan entre sí, una simplemente aparece encima de la otra, en lugar de tener la cara cortada de alguna manera para que en realidad pueda renderizarse correctamente, así:

¿Este problema ya tiene nombre? Si es así, ¿qué es?

Lo que me pregunto es si es factible cortar las caras en caras más pequeñas y luego ordenarlas correctamente, de modo que las caras se crucen entre sí correctamente.

Si es así, ¿de qué manera puedo manejar esto, ya sea cambiando el formato de los datos una vez más, haciendo un ciclo for para obtener sus intersecciones, y qué puedo buscar para comprender mejor mi problema aquí y obtener una buena comprensión de las ideas de cómo solucionarlo?

Si no es así, ¿qué otro tipo de representación sería apropiado para solucionar este problema? ¿Qué recursos puedo buscar para probar y hacer un tipo de motor?

Aquí está el enlace a mi motor, modificado de tal manera que hay muchos objetos que muestran el problema:

https://3d-10-2.kittycraft0.repl.co/

(WASDEQ para moverse, teclas de flecha para mirar alrededor, c/z para acercar/alejar)