Problem trying to change an object when an event happens with the markers like in detection.html

[mikesilva420]

Hi,

I`m trying to make an application with AR,js that is very similar to your detection app.

The only difference is that in your application, when a marker is not shown, or shown, you change the collor of the item on the lines in the link bellow.

{
init: function()
{
this.box = document.querySelector("#theBox");
},

tick: function (time, deltaTime) 
{
    // for convenience
    let mv = markerVisible, r = "redMarker", y = "yellowMarker", b = "blueMarker";
    
    if ( mv[r] && mv[y] && mv[b] )
        this.box.setAttribute("color", "#654321");
    else if ( mv[r] && mv[y] && !mv[b] )
        this.box.setAttribute("color", "#FF8800");
    else if ( mv[r] && !mv[y] && mv[b] )
        this.box.setAttribute("color", "purple");
    else if ( mv[r] && !mv[y] && !mv[b] )
        this.box.setAttribute("color", "red");
    else if ( !mv[r] && mv[y] && mv[b] )
        this.box.setAttribute("color", "green");
    else if ( !mv[r] && mv[y] && !mv[b] )
        this.box.setAttribute("color", "yellow");
    else if ( !mv[r] && !mv[y] && mv[b] )
        this.box.setAttribute("color", "blue");
    else // if ( !mv[r] && !mv[y] && !mv[b] )
        this.box.setAttribute("color", "gray");
}

});

But what I need to do is to change that object, like from a box to an gltf 3d item when especific markers are visible or not.
For example, I have a 3D question mark and a 3D Bear, when I have all the markers that stands for the Bear, I want it to be shown, while them are not visible, I want the question mark to be.
I have al the scenario set, my only problem is this "change", document.querySelector seems to only change attributes from a specific object but not the object.

Well, I hope I have been clear and not bothering, thanks very much for the assistance.