textureResource

Creates a resource for loading texture images. Loaded textures are automatically initialized with the WebGL renderer for optimal performance.

Usage

import { textureResource } from 'angular-three-soba/loaders';

@Component({
  template: `
    @if (textures.value(); as textures) {
      <ngt-mesh>
        <ngt-mesh-physical-material [normalMap]="textures.normalMap" [roughnessMap]="textures.roughnessMap" />
      </ngt-mesh>
    }
  `,
})
export class MyCmp {
  // Load multiple textures as named map
  textures = textureResource(() => ({
    roughnessMap: 'roughness_floor.jpeg',
    normalMap: 'NORM.jpg',
  }));
}

Loading a single texture

@Component({...})
export class MyCmp {
  texture = textureResource(() => '/textures/diffuse.jpg');
}

Loading an array of textures

@Component({...})
export class MyCmp {
  textures = textureResource(() => ['/textures/a.jpg', '/textures/b.jpg']);
}

Static Methods

• textureResource.preload(input) - Preloads textures into the cache.

// Preload a single texture
textureResource.preload('/textures/diffuse.jpg');

// Preload multiple textures
textureResource.preload(['/textures/a.jpg', '/textures/b.jpg']);

// Preload named textures
textureResource.preload({
  roughnessMap: 'roughness_floor.jpeg',
  normalMap: 'NORM.jpg',
});