God Rays

author:
Daniel Sperl
description:
Atmospheric lighting, like the typical effects you see underwater or in a forest.
compatible:
v2.2
tag:
light, god ray, sun ray
homepage:
https://gist.github.com/PrimaryFeather/e05a738e60c4253564d8a0f7866c5384

Overview

A quad that efficiently draws a 2D light ray effect on its surface. That's useful for adding atmospheric effects, like the typical effects you see underwater or in a forest. (Demo Source.)

Play around with the different settings to make it suit the style you want. In addition to the class-specific properties, you can also assign an overall color or different colors per vertex.

Add it to a juggler or call advanceTime so that the effect becomes animated.

var godRays:GodRayPlane = new GodRayPlane(320, 200);
godRays.color = 0xff8000;
godRays.speed = 0.1;  // animation speed
godRays.size = 0.1;   // number of rays ~= 1 / size
godRays.skew = 0;     // angle of rays
godRays.shear = 0;    // spread of angle
godRays.fade = 1;     // rays fade out towards the bottom
godRays.contrast = 1; // distinctiveness and brightness of the rays
 
addChild(godRays);
Starling.juggler.add(godRays);
Internally, the class creates a Perlin noise texture. Each frame, only one pixel row of this texture is displayed – stretched from top to bottom. The displayed row changes over time: this is what causes the rays to twinkle. By adjusting the texture coordinates, the angle and spread of rays can be determined.

Since most of the work is done in a shader, this effect is very lightweight and renders really fast. A MeshStyle, together with a MeshEffect, does the heavy lifting.

Changelog

  • 2017/10/10: First public version
  • 2021/01/15: Exposed 'textureOffset' property. Thanks to aureliendc for the pull request!

User Comments

Feel free to edit this part of the page if you want to add information that's lacking in the above description.
Questions are better asked in the forum, though.

  extensions/god_rays.txt · Last modified: 2021/01/15 09:54 by daniel
 
Powered by DokuWiki