Una visualización inmersiva y en 3D de los 118 elementos químicos de la tabla periódica. Este proyecto permite explorar los elementos a través de diferentes formaciones geométricas e incluye un buscador integrado y soporte para modo claro/oscuro.
- Visualizaciones Múltiples: Transiciones fluidas entre 4 vistas diferentes:
- 🔲 Tabla: La disposición periódica tradicional.
- 🌐 Esfera: Todos los elementos orbitando en un globo tridimensional.
- 🧬 Hélice: Formación en espiral continua.
- 🗄️ Rejilla: Disposición en cuadrícula profunda.
- Motor de Búsqueda: Filtrado en tiempo real de elementos por símbolo o nombre.
- Panel de Detalles: Información interactiva al hacer clic en cualquier elemento (Masa atómica, categoría, etc.).
- Temas Personalizables: Soporte para modo oscuro (por defecto) y modo claro, con persistencia en
localStorage. - Diseño Responsivo: Interfaz adaptada tanto para navegadores de escritorio como para dispositivos móviles.
- HTML5 & CSS3: Estructura semántica, variables CSS y diseño Glassmorphism.
- JavaScript (ES6+): Lógica del DOM, gestión de estados y filtrado.
- Three.js: Renderizado tridimensional utilizando
CSS3DRendererpara los elementos del DOM y WebGL para el fondo de partículas (estrellas). - Tween.js: Motor de interpolación para las transiciones suaves de cámara y elementos.
Este proyecto no requiere de un proceso de build complejo ni de Node.js. Para ejecutarlo en tu máquina:
- Clona este repositorio:
git clone https://github.com/MichaelARC-NI/Periodic-table.git