¿Que es WebGL?

WebGL es una API multiplataforma destinada a crear gráficos 3D en un navegador web. Esta herramienta está basada en la conocida biblioteca de gráficos OpenGL ES 2.0, además utiliza su mismo lenguaje de sombreado o "shading", GLSL. La API WebGL ha sido desarrollada siguiendo el estándar OpenGL, es decir, si conoces OpenGL, te será muy sencillo adaptarte a esta nueva API para navegadores web.

WebGL
Logo WebGL
Esta nueva tecnología se ejecuta en el elemento Canvas de HTML5, además tiene una completa integración con todas las interfaces DOM (Document Object Model). Al ser una API DOM, podemos utilizar cualquier lenguaje de programación compatible con DOM como javascript o java.

Los propietarios de los navegadores más famosos y utilizados, Google (Chrome), Opera (Opera), Mozilla (Firefox) y Apple (Safari), son miembros del grupo de trabajo del consorcio Khronos para el desarrollo de WebGL, además de muchos otros programadores independientes de aplicaciones 3d.

Las ventajas de esta increíble API son las siguientes:

  • WebGL se basa en un conocido y ampliamente aceptado estándar de gráficos 3D (OpenGL).
  • Compatibilidad con distintos navegadores y plataformas.
  • Al ser una API DOM, es compatible con todos los elementos del estándar HTML.
  • Gráficos 3D acelerados por hardware (CPU y tarjeta gráfica).
  • Al utilizar lenguajes de programación interpretados no es necesario compilar tu código antes de renderizarlo y mostrarlo por pantalla.
Sigue nuestra guía WebGL para aprender a utilizar esta fascinante nueva tecnología.
Leccion 1: Primeros pasos con WebGL (con ejemplos)

Comentarios

  1. ivan15 de diciembre de 2016, 16:55

    Tengo un problema con varios objetos, cargados en webgle. Y al utilizar ray.intersectObjects, no encuentra a varios de ellos. (estan a nivel de camara mas a la derecha). Giran con teclas, se mueven con el mouse. al poner el mouse el intersect los ve en otro sitio. Al presionar CTRL + RUEDA DEL MOUSE (zoom), se arregla. Parece que no ha cargado bien los objetos. Que luego se terminan de cargar con el zoom y termina de cargar los objetos. (Se ubican en la pantalla en una posicion mas a la derecha y cambia al doble de tamaño)
    Video: https://drive.google.com/file/d/0B_oPu5nzzbVUby0yMmxScUp5aE0/view
    Uitilizo para intersectar este codigo (lleno un input con el nombre del objeto):

    var vector = new THREE.Vector3( mouse.x, mouse.y, 1 );
    projector.unprojectVector( vector, camera );
    var ray = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
    var intersects = ray.intersectObjects( scene.children );
    if ( intersects.length > 0 )
    {
    if ( intersects[ 0 ].object != INTERSECTED )
    {
    INTERSECTED = intersects[ 0 ].object;
    $("#xxx").val(INTERSECTED.name);
    }
    }
    else // there are no intersections
    {
    INTERSECTED = null;
    }
    No tengo idea como arreglarlo.

    ResponderEliminar

Publicar un comentario

Si tenéis alguna duda o sugerencia, no dudéis en comentar. ;)

Entradas populares de este blog

Autocompletado de codigo en Sublime Text

Imagen
SublimeCodeIntel es uno de los paquetes de autocompletado más completos de Sublime Text. Para instalarlo tan solo necesitas tener instalado en tu Sublime Text el Gestor de Paquetes que te permitirá instalar el paquete, si aún no lo tienes, en esta entrada se explica como hacerlo: Gestor de paquetes para Sublime Text Hecho esto, para instalar este paquete tan solo debemos pulsar Ctrl+shift+p, esto abrirá una lista de opciones, has de buscar la opción Package Control: Install Package y hacer click en ella. Esto abrirá una lista de todos los paquetes de utilidades que tienes a tu disposición para utilizar en tu Sublime Text.
Seguir leyendo »

Compilar y ejecutar JAVA desde Sublime Text

En esta entrada veremos como configurar un llamado Build System de Sublime Text para que al presionar ctrl + b se compile y ejecute nuestra aplicación en JAVA. Lo primero que debemos hacer es iniciar Sublime Text, una vez lo hallamos hecho, vamos a Tools -> Build System -> New Build System... Esto abrirá un pequeño archivo con unas lineas escritas en JSON, de modo que debemos copiar el siguiente código y pegarlo en este archivo . //Codigo valido para Windows y Linux { "cmd": ["javac ${file_name} && java ${file_base_name}"], "shell": true } Cuando lo hallamos hecho, guardamos dicho archivo en la carpeta donde nos sugiere Sublime Text, y l e ponemos un nombre descriptivo como por ejemplo ejecutarJava.sublime-build , ten cuidado que la extensión del archivo sea .sublime-build . Y con eso ya hemos terminado, para compilar y ejecutar nuestros programas en JAVA tan solo debes ir a Tools -> Build System y elegir el nombre del a
Sigue leyendo

Compilar y ejecutar JAVA desde Notepad++

Imagen
Compilar y ejecutar nuestros programas con solo presionar un botón es algo muy cómodo que casi todos los IDEs de programación tienen. Por desgracia Notepad++, un editor de código ligero y potente que tiene soporte para un gran número de lenguajes, no trae consigo la posibilidad de compilar y ejecutar nuestro archivo .java con tan solo pulsar un botón, pero en cambio nos da herramientas para poder hacerlo nosotros mismos. Lo que debemos hacer es entrar en nuestro querido editor Notepad++, en la barra de opciones de la parte superior, deberemos hacer click en Ejecutar y seguidamente en Ejecutar... , la primera opción de la lista de opciones que aparecerá.
Seguir leyendo »