Skip to main content

Texture Filtering

game.ts
const renderLayers = {
foreground: 1 << 0,
};

export const createTextureFilteringGame = async (): Promise<Game> => {
const { game, world, renderContext, time } = createGame('demo-game');
createCamera(world, { verticalWorldUnits: DEMO_VERTICAL_WORLD_UNITS });

const pixelSprite = await createSprite(
renderContext,
renderLayers.foreground,
true,
);

const rasterSprite = await createSprite(
renderContext,
renderLayers.foreground,
false,
);

createEntity(world, pixelSprite, -200);
createEntity(world, rasterSprite, 200);

world.addSystem(createCameraEcsSystem(time));
world.addSystem(createRenderEcsSystem(renderContext));

return game;
};

This demo shows how texture filtering works. On the left, the planet is using nearest neighbor filtering (pixelated) and on the planet on the right is using linear filtering.