Zim Three z-index question

I set threeSpace a zIndex in web app,no problem.

but when I add a line code app break

var textureActives = new TextureActives([], THREE, threeSpace, threeSpace.renderer,threeSpace.scene,threeSpace.camera,null, null);

three zIndex problem bug

<!DOCTYPE html>
<html lang="zh-cn">

    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width">
    <meta name="force-rendering" content="webkit">

    <title>test three zIndex</title>
    <script type="module">
        import zim from "https://zimjs.org/cdn/015/zim_three.js";
        import physics from "https://zimjs.org/cdn/015/zim_physics.js";
        // HTML message overlay
        const note = document.createElement("div");
        var cssText = `
                                        font-size:20px; color:#fff; 
                                        text-align:center;vertical-align: middle; 
                                        font-family:verdana; position:absolute;
        note.setAttribute("onmouseover", "this.style.backgroundColor='green';");
        note.setAttribute("onmouseout", "this.style.backgroundColor='#f33a';");
        note.setAttribute("style", cssText);

        note.innerHTML = `start`;
        note.onclick = function () {
            if (frame01) frame01.dispose();
            var event = new Event("build");
            (e) => {
                frame01 = new Frame('fit', 1024, 768, light.toAlpha(.4), dark, readyTest01, 'canvas.jpg', 'assets/test01/');
        var frame01,frame02    
        function readyTest01(F, S) {
            new Circle(150,clear,blue,10).center()
            frame02=new Frame(FIT, 800, 760, orange, null, readyTest02);
            function readyTest02(bgF, bgS) {
                bgF.canvas.style.zIndex = -20;
                var tag = new Tag({ width: 300, height: 400, backgroundColor: "#f00a" }).center(bgS).mov(-300, -50);
                var threeSpace = new Three({
                    width: 200,
                    height: 400,
                    color: 0x0000ff,
                    cameraPosition: new THREE.Vector3(0, 0, 250)

                var canvas = threeSpace.canvas
                var elm = threeSpace.DOMElement
                //var textureActives = new TextureActives([], THREE, threeSpace, threeSpace.renderer,threeSpace.scene,threeSpace.camera,null, null);

        } //end bgF_Ready function


        body {
            margin: 0px;
    <meta name="viewport" content="width=device-width, user-scalable=no" />



This is as expected and not related to z-index. When you add TextureActives, everything in the ZIM frame is hidden. The only things that will be seen are TextureActive objects - and those will be shown on the three.js materials when set properly.

You can then see the ZIM frame by pressing the T key. So if you press the T key then you see the circle again. But, you should not have anything on the stage other than TextureActive objects. TextureActive is a system to display ZIM objects on three.js materials. Not a system to show ZIM in general. That is when you do not use TextureActives and the three.js is overlayed on ZIM.