Skip to content
EASEL.js

Use textures and loaders

Texture stores image or raw pixel data for the CPU sampler. The cache is bounded to 128×128 pixels, filtering stays nearest neighbor, and EASEL does not generate mipmaps. Atlas UVs should point at texel centers to avoid sampling neighboring cells.

For browser images, use TextureLoader and assign the resulting texture to a material map. Loader callbacks are asynchronous, so render a fallback material until the image is ready.

const loader = new EASEL.TextureLoader();
loader.load(
"/textures/grid.png",
(texture) => {
material.map = texture;
material.needsUpdate = true;
},
undefined,
(error) => {
console.error("Texture failed to load", error);
},
);

Model loaders such as OBJLoader and GLTFLoader create scene-graph data for the same CPU renderer. Source images are reduced to the texture cache limit.

This render needs a Canvas2D-capable browser.

Loading render…

Nearest-neighbor texture sampling on a rotating mesh.