Skip to content

PixiJS Canvas

drawing

Pixi’VN uses PixiJS to render the visual novel. You can use the Pixi’VN API to add images, text, and animations to the canvas.

What is PixiJS?

PixiJS is a rendering engine that allows you to create rich, interactive graphics and animations. It is used in games like Good Pizza, Great Pizza and The Enchanted Cave 2.

PixiJS is a powerful tool for creating games and interactive experiences. It is fast, flexible, and easy to use. You can learn more about PixiJS on the PixiJS website.

It is perfect for creating visual novels because it allows you to easily add images, text, and animations to the canvas.

How use PixiJS in Pixi’VN?

Use PixiJS Canvas in Pixi’VN is very similar to use PixiJS in a normal project. The only differences are as follows:

  • A new element called CanvasImage has been added, it simplifies the process of adding images to the canvas and the ability to use transitions to add and remove images.
  • You do not have direct access to PIXI.Application, but you need to use canvas.
  • You cannot use PixiJS Components and Tickers directly, but other components and Tickers that are equivalent to PixiJS ones.
  • You can't set a listener with the on method, but must use the onEvent to add a listener.

Use PixiJS DevTools with Pixi’VN

PixiJS DevTools is a Chrome extension that allows you to inspect and debug PixiJS applications. You can use it to view the display list, inspect textures, and debug your PixiJS application. You can use it with Pixi’VN to inspect the canvas and debug your visual novel.

devtools

For access to the PixiJS DevTools after installing it, you need to open the Chrome DevTools (F12) and go to the PixiJS tab.

image