Draws an antialiased grid along the X/Y/Z direction of a mesh.
Branch: master
Clone or download
Latest commit 8c7f4fb Jan 31, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
demo Initial commit - v1.0.0 with demo Jan 31, 2019
.gitignore Add node_modules to gitignore Jan 31, 2019
LICENSE Initial commit - v1.0.0 with demo Jan 31, 2019
README.md Add gamedev post reference Jan 31, 2019
grid.glsl Fix conditional import Jan 31, 2019
package.json Bump patch Jan 31, 2019

README.md

glsl-grid

stable

Draws an antialiased grid along the X/Y/Z direction of a mesh. For use with glslify.

Reference from this gamedev post.

glsl-grid

Installation 📦

npm i glsl-grid -S

Usage 📖

grid(vec3 pos, vec3 axis, float size)

  • vec3 pos The position in world space.
  • vec3 axis The axis to draw a grid for. Set to 1.0 to enable, 0.0 to disable. i.e. vec3(0.0, 0.0, 1.0) will draw only along the z axis.
  • float size Space between grid tiles.

Example 💾

#pragma glslify: grid = require(glsl-grid)
varying vec3 vPos;

void main() {
    float lines = grid(vPos, vec3(0.0, 0.0, 1.0), 2.0);
    gl_FragColor = vec4(vec3(lines), 1.0);
}

Demo

License 📝

MIT. See LICENSE for details.