Class MicrioImage

Represents and controls a single Micrio image instance within the viewer. This class manages the image's metadata (info), cultural data (data), settings, camera, state, and interactions with the compute engine for rendering and processing. It handles loading image tiles, embeds, markers, tours, and galleries associated with the image.

Instances are typically created and managed by the main HTMLMicrioElement.

Author

Marcel Duin marcel@micr.io

Index

Properties

`Optional`album

album?: Album

Album information if this image is part of a V5 album.

camera

camera: Camera

The virtual camera instance controlling the view for this image.

`Readonly`data

data: Writable<Models.ImageData.ImageData> = ...

Svelte Writable store holding the image's cultural data (markers, tours, text content for the current language). See Models.ImageData.ImageData.

dataPath

dataPath: string

Base path URI for fetching data.[lang].json files.

`Readonly`embeds

embeds: MicrioImage[] = []

Array of child MicrioImage instances embedded within this image.

engine

engine: Engine

The global Engine controller instance.

error

error: string

Stores an error message if loading failed.

grid

grid: Grid

Grid controller instance, if this image is a grid container.

id

id: string

The unique identifier (Micrio ID) for this image.

`Readonly`info

info: Readable<Models.ImageInfo.ImageInfo>

Svelte Readable store holding the image's core information (dimensions, format, settings, etc.). See Models.ImageInfo.ImageInfo.

openedView

openedView: CameraArray

Stores the camera view state when a marker is opened, used to return to the previous view.

opts

opts: {
    area?: CameraArray;
    isEmbed?: boolean;
    isPassive?: boolean;
    secondaryTo?: MicrioImage;
    useParentCamera?: boolean;
} = {}

Options controlling behavior (embedding, split-screen, etc.).

Type Declaration

Optionalarea?: CameraArray
Optional sub area [x0, y0, x1, y1] defining placement within a parent canvas (for embeds/galleries).
OptionalisEmbed?: boolean
If true, this image is embedded within another image (affects rendering/camera).
OptionalisPassive?: boolean
If true, passively follows the view changes of the primary split-screen image.
OptionalsecondaryTo?: MicrioImage
For split screen, the primary image this one is secondary to.
OptionaluseParentCamera?: boolean
If true, uses the parent image's camera instead of creating its own (for switch/omni galleries).

`Readonly`settings

settings: Writable<Settings> = ...

Svelte Writable store holding the image's specific settings, often merged from attributes and info data. See Models.ImageInfo.Settings.

`Readonly`state

state: State.Image

State manager specific to this image instance (view, active marker, etc.). See State.Image.

swiper

swiper: GallerySwiper

Gallery swiper instance, if this image is part of a swipe gallery.

tileBase

tileBase: string

Base path for fetching image tiles.

`Readonly`uuid

uuid: string = ...

A unique instance identifier (UUID) generated for this specific instance.

`Readonly`video

video: Writable<HTMLVideoElement> = ...

Svelte Writable store holding the HTMLVideoElement if this image represents a video.

`Readonly`viewport

viewport: Writable<CameraArray> = ...

Svelte Writable store holding the calculated pixel viewport [left, top, width, height] of this image within the main canvas.

`Readonly`visible

visible: Writable<boolean> = ...

Svelte Writable store indicating if this image's canvas is currently visible and being rendered.

Accessors

$data

get $data(): Models.ImageData.ImageData
Getter for the current value of the data store.

Returns Models.ImageData.ImageData

$info

get $info(): Models.ImageInfo.ImageInfo
Getter for the current value of the info store.

Returns Models.ImageInfo.ImageInfo

$settings

get $settings(): Settings
Getter for the current value of the settings store.

Returns Settings

Methods

addEmbed

addEmbed(
    info: Partial<Models.ImageInfo.ImageInfo>,
    area: CameraArray,
    opts?: EmbedOptions,
): MicrioImage
Adds an embedded MicrioImage (representing another Micrio image or video) within this image.
Parameters
- info: Partial<Models.ImageInfo.ImageInfo>
  Partial info data for the embed.
- area: CameraArray
  The placement area [x0, y0, x1, y1] within the parent image.
- opts: EmbedOptions = {}
  Embedding options (opacity, fit, etc.).
Returns MicrioImage
The newly created embedded MicrioImage instance.

fadeIn

fadeIn(direct?: boolean): void
Fades in the image smoothly or instantly.
Parameters
- direct: boolean = false
Returns void

fadeOut

fadeOut(direct?: boolean): void
Fades out the image smoothly or instantly.
Parameters
- direct: boolean = false
Returns void

getEmbedMediaElement

getEmbedMediaElement(id: string): HTMLMediaElement
Gets the HTMLMediaElement associated with a video embed ID.
Parameters
- id: string
Returns HTMLMediaElement

Class MicrioImage

Author

Index

Properties

Accessors

Methods

Properties

Optionalalbum

camera

Readonlydata

dataPath

Readonlyembeds

engine

error

grid

id

Readonlyinfo

openedView

opts

Type Declaration

Optionalarea?: CameraArray

OptionalisEmbed?: boolean

OptionalisPassive?: boolean

OptionalsecondaryTo?: MicrioImage

OptionaluseParentCamera?: boolean

Readonlysettings

Readonlystate

swiper

tileBase

Readonlyuuid

Readonlyvideo

Readonlyviewport

Readonlyvisible

Accessors

$data

Returns Models.ImageData.ImageData

$info

Returns Models.ImageInfo.ImageInfo

$settings

Returns Settings

Methods

addEmbed

Parameters

Returns MicrioImage

fadeIn

Parameters

Returns void

fadeOut

Parameters

Returns void

getEmbedMediaElement

Parameters

Returns HTMLMediaElement

Settings

On This Page

`Optional`album

`Readonly`data

`Readonly`embeds

`Readonly`info

`Optional`area?: CameraArray

`Optional`isEmbed?: boolean

`Optional`isPassive?: boolean

`Optional`secondaryTo?: MicrioImage

`Optional`useParentCamera?: boolean

`Readonly`settings

`Readonly`state

`Readonly`uuid

`Readonly`video

`Readonly`viewport

`Readonly`visible