Desarrollo en WebGL: Graficos 3D

En el siguiente documento se buscará realizar un mini tutorial tratando de iniciar y familiarizar a los lectores sobre la programación en WebGL.partiendo desde la configuración de los navegadores para poder emplear esta tecnología, mostrando las nociones básicas para poder programar ejemplos simples, así como visualizar ejemplos más complejos en donde mostrar todo el pontencial.

WebGL es una especificación estándar que está siendo desarrollada actualmente para desplegar gráficos en 3D en navegadores web. El WebGL permite activar gráficos en 3D acelerados por hardware en páginas web, sin la necesidad de plug-ins en cualquier plataforma que soporte OpenGL 2.0 u OpenGL ES 2.0. Técnicamente es un enlace (binding) para javascript para usar la implementación nativa de OpenGL ES 2.0, que será incorporada en los navegadores. WebGL es manejado por el consorcio de tecnología Khronos Group sin fines de lucro.

WebGL creció desde los experimentos del canvas 3D comenzados por Mozilla.

Mozilla primero demostró un prototipo de Canvas 3D en 2006. A finales de 2007, tanto Mozilla como Opera habían hecho sus propias implementaciones separadas. A nprincipio de 2009 Mozilla y Khronos comenzaron el WebGL Working Group (Grupo de Trabajo del WebGL). El Grupo de Trabajo del WebGL incluye Apple, Google, Mozilla, y Opera, y WebGL ya está presente en los builds nocturnos de Mozilla Firefox 3.7, Mozilla Fennec 1.0, WebKit, y Google Chrome 4 developer previews. 

Algunas bibliotecas en desarrollo que se están incorporando WebGL incluyen el C3DL y el WebGLU. Utiliza el elemento canvas del HTML 5.

Configurar navegadores:

Como punto de partida trataremos de conseguir un navegador que soporte WebGL. La mayoría de las versiones de desarrollo de los principales navegadores lo hace, sólo tendremos que conseguir la versión adecuada y realizar unas pequeñas configuraciones. Veremos las soluciones a adoptar en los principales sistemas operativos.

2.1 Windows 

Si tenemos una tarjeta gráfica con GPU ATI o Nvidia, no debería haber problema. Podremos emplear Firefox o Chrome. En caso de tener problemas, tendremos que usar Firefox con software de renderización, es decir, los gráficos 3D serán ejecutados en el procesador normal, no en la tarjeta gráfica. Para el caso de chipset gráfico Intel, presente en muchos ordenadores portátiles, sus controladores no suelen ser compatibles con OpenGL, por tanto tampoco lo serán con WebGL ya que funciona a través de WebGL (en el futuro esto será distinto). Podríamos probar las instrucciones para Firefox o Chrome, pero no es probable que funcione; usaremos Firefox con software de renderización. 

Firefox 

La versión de desarrollo se denomina Minifield. Para conseguirla y poder emplear WebGL seguiremos los siguientes pasos: Descargaremos la versión adecuada a nuestra máquina. Cerramos Firefox previamente, y una vez instalado Minifield, iremos a la página: about:config Nos ayudamos del filtro de búsqueda, en donde introducimos "WebGL" Localizamos webgl.enabled_for_all_sites y lo ponemos a true.

3. Primer Programa 

En primer lugar vamos a ver como incrustar nuestro código de webGL en cualquier página html. Para incrustar el código html debemos: Definir en la etiqueta la función encargada gestionar el interface gráfico. Definir un canvas, asignarle una etiqueta(para luego referenciarlo) y su tamaño. Cargar los scripts externos que vayamos a necesitar (en este caso los propios de la API webGL y otro necesario para trabajar con matrices). Una vez definidos estos aspectos ya podemos comenzar a programar nuestro propio script en webGL.

SIGUE APRENDIENDO DESCARGANDO EL ARCHIVO

 Aprende Como Descargar Los Archivos Del Blog