# Interface: CanvasManagerInterface (/jsdoc/pixi-vn/index/interfaces/CanvasManagerInterface)



Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:25](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L25)

Properties [#properties]

app [#app]

\> `readonly` **app**: `Application`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:30](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L30)

The PIXI Application instance.
It not recommended to use this property directly.

***

children [#children]

\> `readonly` **children**: `ContainerChild`\[]

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:93](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L93)

The children of the canvas.

***

currentTickers [#currenttickers]

\> `readonly` **currentTickers**: `Map`\<`string`, [`TickerInfo`](/jsdoc/pixi-vn/index/interfaces/TickerInfo)\<`any`>>

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:215](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L215)

Currently tickers that are running.

***

currentTickersSteps [#currenttickerssteps]

\> `readonly` **currentTickersSteps**: `Map`\<`string`, `Map`\<`string`, [`TickersSequence`](/jsdoc/pixi-vn/index/interfaces/TickersSequence)>>

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:219](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L219)

The steps of the tickers

***

gameLayer [#gamelayer]

\> `readonly` **gameLayer**: `Container`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:35](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L35)

The PIXI Container that contains all the canvas elements.

***

height [#height]

\> **height**: `number`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:48](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L48)

The height of the canvas.

***

isInitialized [#isinitialized]

\> `readonly` **isInitialized**: `boolean`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:39](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L39)

If the manager is initialized.

***

screen [#screen]

\> `readonly` **screen**: `Rectangle`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:52](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L52)

The screen of the canvas (Application.screen).

***

width [#width]

\> **width**: `number`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:44](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L44)

The width of the canvas.

Methods [#methods]

add() [#add]

\> **add**(`alias`, `canvasComponent`, `options?`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:135](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L135)

Add a canvas element to the canvas.
If there is a canvas element with the same alias, all "style", zIndex, and [TickerBase](/jsdoc/pixi-vn/index/classes/TickerBase) will be transferred to the new canvas element,
and the old canvas element will be removed.

Parameters [#parameters]

alias [#alias]

`string`

The alias of the canvas element.

canvasComponent [#canvascomponent]

[`CanvasBaseInterface`](/jsdoc/pixi-vn/index/interfaces/CanvasBaseInterface)\<`any`>

The canvas elements to be added.

options? [#options]

The options of the canvas element.

ignoreOldStyle? [#ignoreoldstyle]

`boolean`

If there is a canvas element with the same alias, the "style" of the old canvas element will be imported to the new canvas element.

**Default**

```ts
false
```

zIndex? [#zindex]

`number`

The zIndex of the canvas element.

**Default**

```ts
undefined
```

Returns [#returns]

`void`

Example [#example]

```typescript
const texture = await Assets.load('https://pixijs.com/assets/bunny.png');
const sprite = Sprite.from(texture);
canvas.add("bunny", sprite);
```

***

addHtmlLayer() [#addhtmllayer]

\> **addHtmlLayer**(`id`, `element`, `style?`): `HTMLDivElement`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:467](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L467)

Add a HTML layer to the canvas.

Parameters [#parameters-1]

id [#id]

`string`

The id of the layer.

element [#element]

`HTMLElement`

The html element to be added.

style? [#style]

`Partial`\<`Pick`\<`CSSStyleDeclaration`, `"pointerEvents"` | `"position"` | `"userSelect"`>>

The style of the layer.

Returns [#returns-1]

`HTMLDivElement`

Default [#default]

```ts
{ position: "absolute", pointerEvents: "none", userSelect: "none" }.
```

Example [#example-1]

```tsx
const root = document.getElementById('root')
if (!root) {
    throw new Error('root element not found')
}
const htmlLayer = canvas.addHtmlLayer("ui", root, {
   position: "absolute",
   pointerEvents: "none"
})
const reactRoot = createRoot(htmlLayer)
reactRoot.render(
    <App />
)
```

***

addLayer() [#addlayer]

\> **addLayer**(`label`, `layer`): [`Layer`](/jsdoc/pixi-vn/index/type-aliases/Layer) | `undefined`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:426](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L426)

Add a layer to the canvas.

Parameters [#parameters-2]

label [#label]

`string`

The label of the layer.

layer [#layer]

`Container`

The layer to be added.

Returns [#returns-2]

[`Layer`](/jsdoc/pixi-vn/index/type-aliases/Layer) | `undefined`

The layer.

Example [#example-2]

```typescript
const uiLayer = new Container();
canvas.addLayer("ui", uiLayer);
```

***

addTicker() [#addticker]

\> **addTicker**\<`TArgs`>(`canvasElementAlias`, `ticker`): `string` | `undefined`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:239](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L239)

Run a ticker. You can run multiple addTicker with the same alias and different tickerClasses.
If you run a ticker with the same alias and tickerClass, the old ticker will be removed.
If already exists a sequence of tickers with the same alias, it will be removed.

Type Parameters [#type-parameters]

TArgs [#targs]

`TArgs` *extends* [`TickerArgs`](/jsdoc/pixi-vn/index/interfaces/TickerArgs)

Parameters [#parameters-3]

canvasElementAlias [#canvaselementalias]

`string` | `string`\[]

The alias of the canvas element that will use the ticker.

ticker [#ticker]

[`Ticker`](/jsdoc/pixi-vn/index/interfaces/Ticker)\<`TArgs`>

The ticker class to be run.

Returns [#returns-3]

`string` | `undefined`

The id of the ticker.

Example [#example-3]

```typescript
canvas.addTicker("alien", new RotateTicker({ speed: 0.2 }))
```

***

addTickersSequence() [#addtickerssequence]

\> **addTickersSequence**(`alias`, `steps`, `currentStepNumber?`): `string` | `undefined`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:259](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L259)

Run a sequence of tickers.

Parameters [#parameters-4]

alias [#alias-1]

`string`

The alias of canvas element that will use the tickers.

steps [#steps]

(`"repeat"` | [`Ticker`](/jsdoc/pixi-vn/index/interfaces/Ticker)\<`any`> | [`PauseType`](/jsdoc/pixi-vn/index/type-aliases/PauseType))\[]

The steps of the tickers.

currentStepNumber? [#currentstepnumber]

`number`

The current step number. It is used to continue the sequence of tickers.

Returns [#returns-4]

`string` | `undefined`

The id of tickers.

Example [#example-4]

```typescript
canvas.addTickersSequence("alien", [
    new RotateTicker({ speed: 0.1, clockwise: true }, 2), // 2 seconds
    Pause(1), // 1 second
    new RotateTicker({ speed: 0.2, clockwise: false }, 2),
    Repeat,
])
```

***

animate() [#animate]

Call Signature [#call-signature]

\> **animate**\<`T`>(`components`, `keyframes`, `options?`, `priority?`): `string` | `undefined`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:387](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L387)

Animate a Pixi’VN component or components using [motion's animate](https://motion.dev/docs/animate) function.
This function integrates with the PixiJS ticker to ensure smooth animations.

Pixi’VN will keep track of the animation state of this function.
So Pixi’VN will save the animation state in saves.

Type Parameters [#type-parameters-1]

T [#t]

`T` *extends* [`CanvasBaseInterface`](/jsdoc/pixi-vn/index/interfaces/CanvasBaseInterface)\<`any`>

The type of Pixi’VN component(s) being animated.

Parameters [#parameters-5]

components [#components]

`string` | `T` | (`string` | `T`)\[]

The PixiJS component(s) to animate.

keyframes [#keyframes]

`KeyframesType`\<`T`>

The keyframes to animate the component(s) with.

options? [#options-1]

`AnimationOptions`

Additional options for the animation, including duration, easing, and ticker.

priority? [#priority]

`UPDATE_PRIORITY`

The priority of the ticker.

Returns [#returns-5]

`string` | `undefined`

The id of tickers.

Default [#default-1]

```ts
UPDATE_PRIORITY.NORMAL
```

Call Signature [#call-signature-1]

\> **animate**\<`T`>(`components`, `sequence`, `options?`, `priority?`): `string` | `undefined`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:406](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L406)

Animate a Pixi’VN component or components using [motion's animate](https://motion.dev/docs/animate) function.
This function integrates with the PixiJS ticker to ensure smooth animations.

Pixi’VN will keep track of the animation state of this function.
So Pixi’VN will save the animation state in saves.

Type Parameters [#type-parameters-2]

T [#t-1]

`T` *extends* [`CanvasBaseInterface`](/jsdoc/pixi-vn/index/interfaces/CanvasBaseInterface)\<`any`>

The type of Pixi’VN component(s) being animated.

Parameters [#parameters-6]

components [#components-1]

`string` | `T`

The PixiJS component(s) to animate.

sequence [#sequence]

(`ObjectSegment`\<`T`> | `ObjectSegmentWithTransition`\<`T`>)\[]

The sequence of keyframes to animate the component(s) with.

options? [#options-2]

`SequenceOptions`

Additional options for the animation, including duration, easing, and ticker.

priority? [#priority-1]

`UPDATE_PRIORITY`

The priority of the ticker.

Returns [#returns-6]

`string` | `undefined`

The id of tickers.

Default [#default-2]

```ts
UPDATE_PRIORITY.NORMAL
```

***

canvasElementIsOnCanvas() [#canvaselementisoncanvas]

\> **canvasElementIsOnCanvas**\<`T`>(`pixiElement`): `boolean`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:187](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L187)

Check if a DisplayObject is on the canvas.

Type Parameters [#type-parameters-3]

T [#t-2]

`T` *extends* `Container`\<`ContainerChild`>

Parameters [#parameters-7]

pixiElement [#pixielement]

`T`

The DisplayObject to be checked.

Returns [#returns-7]

`boolean`

If the DisplayObject is on the canvas.

***

clear() [#clear]

\> **clear**(): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:494](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L494)

Clear the canvas and the tickers.

Returns [#returns-8]

`void`

***

completeTickerOnStepEnd() [#completetickeronstepend]

\> **completeTickerOnStepEnd**(`step`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:357](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L357)

Add a ticker that must be completed before the next step.
This method is used for example into a transition between scenes.

Parameters [#parameters-8]

step [#step]

The step that the ticker must be completed before the next step.

alias? [#alias-2]

`string`

If is a sequence of tickers, the alias of the sequence of tickers.

id [#id-1]

`string`

The id of the step.

Returns [#returns-9]

`void`

***

copyCanvasElementProperty() [#copycanvaselementproperty]

\> **copyCanvasElementProperty**\<`T`>(`oldAlias`, `newAlias`, `options?`): `Promise`\<`void`>

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:101](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L101)

Copy the properties of an old canvas element to a new canvas element.

Type Parameters [#type-parameters-4]

T [#t-3]

`T` *extends* [`CanvasBaseItemMemory`](/jsdoc/pixi-vn/index/interfaces/CanvasBaseItemMemory)

Parameters [#parameters-9]

oldAlias [#oldalias]

`string` | `T` | [`CanvasBaseInterface`](/jsdoc/pixi-vn/index/interfaces/CanvasBaseInterface)\<`T`>

Old alias

newAlias [#newalias]

`string` | [`CanvasBaseInterface`](/jsdoc/pixi-vn/index/interfaces/CanvasBaseInterface)\<`T`>

New alias

options? [#options-3]

The options of the copy.

ignoreProperties? [#ignoreproperties]

(`defaultProperties`) => `string`\[]

If provided, the properties returned by this function will not be copied from the old canvas element to the new canvas element.

Returns [#returns-10]

`Promise`\<`void`>

***

editAlias() [#editalias]

\> **editAlias**(`oldAlias`, `newAlias`, `options?`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:198](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L198)

Edit the alias of a canvas element. The tickers that are connected to the canvas element will be transferred.

Parameters [#parameters-10]

oldAlias [#oldalias-1]

`string`

The old alias of the canvas element.

newAlias [#newalias-1]

`string`

The new alias of the canvas element.

options? [#options-4]

The options of the canvas element.

ignoreTickers? [#ignoretickers]

`boolean`

If true, the tickers that are connected to the canvas element will not be transferred.

**Default**

```ts
false
```

Returns [#returns-11]

`void`

***

export() [#export]

\> **export**(): [`CanvasGameState`](/jsdoc/pixi-vn/index/interfaces/CanvasGameState)

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:502](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L502)

Export the canvas and the tickers to an object.

Returns [#returns-12]

[`CanvasGameState`](/jsdoc/pixi-vn/index/interfaces/CanvasGameState)

The object.

***

extractImage() [#extractimage]

\> **extractImage**(): `Promise`\<`string`>

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:489](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L489)

Extract the canvas as an image.

Returns [#returns-13]

`Promise`\<`string`>

The image as a base64 string.

***

find() [#find]

\> **find**\<`T`>(`alias`): `T` | `undefined`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:181](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L181)

Get a canvas element by the alias.

Type Parameters [#type-parameters-5]

T [#t-4]

`T` *extends* [`CanvasBaseInterface`](/jsdoc/pixi-vn/index/interfaces/CanvasBaseInterface)\<`any`>

Parameters [#parameters-11]

alias [#alias-3]

`string`

The alias of the canvas element.

Returns [#returns-14]

`T` | `undefined`

The canvas element.

Example [#example-5]

```typescript
const sprite = canvas.find<Sprite>("bunny");
```

***

findTicker() [#findticker]

\> **findTicker**\<`TArgs`>(`tickerId`, `args?`): [`Ticker`](/jsdoc/pixi-vn/index/interfaces/Ticker)\<`TArgs`> | `undefined`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:226](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L226)

Find a ticker by its id.

Type Parameters [#type-parameters-6]

TArgs [#targs-1]

`TArgs` *extends* [`TickerArgs`](/jsdoc/pixi-vn/index/interfaces/TickerArgs)

Parameters [#parameters-12]

tickerId [#tickerid]

`string`

The id of the ticker.

args? [#args]

`TArgs`

The args of the ticker.

Returns [#returns-15]

[`Ticker`](/jsdoc/pixi-vn/index/interfaces/Ticker)\<`TArgs`> | `undefined`

The ticker if found, undefined otherwise.

***

forceCompletionOfTicker() [#forcecompletionofticker]

\> **forceCompletionOfTicker**(`id`, `alias?`): `Promise`\<`void`>

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:373](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L373)

This method force the completion of the tickers that are running.
This funcions is called in the next step.

Parameters [#parameters-13]

id [#id-2]

`string`

The id of the ticker. If the alias provided, the id is the id of the sequence of tickers.

alias? [#alias-4]

`string`

The alias of the sequence of tickers.

Returns [#returns-16]

`Promise`\<`void`>

***

getHtmlLayer() [#gethtmllayer]

\> **getHtmlLayer**(`id`): `HTMLElement` | `undefined`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:481](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L481)

Get a HTML layer from the canvas.

Parameters [#parameters-14]

id [#id-3]

`string`

The id of the layer.

Returns [#returns-17]

`HTMLElement` | `undefined`

***

getLayer() [#getlayer]

\> **getLayer**(`label`): [`Layer`](/jsdoc/pixi-vn/index/type-aliases/Layer) | `null`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:436](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L436)

Get a layer from the canvas.

Parameters [#parameters-15]

label [#label-1]

`string`

The label of the layer.

Returns [#returns-18]

[`Layer`](/jsdoc/pixi-vn/index/type-aliases/Layer) | `null`

The layer.

Example [#example-6]

```typescript
const uiLayer = canvas.getLayer("ui");
```

***

init() [#init]

\> **init**(`element`, `options`, `devtoolsOptions?`): `Promise`\<`void`>

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:74](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L74)

Initialize the PixiJS Application and the interface div.
This method should be called before any other method.

Parameters [#parameters-16]

element [#element-1]

`HTMLElement`

The html element where I will put the canvas. Example: document.body

options [#options-5]

`Partial`\<[`ApplicationOptions`](/jsdoc/pixi-vn/index/interfaces/ApplicationOptions)> & `object`

The options of PixiJS Application

devtoolsOptions? [#devtoolsoptions]

`Devtools`

The options of the devtools. You can read more about it in the [PixiJS Devtools documentation](https://pixijs.io/devtools/docs/plugin/)

Returns [#returns-19]

`Promise`\<`void`>

Example [#example-7]

```typescript
const body = document.body
if (!body) {
    throw new Error('body element not found')
}
await canvas.init(body, {
    width: 1920,
    height: 1080,
    backgroundColor: "#303030"
})
```

***

~~isTickerPaused()~~ [#istickerpaused]

\> **isTickerPaused**(`alias`, `tickerId?`): `boolean`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:340](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L340)

Parameters [#parameters-17]

alias [#alias-5]

`string`

The alias of the canvas element that will use the ticker.

tickerId? [#tickerid-1]

`string`

The ticker that will be checked.

Returns [#returns-20]

`boolean`

If the ticker is paused.

Deprecated [#deprecated]

Use [findTicker](#findticker)(id).paused
Check if a ticker is paused.

***

onTickerComplete() [#ontickercomplete]

\> **onTickerComplete**(`tickerId`, `options`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:508](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L508)

Parameters [#parameters-18]

tickerId [#tickerid-2]

`string`

options [#options-6]

aliasToRemoveAfter [#aliastoremoveafter]

`string`\[]

ignoreTickerSteps? [#ignoretickersteps]

`boolean`

stopTicker? [#stopticker]

`boolean`

tickerAliasToResume [#tickeraliastoresume]

`string`\[]

tickerIdToResume [#tickeridtoresume]

`string`\[]

Returns [#returns-21]

`void`

***

pause() [#pause]

\> **pause**(): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:346](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L346)

Pause the rendering of gameLayer and pause currently running tickers.
Use [resume](#resume) to restore rendering and resume only
the tickers paused by this method.

Returns [#returns-22]

`void`

***

pauseTicker() [#pauseticker]

\> **pauseTicker**(`filters`): `string`\[]

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:293](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L293)

Pause a ticker. If a paused ticker have a time to be removed, it will be removed after the time.

Parameters [#parameters-19]

filters [#filters]

\{ `canvasAlias`: `string`; `tickerIdsExcluded?`: `string`\[]; } | \{ `id`: `string` | `string`\[]; }

The filters to pause the ticker.

Type Literal [#type-literal]

\{ `canvasAlias`: `string`; `tickerIdsExcluded?`: `string`\[]; }

The filters to pause the ticker.

canvasAlias [#canvasalias]

`string`

The alias of the canvas element that will use the ticker.
Will pause all tickers that are connected to this canvas element.

tickerIdsExcluded? [#tickeridsexcluded]

`string`\[]

Ticker ids excluded from the pause. If not provided, all tickers will be paused.

***

Type Literal [#type-literal-1]

\{ `id`: `string` | `string`\[]; }

The filters to pause the ticker.

id [#id-4]

`string` | `string`\[]

The id of the ticker to be paused. If provided, only this ticker will be paused.

Returns [#returns-23]

`string`\[]

The ids of the paused tickers.

***

remove() [#remove]

\> **remove**(`alias`, `options?`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:162](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L162)

Remove a canvas element from the canvas.
And remove all tickers that are not connected to any canvas element.

Parameters [#parameters-20]

alias [#alias-6]

`string` | `string`\[]

The alias of the canvas element to be removed.

options? [#options-7]

The options of the canvas element.

ignoreTickers? [#ignoretickers-1]

`boolean`

If true, the tickers that are connected to the canvas element will not be removed.

**Default**

```ts
false
```

Returns [#returns-24]

`void`

Example [#example-8]

```typescript
canvas.remove("bunny");
```

***

removeAll() [#removeall]

\> **removeAll**(): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:191](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L191)

Remove all canvas elements from the canvas.

Returns [#returns-25]

`void`

***

removeAllTickers() [#removealltickers]

\> **removeAllTickers**(): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:282](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L282)

Remove all tickers from the canvas.

Returns [#returns-26]

`void`

***

removeHtmlLayer() [#removehtmllayer]

\> **removeHtmlLayer**(`id`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:476](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L476)

Get a HTML layer from the canvas.

Parameters [#parameters-21]

id [#id-5]

`string`

The id of the layer to be removed.

Returns [#returns-27]

`void`

***

removeLayer() [#removelayer]

\> **removeLayer**(`label`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:445](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L445)

Remove a layer from the canvas.

Parameters [#parameters-22]

label [#label-2]

`string`

The label of the layer to be removed.

Returns [#returns-28]

`void`

Example [#example-9]

```typescript
canvas.removeLayer("ui");
```

***

removeTicker() [#removeticker]

\> **removeTicker**(`tickerId`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:287](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L287)

Remove a ticker by the id.

Parameters [#parameters-23]

tickerId [#tickerid-3]

`string` | `string`\[]

The id of the ticker.

Returns [#returns-29]

`void`

***

restore() [#restore]

\> **restore**(`data`): `Promise`\<`void`>

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:507](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L507)

Restore the canvas and the tickers from an object.

Parameters [#parameters-24]

data [#data]

`object`

The object.

Returns [#returns-30]

`Promise`\<`void`>

***

resume() [#resume]

\> **resume**(): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:351](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L351)

Resume the rendering of gameLayer and resume tickers that were paused by
[pause](#pause).

Returns [#returns-31]

`void`

***

resumeTicker() [#resumeticker]

\> **resumeTicker**(`filters`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:317](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L317)

Resume a ticker.

Parameters [#parameters-25]

filters [#filters-1]

\{ `canvasAlias`: `string`; } | \{ `id`: `string` | `string`\[]; }

The filters to resume the ticker.

Type Literal [#type-literal-2]

\{ `canvasAlias`: `string`; }

The filters to resume the ticker.

canvasAlias [#canvasalias-1]

`string`

The alias of the canvas element that will use the ticker.
Will resume all tickers that are connected to this canvas element.

***

Type Literal [#type-literal-3]

\{ `id`: `string` | `string`\[]; }

The filters to resume the ticker.

id [#id-6]

`string` | `string`\[]

The id of the ticker to be resumed. If provided, only this ticker will be resumed.

Returns [#returns-32]

`void`

***

transferTickers() [#transfertickers]

\> **transferTickers**(`oldAlias`, `newAlias`, `mode?`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:120](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L120)

Transfer the tickers from an old alias to a new alias.

Parameters [#parameters-26]

oldAlias [#oldalias-2]

`string`

Old alias

newAlias [#newalias-2]

`string`

New alias

mode? [#mode]

`"move"` | `"duplicate"`

If "move", the old alias will be removed from the ticker. If "duplicate", the old alias will be kept in the ticker.

Returns [#returns-33]

`void`

***

~~unlinkComponentFromTicker()~~ [#unlinkcomponentfromticker]

\> **unlinkComponentFromTicker**(`alias`, `ticker?`): `void`

Defined in: [src/canvas/interfaces/CanvasManagerInterface.ts:275](https://github.com/DRincs-Productions/pixi-vn/blob/998c1a75c5978f24c0dc137af5f42b90b2803967/src/canvas/interfaces/CanvasManagerInterface.ts#L275)

Remove a connection between a canvas element and a ticker.
And remove the ticker if there is no canvas element connected to it.

Parameters [#parameters-27]

alias [#alias-7]

`string` | `string`\[]

The alias of the canvas element that will use the ticker.

ticker? [#ticker-1]

`string` | (() => [`Ticker`](/jsdoc/pixi-vn/index/interfaces/Ticker)\<`any`>)

The ticker class to be removed.

Returns [#returns-34]

`void`

Example [#example-10]

```typescript
canvas.unlinkComponentFromTicker("alien", RotateTicker)
```

Deprecated [#deprecated-1]
