Stereobox

En terreno, los geólogos miden planos con una brújula, los anotan en una de tres notaciones y los proyectan en una red estereográfica. Los estudiantes suelen aprender las tres por separado. Stereobox las pone lado a lado y las mantiene sincronizadas: mueves la aguja de la brújula, arrastras el polo en la red o rotas el plano en 3D, y todas las demás vistas lo siguen con transiciones animadas. Lo diseñé y construí a mano, sin asistencia de IA para programar.

Cuatro vistas de un mismo plano

• Lecturas en tres notaciones. Las notaciones azimutal, por cuadrantes y por dirección de manteo se convierten en ambos sentidos mientras escribes, con validación que detiene cualquier dato inválido antes de dibujarlo.
• Una brújula y un clinómetro que funcionan. Dibujados en SVG, con agujas, marcas y todo. Se hace clic en cualquier punto del dial, o se arrastra una aguja, para fijar la lectura.
• Una red estereográfica interactiva. Cada punto clave del plano es un control: arrastrar el polo cambia rumbo y manteo a la vez, el punto de manteo cambia solo el manteo, y los extremos del rumbo solo la dirección.
• Una vista 3D. El plano corta el hemisferio inferior en Three.js. Se rota libremente, y se puede cambiar su color, opacidad y recorte.

Los mismos colores marcan rumbo, dirección de manteo y manteo en las cuatro.

Cómo funciona

• Geometría esférica desde cero. Las conversiones entre coordenadas esféricas y cartesianas, las rotaciones y los círculos máximos son un pequeño módulo propio, no una librería SIG.
• D3 como sistema de coordenadas. La red usa la proyección azimutal equivalente de D3 solo como matemática: las posiciones al arrastrar se proyectan de vuelta a orientaciones. Cada elemento visible es un componente SVG de React.
• React y Three.js, desacoplados. React maneja el estado de la página; Three.js maneja el canvas 3D y su ciclo de dibujo. Un pequeño bus de eventos los conecta sin estado mutable compartido.
• Animación propia. Las transiciones entre lecturas se generan cuadro a cuadro, sin librerías de animación.
• En español e inglés, incluidos los textos de ayuda de cada vista.

Recepción

Lo compartí en r/geology y en un servidor de Discord de geociencias, donde quedó fijado en varios canales y fue la publicación fijada con más reacciones. Al menos un usuario comentó que lo usaría en sus clases.