Aplicación web profesional para resolver, visualizar y analizar problemas de cálculo multivariable con inteligencia artificial avanzada. Incluye procesamiento de imágenes, visualización 3D interactiva tipo GeoGebra, y solución paso a paso estilo Symbolab.
- Procesamiento de imágenes: Sube fotos de ejercicios manuscritos o impresos
- Solución paso a paso: Explicaciones detalladas con IA usando Groq/Llama
- Múltiples tipos de problemas: Derivadas parciales, integrales múltiples, gradientes, optimización con Lagrange
- Ejes numerados: Marcas y etiquetas en X, Y, Z
- Superficies interactivas: Funciones de dos variables f(x,y)
- Vectores gradiente: Visualización de ∇f en puntos específicos
- Campos vectoriales: Representación 3D de campos
- Planos de referencia: Grid transparente en XY, XZ, YZ
- Rotación y zoom: Control completo con mouse/touch
- Coloreado por altura: Gradiente de color según valor Z
- Derivadas Parciales: ∂f/∂x, ∂f/∂y con simplificación simbólica
- Integrales Múltiples: Dobles y triples con límites personalizables
- Gradientes: Cálculo y visualización de ∇f
- Optimización: Multiplicadores de Lagrange
- Dominio y Rango: Análisis automático con restricciones
- Límites: Evaluación de límites multivariables
- Interfaz inspirada en Symbolab
- Tema claro/oscuro automático
- Responsive (móvil, tablet, desktop)
- Animaciones fluidas
- Notificaciones inteligentes
- Framework: Next.js 16 (App Router) + React 19
- Lenguaje: TypeScript
- Visualización 3D: React Three Fiber (@react-three/fiber, @react-three/drei)
- Matemáticas: mathjs (cálculos simbólicos)
- IA: Groq SDK (modelo Llama 4 Scout para imágenes, Llama 3.3 70B para soluciones)
- Estilos: Tailwind CSS v4 + shadcn/ui
- Despliegue: Vercel
Esta aplicación cumple con todos los requisitos del proyecto de cálculo multivariable:
- ✓ Aplicación web funcional desarrollada en JavaScript/TypeScript
- ✓ Interfaz moderna y profesional
- ✓ Accesible desde cualquier dispositivo con navegador
- ✓ Superficies 3D interactivas con f(x,y)
- ✓ Ejes numerados profesionales
- ✓ Múltiples ejemplos predefinidos
- ✓ Entrada de funciones personalizadas
- ✓ Analizador automático de dominio
- ✓ Cálculo de rango con descripción
- ✓ Detección de restricciones (raíces, logaritmos, denominadores)
- ✓ Evaluación de límites multivariables
- ✓ Cálculo de ∂f/∂x y ∂f/∂y
- ✓ Visualización de vectores gradiente ∇f
- ✓ Evaluación en puntos específicos
- ✓ Simplificación simbólica automática
- ✓ Multiplicadores de Lagrange
- ✓ Sistema de ecuaciones ∇f = λ∇g
- ✓ Solución paso a paso con IA
- ✓ Ejemplos guiados
- ✓ Integrales múltiples ∫∫f(x,y)dA
- ✓ Límites de integración personalizables
- ✓ Cálculo de volúmenes y áreas
- ✓ Visualización de regiones de integración
- ✓ Ingreso de funciones: Input con validación y ejemplos
- ✓ Visualización gráfica: Renderizado 3D profesional con Three.js
- ✓ Cálculo automático: Derivadas, integrales, dominio, rango
- ✓ Interfaz amigable: Diseño inspirado en Symbolab, navegación intuitiva
```bash git clone https://github.com/tu-usuario/ia-math-app.git cd ia-math-app ```
```bash npm install ```
Crea un archivo .env.local en la raíz:
```env
GROQ_API_KEY=tu_clave_de_groq_aqui ```
- Visita console.groq.com
- Crea una cuenta gratuita
- Ve a "API Keys"
- Genera una nueva key
- Copia y pega en
.env.local
```bash npm run dev ```
Abre http://localhost:3000 en tu navegador.
-
Sube tu código a GitHub
-
Conecta con Vercel
- Ve a vercel.com
- Click en "New Project"
- Importa tu repositorio de GitHub
-
Configura Variables de Entorno
- En Vercel: Settings → Environment Variables
- Agrega
GROQ_API_KEY
-
Deploy
- Click en "Deploy"
- Espera 1-2 minutos
- ¡Tu app estará lista!
- Selecciona el tipo de problema (derivadas, integrales, gradiente, etc.)
- Ingresa tu función matemática
- Click en "Resolver con IA"
- Obtén la solución paso a paso
Ejemplo: ``` Tipo: Derivadas Parciales Input: f(x,y) = x^2 * y + x * y^2 ```
- Arrastra una foto del ejercicio o haz click para seleccionar
- La IA extraerá el texto y ecuación
- Resolverá el problema automáticamente
- Muestra pasos detallados
Formatos soportados: JPG, PNG, JPEG (máx 2MB)
- Ingresa una función:
x^2 + y^2,sin(x) * cos(y), etc. - Ajusta el rango y resolución
- Activa/desactiva:
- Ejes numerados
- Grid
- Vectores gradiente ∇f
- Rotación automática
- Interactúa con mouse:
- Arrastrar para rotar
- Scroll para zoom
- Click derecho para mover
Derivadas Parciales:
- Ingresa f(x,y)
- Calcula ∂f/∂x y ∂f/∂y
- Muestra el gradiente ∇f
Integrales Múltiples:
- Define f(x,y) y límites
- Calcula ∫∫f(x,y)dA
- Visualiza región
Optimización:
- Función objetivo f(x,y)
- Restricción g(x,y) = 0
- Resuelve con Lagrange
- Ingresa función (ej:
sqrt(9 - x^2 - y^2)) - Analiza automáticamente
- Muestra:
- Dominio con notación matemática
- Rango
- Restricciones
- Tipo de superficie
``` f(x,y) = x^2 + 3xy + y^2 Encontrar ∂f/∂x y ∂f/∂y ```
``` ∫∫(x^2 + y^2)dA sobre R = [0,1] x [0,1] ```
``` f(x,y) = x^2y + xy^2 en el punto (1,2) Calcular ∇f(1,2) ```
``` Maximizar f(x,y) = xy Sujeto a: x + y = 10 ```
``` f(x,y) = √(9 - x^2 - y^2) Determinar dominio y rango ```
``` ia-math-app/ ├── app/ │ ├── api/ │ │ ├── process-image/ │ │ │ └── route.ts # Procesa imágenes con IA │ │ └── solve-math/ │ │ └── route.ts # Resuelve problemas matemáticos │ ├── layout.tsx # Layout con fuentes y metadatos │ ├── page.tsx # Página principal con navegación │ ├── loading.tsx # Estado de carga │ └── globals.css # Estilos globales + Tailwind config ├── components/ │ ├── ui/ # Componentes shadcn/ui │ ├── math-solver.tsx # Solucionador con IA │ ├── image-upload.tsx # Upload de imágenes │ ├── visualization-3d.tsx # Visualización 3D con Three.js │ ├── calculus-tools.tsx # Herramientas de cálculo │ ├── advanced-calculator.tsx # Calculadora avanzada │ ├── domain-range-calculator.tsx # Análisis dominio/rango │ └── math-library.tsx # Biblioteca de fórmulas ├── lib/ │ └── math-utils.ts # Utilidades matemáticas ├── hooks/ │ └── use-toast.ts # Hook para notificaciones └── package.json ```
Procesa imagen y extrae/resuelve ejercicio.
Request: ```typescript FormData { image: File // JPG, PNG, JPEG (< 2MB) } ```
Response: ```json { "solution": { "extractedText": "...", "problem": "...", "steps": [ { "step": 1, "description": "...", "equation": "...", "explanation": "..." } ], "finalAnswer": "..." } } ```
Resuelve problema matemático con IA.
Request: ```json { "problem": "f(x,y) = x^2 + y^2, encontrar ∂f/∂x", "type": "partial-derivatives" } ```
Response: ```json { "solution": { "problem": "...", "domain": "...", "range": "...", "steps": [...], "finalAnswer": "..." } } ```
Solución:
- Verifica que
GROQ_API_KEYesté en.env.local - En Vercel: Settings → Environment Variables
- Asegúrate de que la variable no tenga espacios ni comillas
Solución:
- Verifica que el archivo sea < 2MB
- Usa formatos JPG, PNG o JPEG
- Asegúrate de que la imagen tenga texto claro
- Comprime la imagen si es necesario
Solución:
- Usa sintaxis correcta:
x^2 + y^2(nox**2) - Operadores:
*multiplicación,^potencia,/división - Evita divisiones por cero
- Refresca la página si persiste
Solución:
- Verifica la sintaxis de la función
- Usa paréntesis para claridad:
(x+y)^2 - Para funciones complejas, usa el Solucionador con IA
Las contribuciones son bienvenidas. Para cambios importantes:
- Fork el repositorio
- Crea una rama:
git checkout -b feature/nueva-funcionalidad - Haz commit:
git commit -am 'Agrega nueva funcionalidad' - Push:
git push origin feature/nueva-funcionalidad - Abre un Pull Request
MIT License - consulta el archivo LICENSE para más detalles.
- Groq: Por la API de IA rápida y potente
- Vercel: Por el hosting y Next.js
- shadcn/ui: Por los componentes UI elegantes
- Three.js: Por el renderizado 3D
- mathjs: Por el motor de cálculo simbólico
¿Problemas o preguntas?
- 📖 Documentación de Groq
- 📖 Documentación de Next.js
- 📖 Documentación de React Three Fiber
- 🐛 Abre un issue en GitHub
Desarrollado con ❤️ para el curso de Cálculo Multivariable ```
"# CalcuMasterAI"