📋 Guía de Integración

🌐 URLs Estables

Todas las visualizaciones tienen URLs permanentes y estables:

🐍 Tipos de Datos: https://chusitooxduwu.github.io/graficsIP/visualizations/nivel1/data-types-explorer.html
➕ Método append(): https://chusitooxduwu.github.io/graficsIP/visualizations/nivel1/append-demo.html
🎪 Operadores: https://chusitooxduwu.github.io/graficsIP/visualizations/nivel1/operators-demo.html
🔄 Condicionales: https://chusitooxduwu.github.io/graficsIP/visualizations/nivel2/conditionals-simulator.html
🧮 Módulo Math: https://chusitooxduwu.github.io/graficsIP/visualizations/nivel2/math-module-explorer.html
🎲 Módulo Random: https://chusitooxduwu.github.io/graficsIP/visualizations/nivel2/random-module-explorer.html
🔁 Bucles for: https://chusitooxduwu.github.io/graficsIP/visualizations/nivel3/for-loops-demo.html

🛠️ Métodos de Integración

📖 GitBook

Usa la sintaxis de embed de GitBook:

{% embed url="https://chusitooxduwu.github.io/graficsIP/visualizations/nivel2/math-module-explorer.html" %}
Explorador interactivo del módulo math de Python
{% endembed %}
                

🌐 HTML/Iframe

Para sitios web, Moodle, Canvas u otras plataformas:

<iframe src="https://chusitooxduwu.github.io/graficsIP/visualizations/nivel2/math-module-explorer.html" 
        width="100%" 
        height="600px" 
        frameborder="0" 
        allowfullscreen>
</iframe>
                

📱 Responsive

Para dispositivos móviles, usa estas dimensiones:

<iframe src="https://chusitooxduwu.github.io/graficsIP/visualizations/nivel1/append-demo.html" 
        width="100%" 
        height="500px" 
        frameborder="0" 
        allowfullscreen
        style="border: 2px solid #007acc; border-radius: 10px;">
</iframe>
                

⚙️ Configuraciones Recomendadas

Ancho: 100% (responsive)
Alto: 500-600px según contenido
Borde: Opcional, mejora la apariencia
allowfullscreen: Recomendado para mejor experiencia

🎯 Casos de Uso

👨‍🏫 Para Profesores

Demos en vivo durante clases
Ejercicios prácticos para estudiantes
Evaluaciones interactivas

🎓 Para Estudiantes

Práctica autónoma
Verificación de conceptos
Experimentación libre

💻 Para Desarrolladores

Integración en LMS
Customización de estilos
Análisis de uso

🔧 Soporte Técnico

Si tienes problemas con la integración:

📧 Crear un issue en GitHub
🌐 Verificar que la URL sea exacta
📱 Probar en diferentes dispositivos
🔄 Verificar que allowfullscreen esté habilitado

📋 Guía de Integración GraficsIP