How can I convert canvas which playing live video into Laya.Sprite?

[sithu-go]

I want to convert html canvas which playing live stream video into Laya.Sprite.
Video can play well in canvas, but laya itself create it's canvas.
so the problem I'm encountering is my html canvas is overlapped by laya default canvas.
That's why I'm finding a way to convert HTMLCanvasElement into Laya.Sprite.

Here's my code

const { regClass, property } = Laya;

@regClass()
export class ExamplePlayerScript extends Laya.Script {
    player: NodePlayer
    sprite: Laya.Sprite

    onEnable(): void {

        NodePlayer.load(() => {

            this.player = new NodePlayer();

            this.startVideo()

            // Create a Laya.Sprite
            this.sprite = new Laya.Sprite();
            this.sprite.width = 800
            this.sprite.height = 600
            this.owner.addChild(this.sprite);

            // Get a reference to HTML canvas
            const canvas = document.getElementById('video') as HTMLCanvasElement;

            canvas.width = 800
            canvas.height = 600

            const canvasContext = canvas.getContext('2d')

            const texture2D = new Laya.Texture2D(canvas.width, canvas.height, Laya.TextureFormat.R8G8B8A8, true, false)

            const texture = new Laya.Texture(texture2D, [0, 0, 1, 1], texture2D.width, texture2D.height);
            texture.bitmap = texture2D; // Set the bitmap data to Texture2D            

            this.sprite.graphics.drawTexture(texture, 0, 0, canvas.width, canvas.height); // Draw the texture on the sprite

        })


    }

    startVideo() {
        this.player.setView("video", true);

        this.player.setBufferTime(1000);

        this.player.on("stats", (stats) => {
            console.log("player on stats=", stats);
        })

        this.player.enableVideo(true)

        this.player.start("http://localhost:8000/live/strange.flv")
    }
}