VEDA logo
Menu
日本語
logo

VEDA.js

Shader Art Framework for Web

npm version license MIT hashtag #vedajs

What is VEDA.js?

VEDA.js is a JavaScript framework to run GLSL shaders on browsers.
It was originally created as a GLSL engine of VEDA, but we realized that it's useful to run shaders on browsers so published VEDA.js as a standalone library.

Install

You can install VEDA.js with npm or yarn.

npm install vedajs

Usage

import Veda from 'vedajs';

const veda = new Veda();

veda.setCanvas(canvas);
veda.loadFragmentShader(code);

veda.play();

Advanced Usage

Fragment shader

veda.loadFragmentShader(code);

This is equivalent to

veda.loadShader({ fs: code });

Vertex shader

veda.loadVertexShader(code);

This is equivalent to

veda.loadShader({ vs: code });

Using both

Pass a shader object to loadShader.

veda.loadShader({
  vs: vertexShaderCode,
  fs: fragmentShaderCode,
});

Multipass rendering

VEDA.js supports multipass rendering.
Pass loadShader an array of shaders corresponding to each rendering pass.

veda.loadShader([{
  vs: vertexShaderFor1stPass,
  fs: fragmentShaderFor1stPass
}, {
  fs: fragmentShaderFor2ndPass
}]);

Audio input

veda.toggleAudio(true);
veda.loadShader(shader);

MIDI input

veda.toggleMidi(true);
veda.loadShader(shader);

WebCam input

veda.toggleCamera(true);
veda.loadShader(shader);

Keyboard input

veda.toggleKeyboard(true);
veda.loadShader(shader);

Gamepad input

veda.toggleGamepad(true);
veda.loadShader(shader);

Author

Takayosi Amagi

LICENSE

MIT