# AssetElement

Class · extends [`AsyncElement`](https://api.playcanvas.com/web-components/classes/AsyncElement.md) · category: Resources

Source: https://github.com/playcanvas/web-components/blob/252f001881302c266c8d727044408c32be2bb5e7/src/asset.ts#L212

The AssetElement interface provides properties and methods for manipulating
[`<pc-asset>`](https://developer.playcanvas.com/user-manual/web-components/tags/pc-asset/) elements.
The AssetElement interface also inherits the properties and methods of the
[HTMLElement](https://developer.mozilla.org/docs/Web/API/HTMLElement) interface.

The element becomes ready once the containing application has started and the asset is in the
state declared by the markup: loaded for preloaded assets (even if loading failed — check the
asset's `resource`), or registered and awaiting a load for `lazy` assets. Elements inserted
while the application is running are created and registered on insertion, and begin loading
immediately unless `lazy`. A `pc-asset` must be a direct child of `pc-app` — elements placed
elsewhere, or with an unsupported asset type, never become ready.

A `lazy` asset loads on first use: the first time any element resolves it by `id` — a model,
a material map, a sky, a script `asset:` reference — or when the `lazy` attribute is removed,
whichever comes first. Until then it stays registered and unloaded.

For `texture` and `textureatlas` assets, the texture options (`address-u`, `address-v`,
`min-filter`, `mag-filter`, `anisotropy`, `mipmaps`, `srgb`, `flip-y`) apply when the texture is
created and — like `lazy` — are observed: changing one updates a texture that has already
loaded, and removing one restores the engine default. Changing `srgb` or `mipmaps` on a loaded
texture recreates the underlying GPU resource, so prefer declaring those up front. Each option
overrides the matching key in the `data` JSON; options left unset write nothing, leaving the
engine's per-format defaults in force.

Apart from `lazy` and the texture options, these attributes are read once when the asset is
created, so changing them later has no effect.

**elementSummary** The `<pc-asset>` element declares an asset for the application to load — a model,
texture, font, sound, script or JSON file — under an `id` that other elements reference. Must be
a direct child of `<pc-app>`.

**attribute** id - The identifier used to reference the asset from other elements.

**attribute** src - The URL of the asset to load.

**attribute** type - The asset type. Inferred from the `src` file extension when omitted.

**attribute** data - Additional asset data, as a JSON object.

**attribute** atlas - For a `sprite` asset, the `id` of the texture atlas asset it uses.
The atlas must be declared before the sprite.

**attribute** frame-keys - For a `sprite` asset, the atlas frame keys it uses, separated
by spaces or commas.

**attribute** pixels-per-unit - For a `sprite` asset, the number of pixels per world unit.

**attribute** render-mode - For a `sprite` asset, how the sprite is
rendered when resized.

**fires** load - Fired each time the asset finishes loading, including a `lazy` asset
loaded later and any subsequent reloads. Does not bubble — listen on this element, or use a
capture-phase listener on an ancestor to observe every asset.

**fires** error - Fired when the asset fails to load, with the engine's error in
`message`. Does not bubble. The element still becomes ready — readiness means the load settled,
not that it succeeded.

## Properties

### asset

```ts
asset: Asset<string> | null = null
```

The asset that is loaded. Available once the element is ready — await
[whenReady](https://api.playcanvas.com/web-components/functions/whenReady.md) or the element's `ready()` promise before accessing it.

## Accessors

### addressU

```ts
get addressU(): AddressMode | null
set addressU(value: AddressMode | null)
```

Gets the texture's horizontal (U) address mode.

### addressV

```ts
get addressV(): AddressMode | null
set addressV(value: AddressMode | null)
```

Gets the texture's vertical (V) address mode.

### anisotropy

```ts
get anisotropy(): number | null
set anisotropy(value: number | null)
```

Gets the texture's maximum anisotropic filtering level.

### flipY

```ts
get flipY(): boolean | null
set flipY(value: boolean | null)
```

Gets whether the texture's image data is flipped vertically at upload.

### lazy

```ts
get lazy(): boolean
set lazy(value: boolean)
```

Gets whether the asset should be loaded lazily.

### magFilter

```ts
get magFilter(): MagFilterMode | null
set magFilter(value: MagFilterMode | null)
```

Gets the texture's magnification filter.

### minFilter

```ts
get minFilter(): MinFilterMode | null
set minFilter(value: MinFilterMode | null)
```

Gets the texture's minification filter.

### mipmaps

```ts
get mipmaps(): boolean | null
set mipmaps(value: boolean | null)
```

Gets whether the texture generates and uses mipmaps.

### srgb

```ts
get srgb(): boolean | null
set srgb(value: boolean | null)
```

Gets whether the texture holds sRGB (gamma-encoded) color data.

## Methods

### get

```ts
static get(id: string): Asset<string> | null | undefined
```

Returns the [Asset](https://api.playcanvas.com/engine/classes/Asset.html) created by the `<pc-asset>` element with the given `id`, or
`undefined` if there is no such element or its asset has not been created yet.

**Parameters**

- `id` (`string`): The `id` of the `<pc-asset>` element.

**Returns** `Asset<string> | null | undefined`: The asset, or `undefined`.

## Inherited from [AsyncElement](https://api.playcanvas.com/web-components/classes/AsyncElement.md)

- `get closestApp(): AppElement | null`
- `get closestEntity(): EntityBaseElement | null`
- `protected _onReady(): void`
- `protected _resetReady(): void`
- `ready(): Promise<AssetElement>`