Type safe wrapper for WebGL.
npm install triangularType safe wrapper for WebGL.
``console`
yarn add triangular
Or
`console`
npm i triangular
`ts
import { createGL } from 'triangular';
const canvas = document.body.appendChild(document.createElement('canvas'));
const gl = createGL(canvas);
const positionBuffer = gl.createAttributeBuffer('vec2');
positionBuffer.bufferData([0, 1, 1, -1, -1, -1]);
const program = gl.createProgram({
attributes: { position: 'vec2' },
uniforms: {},
fragmentUniforms: {},
varying: { color: 'vec2' },
textures: {},
vertexShaderSource: ({ attributes, varying }) =>
void main() {
gl_Position = vec4(${attributes.position}.xy, 0, 1);
${varying.color} = (gl_Position.xy + vec2(1,1)) / vec2(2,2);
}
,
fragmentShaderSource: ({ varying }) =>
void main() {
gl_FragColor = vec4(0, ${varying.color}, 1);
}
,
});
gl.clear();
program.drawTriangles({
uniforms: {},
fragmentUniforms: {},
attributeBuffers: { position: positionBuffer },
textureBuffers: {},
});
``
