Calculadora gráfica 3D online: superficies, curvas paramétricas y dispersión (WebGL)
Un graficador 3D interactivo impulsado por WebGL (three.js). Renderice superficies z=f(x,y) con resolución ajustable, curvas espaciales paramétricas o nubes de puntos de dispersión 3D, añadiendo puntos de forma individual o pegándolos en lote. Gire, amplíe y desplace con OrbitControls, restablezca la vista y copie los puntos de dispersión; todo se ejecuta localmente en su navegador.
Guía de la calculadora gráfica 3D
Superficies, curvas paramétricas y nubes de puntos en WebGL
La calculadora gráfica 3D renderiza tres tipos de objetos en un viewport WebGL interactivo: superficies z = f(x, y), curvas paramétricas en el espacio (x(t), y(t), z(t)) y nubes de puntos de dispersión. Cambie de modo, introduzca las expresiones o los puntos, y orbite la escena con el ratón o el tacto para inspeccionar la forma desde cualquier ángulo.
01 Elegir un modo
En modo Superficie, introduzca z como función de x e y (por ejemplo, sin(sqrt(x^2 + y^2))) y ajuste los rangos de x e y; la resolución controla la densidad de la malla. En modo Paramétrica, introduzca x(t), y(t) y z(t) como funciones de un parámetro t sobre [tmin, tmax]; las muestras controlan cuántos puntos definen la curva. En modo Dispersión, añada puntos individuales (x, y, z) introduciendo las coordenadas y haciendo clic en +; use Borrar para eliminar todos los puntos y × para eliminar uno.
Haga clic y arrastre para rotar la cámara, gire la rueda para hacer zoom y arrastre con el botón derecho (o con dos dedos) para panear. La vista se renderiza en su navegador mediante WebGL y está envuelta en ClientOnly para no afectar al renderizado del servidor.
- Superficie: z = f(x,y), muestreada sobre una cuadrícula rectangular
- Paramétrica: una curva trazada al variar t en [tmin, tmax]
- Dispersión: una nube discreta de puntos (x, y, z)
- Más resolución/muestras dan resultados más suaves a costa de rendimiento
Selector de modo
- SuperficieRepresenta z = f(x, y) sobre una cuadrícula.
- ParamétricaRepresenta una curva paramétrica x(t), y(t), z(t).
- DispersiónRepresenta puntos 3D individuales.
Controles de superficie
- z = f(x, y)Expresión de la altura en función de x e y.
- rango x / yEstablece el dominio rectangular muestreado para la superficie.
- resoluciónDensidad de la malla (24–64); más alto es más suave pero más lento.
Controles paramétricos
- x(t) / y(t) / z(t)Tres expresiones que definen la curva sobre el parámetro t.
- tmin / tmaxRango del parámetro t.
- muestrasNúmero de puntos a lo largo de la curva (100–2000).
Controles de dispersión
- campos x / y / zCoordenadas para un punto nuevo.
- +Añade a la nube el punto introducido.
- BorrarElimina todos los puntos (y también borra el cuadro de texto masivo).
- × (en un punto)Elimina ese único punto.
- bulk text boxPega o escribe muchos puntos a la vez, uno por línea como x, y, z separados por comas o espacios.
- ApplyAnaliza el cuadro de texto masivo y reemplaza la nube de puntos.
- CopyCopia todos los puntos como líneas x, y, z para pegar en otra parte.
Viewport
- arrastrarOrbita/rota la escena 3D.
- ruedaAcerca y aleja la cámara.
- arrastre der.Panea la cámara.
- reset viewBotón en el lienzo que restaura la cámara tras rotar, desplazar o hacer zoom.
- Baje la resolución mientras experimenta y súbala para el renderizado final.
- Las curvas paramétricas son ideales para hélices, órbitas y trayectorias.
- Si una superficie se ve dentada, aumente la resolución o estreche los rangos x/y.
- WebGL debe estar habilitado en su navegador para que aparezca la vista 3D.
Una calculadora gráfica 3D online gratuita. Representa superficies z = f(x,y), traza curvas paramétricas x(t)/y(t)/z(t) y dibuja nubes de puntos, todo de forma interactiva en WebGL con controles de órbita. Elige la resolución y los rangos de los parámetros, rota y haz zoom en el navegador. three.js viene incluido, así que no hay complementos ni subida de datos.
Gráficos de superficies
Introduce z como función de x e y, como sin(sqrt(x^2+y^2)) o x^2-y^2, y elige el dominio x/y y la resolución de malla. La superficie se representa en WebGL con iluminación; aumenta la resolución para una malla más suave a costa de rendimiento.
Curvas paramétricas y dispersión
Para curvas paramétricas, introduce x(t), y(t), z(t) y un rango para t y dibuja nudos, hélices y trayectorias. Para gráficos de dispersión, introduce listas de coordenadas x, y, z para visualizar nubes de puntos. Cambia el tipo de objeto desde el panel; cada uno es independiente.
Navegación y rendimiento
Arrastra para rotar, usa la rueda para zoom y arrastra con el botón derecho (o con dos dedos) para panear mediante los controles de órbita; el botón de restablecer vuelve a la vista por defecto. El motor three.js se carga solo al abrir esta herramienta, para que la página inicial siga siendo rápida. WebGL debe estar disponible en tu navegador.
Preguntas frecuentes
Q¿Qué puedo representar en 3D?
Superficies z=f(x,y), curvas paramétricas x(t)/y(t)/z(t) y nubes de puntos a partir de listas de coordenadas x/y/z.
Q¿Necesito instalar algo?
No. three.js viene incluido con el sitio y el 3D usa WebGL integrado en los navegadores modernos; no se requiere complemento ni app.
Q¿Puedo rotar y hacer zoom en la vista?
Sí: arrastra para rotar, la rueda para zoom, arrastra con el botón derecho o con dos dedos para panear, y usa restablecer para volver a la cámara por defecto.
Q¿Por qué la superficie se ve dentada a alta resolución?
Una resolución de malla más alta da superficies más suaves pero más triángulos que renderizar. Baja la resolución si tu dispositivo es lento; el rendimiento de WebGL depende de tu GPU.