/threejs-texture-switching-loader

Texture image loader util for three.js, Switching Textureloader and ImageBitmapLoader.

Primary LanguageTypeScriptMIT LicenseMIT

threejs-texture-switching-loader

Texture image loader util for three.js, Switching TextureLoader and ImageBitmapLoader.

MIT License build test Test Coverage Maintainability

ReadMe Card

Demo

Demo Page

Getting Started

Install

threejs-texture-switching-loader depend on three.js

npm install three --save-dev

and

npm install @masatomakino/threejs-texture-switching-loader --save-dev

Import

At first, import classes.

import { TextureSwitchingLoader } from "@masatomakino/threejs-texture-switching-loader";

Load images

const geo = new SphereGeometry(20, 16, 16);
const mat = new MeshBasicMaterial();
const mesh = new Mesh(geo, mat);
scene.add(mesh);

const loader = new TextureSwitchingLoader();
loader.load("./earth.jpg").then((texture) => {
  mat.map = texture;
  mat.needsUpdate = true; // <- on changed map, you must set needsUpdate.
});

or

const geo = new SphereGeometry(20, 16, 16);

const loader = new TextureSwitchingLoader();
loader.load("./earth.jpg").then((texture) => {
  const mat = new MeshBasicMaterial({ map: texture });
  const mesh = new Mesh(geo, mat);
  scene.add(mesh);
});

Like ImageBitmapLoader, TextureSwitchingLoader.load() return Promise object.

API Documents

API documents

License

MIT license.