Gráficos y Renderizado
Esta página presenta visualizaciones científicas en la terminal de examples/graphics/ y cinco imágenes rasterizadas de examples/render/.
Las imágenes proceden de la ejecución nativa de los programas de ejemplo Sounio, seguida de la conversión de su salida PPM a SVG. El registro de procedencia identifica los commits de origen, el paquete del compilador y los resultados de la comparación de píxeles. La comparación verifica la reproducción de la salida de los ejemplos; la precisión matemática y la validación de pruebas históricas quedan fuera de su alcance.
Salida Raster Real
Este ejemplo es un rasterizador barycentríco real. La imagen de la página pública se genera a partir de la salida del compilador, no de un dibujo a mano.
Source: examples/render/triangle_basic.sio
bin/souc run examples/render/triangle_basic.sio > triangle_basic.ppm
Este ejemplo proyecta un cubo rotado, sombra los bordes por la profundidad y emite un marco portable PPM directamente desde el código Sounio.
Source: examples/render/cube_wireframe.sio
bin/souc run examples/render/cube_wireframe.sio > cube_wireframe.ppm
Este preview convierte la incertidumbre orientada por tipo en un verdadero campo epistémico: el valor se extiende por x, epsilon se extiende por y, y el brillo disminuye a medida que aumenta la incertidumbre.
Source: examples/render/uncertainty_field.sio
bin/souc run examples/render/uncertainty_field.sio > uncertainty_field.ppm
Este renderiza codifica directamente en píxeles un diagrama estilo front-door, incluyendo el estilo de coloración de intervención do(X) y un latente explícito mediador.
Source: examples/render/causal_dag.sio
bin/souc run examples/render/causal_dag.sio > causal_dag.ppm
Esta escena rota una tetrahedron con matemáticas de quaterniones, proyecta ambas poses en el espacio de pantalla y superpone líneas de correspondencia entre los vértices originales y rotados.
Source: examples/render/quaternion_rotation.sio
bin/souc run examples/render/quaternion_rotation.sio > quaternion_rotation.ppmPor Qué Esta Pila Gráfica?
- Salida del compilador real: La sección de raster superior se genera a partir de la salida verificada de
souc run, no de capturas de pantalla - Formatos de salida portátiles: Las demostraciones de terminal utilizan Unicode/ANSI; las demostraciones de raster emiten solo PPM
- Sin dependencia de ventanas: No se requiere X11, OpenGL o un motor de interfaz gráfica para los ejemplos actuales
- Amigable con SSH: La renderización por terminal y por archivos funcionan en sistemas remotos también
Galería de Terminales
Tabla de Multiplicación de Octoniones
La joya de la corona: una visualización completamente colorizada de la álgebra 8D donde la estructura del plan Fano se ve de inmediato a través de patrones de colores.
╔══════════════════════════════════════════════════════════════════════════╗ ║ TABLA DE MULTIPLICACIÓN DE OCTONIÓNES - Edición en Colores ║ ╚══════════════════════════════════════════════════════════════════════════╝ × │ 1 i j k l il jl kl ────┼──────────────────────────────────────────────── 1 │ 1 i j k l il jl kl i │ i -1 k -j il -l -kl jl j │ j -k -1 i jl kl -l -il k │ k j -i -1 kl -jl il -l l │ l -il -jl -kl -1 i j k il │ il l -kl jl -i -1 -k j jl │ jl kl l -il -j k -1 -i kl │ kl -jl il l -k -j i -1 Légenda: 1=real ijk=cuaternión liljlkl=octonio dim=negativo
Mapa de Activación Cerebral por RMf
Visualización de un trozo de cerebro de 32×32 con intensidad de grádiente utilizando caracteres Unicode de bloques.
╔═══════════════════════════════════════════════════╗ ║ ACTIVACIÓN CEREBRAL POR FMRI - Corta z=32 ║ ╚═══════════════════════════════════════════════════╝ Anterior ░░░░░░░░░░░░░░░░░░░ ░░░░░░▒▒▒▒▒▒▒▒░░░░░░░░ ░░░░▒▒████████▒▒░░░░ ░░░▒▒██████████████▒▒░░░ ░░░▒▒███████████████████▒▒░░░ L ░░▒▒███████░░░░███████▒▒░░ R ░░▒▒███████░░░░░░███████▒▒░░ ░░▒▒████████░░████████▒▒░░ ░░░▒▒███████████████▒▒░░░ ░░░░▒▒▒███████▒▒▒░░░░ ░░░░░░▒▒▒▒▒▒▒▒░░░░░░░░ ░░░░░░░░░░░░░░░░░░░ Posterior (continuado desde la sección anterior) Intensidad: ░=0.0 ▒=0.3 █=0.6 █=1.0 Regiones: Visual Motores Frontal
Cubo de cuadro en 3D
Rotación de un cubo con proyección isométrica y indicadores de ejes.
╔═══════════════════════════════════════════════════╗ ║ CUBO DE LÍNEAS 3D - Cuadro 42 ║ ╚═══════════════════════════════════════════════════╝ Y │ ┌───────────┐ ╱│ ╱│ ╱ │ ╱ │ ╱ │ ╱ │ ┌───────────┐ │ │ │ │ │ │ └───────│───┘ │ ╱ │ ╱ │ ╱ │ ╱ │╱ │╱ └───────────┘──────X ╱ Z Proyección: Isómetrica (30°) Ejes: X=rojo Y=verde Z=azul
Animación del Sistema de Partículas
Fuente de partículas basada en la física con fuerzas de gravedad y arrastre.
╔═══════════════════════════════════════════════════╗ ║ FUENTE DE PARTÍculas - Cuadro 120 ║ ╚═══════════════════════════════════════════════════╝ (continuado desde la sección anterior) ★ ★ ★ · · · ★ ★ · · · ○ · · ○ · · ○ ○ ○ ○ · │ · · │ · · │ · ════════════════════█════════════════════ Partículas: 847 activas Física: gravedad=0.1, resistencia=0.99, viento=0.02 Vida Útil: ★=nuevo ·=medio ·=viejo
Dinámica de Fluidos (Navier-Stokes)
Simulación de humo basada en el algoritmo “Fluidos Estables” de Jos Stam.
╔═══════════════════════════════════════════════════╗ ║ DINÁMICA DE FLUIDOS - Humo Alzando ║ ╚═══════════════════════════════════════════════════╝ ░░░░░░ ░░░░▒▒░░░░ ░░▒▒▓▓▒▒░░░░ ░░░▒▒██▓▓▒▒░░░░ ░░░░▒▒▓▓██▓▓▒▒░░░░░ ░░▒▒▓▓████▓▓▒▒░░ ░░▒▒████▒▒░░ ▒▒████▒▒ ▓▓██▓▓ ████ ████ ▓▓▓▓ ░██░ ▀▀ ═══════════════════════════════════════════ Algoritmo: Fluidos Estables (Stam 1999) Grid: 64×64, viscosidad=0.0001
Diagrama de Bifurcación
Mapa logístico mostrando el cascada de duplicación de períodos hacia el caos.
╔═══════════════════════════════════════════════════╗ ║ BIFURCACIÓN DE MAPA LOGÍSTICO - Doble de Período ║ ╚═══════════════════════════════════════════════════╝ x↑ 1│ ░░░░░░░░░░░░ │ ░░▒▒▒▒▒▒▒▒░░ │ ░░▒▒████████▒▒ │ ▒▒▒▒████████▒▒░ │ ▒▒▒▒ ████████ │ ▒▒▒▒ ████████ │ ▒▒▒▒ █ █ │ ░░░ █ █ │ ░░░░ │ ░░░░ │ ░░░░ 0│░░░░░ └──────────────────────────────────────────────→r 2.5 3.0 3.5 4.0 x_{n+1} = r × x_n × (1 - x_n) Muestra: punto fijo → período 2 → período 4 → caos
/>
Visualización de Redes Sociales con Algoritmo de Force-Directed
Visualización de redes sociales con el algoritmo de Fruchterman-Reingold.
╔═══════════════════════════════════════════════════╗ ║ GRAFO ORIENTADO POR Fuerza - Red Social ║ ╚═══════════════════════════════════════════════════╝ (Bob)─────────(Eve) │╲ ╱│ │ ╲ ╱ │ │ ╲ ╱ │ │ ╲ ╱ │ │ ╲ ╱ │ │ ╲ ╱ │ │ ╲ ╱ │ (Alice)───(Carol) │ ╱ ╲ │ │ ╱ ╲ │ │ ╱ ╲ │ │ ╱ ╲ │ │ ╱ ╲ │ │ ╱ ╲ │ │╱ ╲│ (Dave)─────────(Frank) Nodos: 6 Arestas: 12 Algoritmo: Fruchterman-Reingold Temperatura: 0.05 (convergido)
Incertidumbre del Filtro de Kalman
Actualizaciones crecientemente bayesianas secuenciales con niveles de confianza codificados en color.
╔═══════════════════════════════════════════════════╗ ║ FILTRO DE KALMÁN - Fusión de Sensors ║ ╚═══════════════════════════════════════════════════╝ Reducción de Incertidumbre Mediante Fusión de Sensors: Anterior (σ=10,0m): █████████████████████████████████████ ALTO Después de GPS (σ=4,5m): ████████████████ MEDIANIO Después de IMU (σ=0,5m): ██ BAJO Después de Lidar (σ=0,1m): ▏ MUYBAJO Crecimiento de Precisión (1/σ²): Anterior: ▏ +GPS: █ +IMU: ████████ +Lidar: ████████████████████████████████ Reducción total de incertidumbre: 99% Ganancia de precisión: 10.405×
╔═══════════════════════════════════════════════════╗ ║ PROJECTIONS CLIMÁTICAS CMIP6 - SSP2-4.5 ║ ╚═══════════════════════════════════════════════════╝ Cambio de Temperatura Global Media (2100 vs 1850-1900): GFDL-ESM4: █████████████████│ 1.8°C ± 0.2 HadGEM3: █████████████████████│ 2.1°C ± 0.3 MIROC6: ███████████████████│ 1.9°C ± 0.25 IPSL-CM6A: ███████████████████████│ 2.3°C ± 0.4 MPI-ESM: ████████████████████│ 2.0°C ± 0.1 ├─────────────────────────────────┤ 0 1.5°C 3.0°C Media de Ensemble: ████████████████████│ 2.02°C ± 0.18 ⚠ Obetivo de 1.5°C de París: 12% de probabilidad de permanecer por debajo ⚠ Obetivo de 2.0°C de París: 47% de probabilidad de permanecer por debajo
Ejecutando los Ejemplos
SOUC_BIN=bin/souc
Raster render (PPM en la salida estándar)
“$SOUC_BIN” run examples/render/triangle_basic.sio > triangle_basic.ppm “$SOUC_BIN” run examples/render/cube_wireframe.sio > cube_wireframe.ppm
Visualizaciones científicas
“$SOUC_BIN” run examples/visual/06_octonion_color_table.sio “$SOUC_BIN” run examples/visual/10_kalman_filter_color.sio “$SOUC_BIN” run examples/visual/12_animated_diffusion.sio
Demostraciones de la biblioteca gráfica
“$SOUC_BIN” ejecuta ejemplos/gráficos/demos/phase3_showcase.sio # 3D “$SOUC_BIN” ejecuta ejemplos/gráficos/demos/phase5_showcase.sio # Animación “$SOUC_BIN” ejecuta ejemplos/gráficos/demos/phase7_showcase.sio # Redes
Actualiza las vistas en raster del sitio web a partir de la salida exacta del compilador
npm —prefix website ejecuta genera:render-assets
Estructura de la Librería
| Fase | Módulos | Capacidades |
|---|---|---|
| Fase 1 | canvas, colores, dibujar, texto | Primitivos básicos, colores ANSI, formas |
| Fase 2 | ejes, scatter, grafico_lineal, grafico_barras, histograma, mapa_calor | Gráficos bidimensionales |
| Fase 3 | proyección, wireframe, scatter3d | Visualización en 3D |
| Fase 4 | entrada, grafico_interativo | Ajuste de zoom, pán, mouse/tarjeta de teclado |
| Fase 5 | animación, sistema_de_partículas, simulación_fluida | Animación, física |
| Fase 6 | diagrama_de_fases, bifurcación, poincare, líneas_de_flujo | Gráficos científicos |
| Fase 7 | gráfico, directed, layout_tree, render_grafico | Visualización de redes |
Comenzar con nosotros
Ejecuta uno de los presentaciones de fase
bin/souc ejecuta ejemplos/graphics/demos/phase1_showcase.sio