The purpose
Displays an image set in an img element onto a Phaser 3 scene.
usage example
As described in the following article, performing a screen capture returns an image as an img element.
To display the screen-captured image, you need to follow the method outlined in this article.
Implementation
A Texture is created from the image element as follows.
Frames are added to the Texture using the add() method. The created Texture can then be added to the scene as an image.
let image // this is image element // for example get by document.getElementById(), snapshot
let texture = new Phaser.Textures.Texture(this.textures, "resultimage", image);
texture.add("frame", 0, 0, 0, image.width, image.height);
this.add.image(width, height , texture)Result
We are able to render the image set in the img element onto the Phaser 3 game.
Reference
Textures - Notes of Phaser 3
rexrainbow.github.io
comment