Ops.Gl
WebGl Ops convert an array of RGB values to a texture
set fixed viewport aspect ratop and letterboxing
change how colors are mixed (blending/mixing modes)
calculate normals of a geometry
convert a canvas to texture
check if webgl canvas element is in the current browser viewport
the size of the canvas in pixels, aspect ratio and pixel density
sets all cleared pixels to one colour. Use to change the background colour.
Clears the depth buffer (zbuffer, z buffer)
enable/disable color channels RGBA
pick a color at x,y coordinates of canvas
change depth testing method (depthMask,depthWrite,depthFunc)
translate away from a point in space
download a texture as png file
draw texture mapping coordinates
Disable the rendering of front or back facing triangles with culling
Load MSDF Font data and texture to use
Resize canvas element to a specific pixel size or aspect ratio
information about the webgl context
force rendering of meshes using points,lines or triangles
texture containing a colour gradient that can be altered with an editor
transform and arrange elements into a grid
reset all transforms (modelmatrix)
reset the view matrix (cameras etc.)
do not trigger next when rendering the shadow pass
play a image sprite animation
an area which is interactive
A Simple way to write text on the screen.
Trigger other ops once every frame to create smooth animations (renderer)
Draw the same mesh multiple times on the GPU
morph from one geometry to another
morph between a series of meshes
morph between two geometries and render it
convert screen pixel coordinates to range 0-1
Orthogonal projection / objects in distance don't appear smaller (isometric)
Show WebGl Performance Statistics
Measure the time used to execute all child ops
Adjust FOV, field of view, and frustum clipping
transform objects to look like the phyllotaxis pattern
remaps world co-ordinates to a pixel co-ordinate system
save points/coordinates in an array
collect world space coordinates into an array
collect screen pixel coordinates into an array
generate a qr code as a texture
Transforms objects randomly in space
randomize order of triangles in a geometry
Render something into an Image
render to multiple textures at the same time
render an animation and save as file webm video or png image sequence
Render a geometry as mesh
download the current screen content as png file
visualize normals, tangents or bitangents
scatter object on the surface of a mesh
Scatter an object on the surface of a mesh with different distribution methods
extract pathes from a svg json
create new triangles in a mesh (subdivide)
extract colors from a texture
create an array of textures
load multiple images into an array
load multiple texture from filenames given as an array
create a texture from an array of number values
Create points by sampling texture
Load an image as a texture
will trigger when canvas was resized
Outputs current viewport size
force a viewport aspect ratio
Ops.Gl.Matrix
WebGl Ops interpolate position on a spline/array3x
render lots of particles following a path/spline/array3x
iterate over an array3: translate to xyz, then trigger next op
rotate an object to always face the camera
Transforms and projects the scene from the point of view of the camera.
get camera attributes from current camera/orbit controls
get the current position of viewmatrix/camera eye
Animate objects to move along a circle
Transform following Meshes around a Circle
current xyz coordinates (modelmatrix)
Get the scalar scaling of a matrix
get current projectionmatrix
interpolate between two matrices
transforms view to look from eye to center
get translation of a matrix
rotate your object by clicking and dragging the mouse
multiplies current modelmatrix with a quaternion
place random objects on a grid
Place random objects on a grid
enlarge or shrink objects by a scale factor for every axis
screen/pixel coordinates of the current transform
convert screen coordinates to a 3d position
displaces each point of a mesh in fixed direction
Transform objects in 3d space (rotate, translate, scale)
multiply current modelmatrix
Translate objects (move / position in 3D space)
translate the view/camera matrix
simple camera you control with W,A,S,D keys like in a FPS game
Ops.Gl.Meshes
WebGl Ops cables logo mesh/geometry
render a rectangular corner
Draws a cross with controllable thickness and length.
draw parameterizable cylinder (aka tube,pipe,round,circle)
a freely deformable plane
Draws a rectangle using the full WebGL canvas size
draw a simple grid of lines
generate a rectangular mesh where the height is defined by the luminance of an image
generates a helix, spiral spline
Renders a icosahedron (polyhedron with 20 faces)
Draw a line between two points
Creates a 3d mesh from a 2d area expressions
visualize an array of coordinates as points
generate polyhedron meshes
draw a sphere of random points
Draws a rectangle with rounded corners
Draws a simple spline only one pixel wide
Simple Wireframe Line Renderer
draw parameterizable sphere
Draws a filled Spline with configurable thickness
draw a star mesh (saw,gear)
draw a torus (doughnut, donut, ring mesh)
Draws multiple triangles using coordinates from an array
a sphere mesh with uniform distributed vertices
Render lines from the Voronoi op
Ops.Gl.Shader
WebGl OpsA material without shading
display texture and replace a color with transparency
Write your own custom shader
draw meshes using the cables error material shader
see which faces are facing the camera
image based lighting material using cubemaps
Easy to use image based lighting Material
Test if the mouse hovers over drawn elements
Test if following meshes are picked by the picker
Draw all vertices as points / circles
render a shader into a texture
render a shader to multiple textures
view current shader source code
render mesh normals as colors
visualize texturecoordinates/UV mapping of a mesh
Switch between two shaders
lookup color values from a texture and use it as object color
draw a mesh showing only it's vertex colors
Renders following meshes as wireframes
Ops.Gl.ShaderEffects
WebGl Ops do not draw pixels inside a defined 3d area
Scales the size of meshes within the area of influence
Translate object positions with a noise function
Change the position of all meshes inside of the area of influence
bend objects along an axis
displace vertices by the value in a texture
clamp/restrict the vertex position to min/max values per axis
colorize all meshes around current position
colorize instanced meshes by picking random color from a texture
add a reflection to any material
deform a spherical area of a mesh
explode a (divided) mesh in the direction of faces normals
Fog as a shadereffect applied to a material
simulate grass motion in wind
displace position of instanced object by perlin noise value
3d space noise for mesh materials
Displace vertices using perlin noise animation
select textures to render to
scale vertices of an object in the direction of face normals
Repeat a mesh along a spline using instancing
transform instanced object
twist a mesh around an axis
Displace the vertices of a mesh with the pixels brightness values from a texture
only draw the first X vertices of a mesh
set vertex positions from texture color values
sine wave vertex displacement
Ops.Gl.TextureEffects
WebGl Opsset alphachannel of current imagecompose via a texture mask
Blur the pixels of an image
Draws a Border around the current ImageCompose
adjust image brightness and contrast
bulge and pinch an image (deform,stretch,distort)
draw a checkerboard pattern
simulating lens effect by shifting rgb channels
Draw 2d circle into texture
Clamps a texture to min and max values - Also has remap modes
Increase contrast in midtones
fill image using a color (overlay)
change intensity of r,g,b channels
enable disable RGB color channels
colorize a black and white image using a gradient texture
Use custom shader as a texture effect
Denoise texture effect - used to smooth out noisy images
draw the content of a depth texture
draw a gradient mapped to depth buffer values
Remove colors from image / greyscale
convert color to balck and white patterns
Draws an image into a composition
Draw only the edges of an image
post processing antialiasing
Blurs a texture - cheap and fast
flip the image on x or y axis
Render fog as a texture effect using a depth texture
Allows for Gamma correction of a texture
Draws a simple gradient between three colors
Make one pixel lines thicker via postprocessing
Adjust Hue of current ImageCompose
Compose Images and effects as layers to generate new Images
apply color filter/effects by using a lookup texture
Creates a lens dirt like texture
Creates a procedural texture simulating scratches on a lens
adjust levels to correct the tonal range of an image
remove darkest or brightest parts of the image
Create a RGB palette using an array
Changes color lookup for every pixel using a displacement map
display texture using polar/radial coordinate system
simulate lens flare effect
Cellular automata system as feedback loop texture.
Draw a 2D rectangle with controllable parameters
Remove alpha information from image
multiply image colors by color channel
draw round corners around image (border)
screen space ambient occlusion
Generates different 2d shapes to use as a texture
Create a texture of stripes
render the difference of two textures
Convert a black and white map to a normal map
Creates a twirl/swirl/spiral effect in a texture
adjust vibrance/saturation
Simulating an old camera effect of fading away the edges of the image
Generate different texture waveforms. Sine, sawtooth and triangle.
Generates 4 different waveform textures. Sine, sawtooth,Triangle, Square.
Uses a BW Texture to reveal the layer underneath.
waving wobble motion effect
Ops.Gl.TextureEffects.Noise
WebGl Ops fractional brownian motion noise
Creates a black and white glitched texture to use for displacement
Creates a hexagonal noise texture
multilayer perlin noise variation
draw perlin noise into an image
noise made from triangles
Ops.Gl.Textures
WebGl OpsSimple texture filled with one color
copy a texture and optionally resize it
A very simple empty texture
draw a graph of a value into a texture
graphical representation of distribution of color in a texture
Switch between different textures
Generates a texture which reads Text
Outputs information about the connected texture
Load a SVG image and convert to pixel texture
play a video file and use it as a texture
use your webcam camera as a texture