Presentación Ejemplo

Hopalong Orbit Visualizer -  Fractales en Three.js

Atractor de Barry Martin
Estructura del Proyecto
























Comentarios

Publicar un comentario

Entradas populares de este blog

Ejemplo Basico Processing

Imagen
El ejemplo a continuación fue tomado de Ejemplo Processing Después  de instalar Processing, se crea un nuevo SketchBook en este se coloca el código del ejemplo y se presiona ejecutar Aunque este es un ejemplo de Processing, puede ser visualizado en el navegador gracias a P5.js.Para esto es necesario importar la libreria de JavaScript P5.js y ajustar ajustar el código del ejemplo a Javascript y a los metodos especificos de P5.js El codigo ajustado a P5.js fue tomado de Ejemplo P5.js La principal diferencia de Processing con WebGl, es su alto nivel, como se puede ver en el ejemplo, para crear una elipse, simplemente llamamos el método ellipse() con los atributos necesarios y Processing realizara por nosotros todo el trabajo. Además para realizar una animación, basta con aumentar o disminuir las variables necesarias en el método draw(),  ya que Processing lo llama automáticamente para pintar cada "Frame" de la animación.
Leer más

Sombras en WebGL

 Sombras en WebGl El ejemplo esta organizado en varios archivos por lo tanto no fue posible subirlo a FiddleJS, por esta razón se desplegó en heroku.  https://jsbedoya-sombras.herokuapp.com/ Antes de iniciar con las sombras es necesario tener luz en la escena. Por esta razón inicialmente el fragment shader debe calcular el color basado en el angulo de la cara del objeto con respecto a la fuente de luz. Esto se hace calculando el producto punto la normal de la cara del objeto y el vector normalizado que apunta a la fuente de luz.  Para agregar el efecto de sombra es necesario modificar el fragment shader de tal forma que la intensidad del color se calcule de acuerdo a la posición con respecto a la fuente de luz.  Si el objeto esta cubierto por otro objeto, su color sera el mínimo, es decir solo la luz ambiente. Si no esta cubierto por otro objeto, la intensidad de color se calcula normalmente. Para calcular esta posición con respecto a la ...
Leer más