Skip to main content
HSS Sursee
HSS Sursee
Known Participant
Jul 10, 2023 12:34 PM UTC
Answered

Starting elements on HTML canvas

I am building a HTML-File with an interactive map. When I am starting or testing the File it always shows me all of the elements I have on the canvas. How can I define what elements I want to be shown at my starting point?

 

I uploaded 2 pictures, one how I want it to look and the other how it is at the moment.

 

Thank you in advance for all the Help.

    This topic is closed to new replies. Start a new post to keep the conversation going.
    kglad
    kgladCorrect answer
    Community Expert
    Jul 10, 2023 1:38 PM UTC

    use the visible property to toggle objects on and off.  eg, 

     

    this.t1.visible=false; // a text object

    this.e1.addEventListener("mouseover",overF1.bind(this));  // e1 a hotspot object

    this.e1.addEventListener("mouseout",outF1.bind(this));

    function overF1(){

    this.t1.visible = true;

    }

    function overF1(){

    this.t1.visible = false;

    }

     

    and, if you have 50 of these, you can use a for-loop to quickly/easily encode them all.

    View reply

    11 replies

    kglad
    Community Expert
    kgladCommunity ExpertCorrect answer
    Community Expert
    Jul 10, 2023 1:38 PM UTC

    use the visible property to toggle objects on and off.  eg, 

     

    this.t1.visible=false; // a text object

    this.e1.addEventListener("mouseover",overF1.bind(this));  // e1 a hotspot object

    this.e1.addEventListener("mouseout",outF1.bind(this));

    function overF1(){

    this.t1.visible = true;

    }

    function overF1(){

    this.t1.visible = false;

    }

     

    and, if you have 50 of these, you can use a for-loop to quickly/easily encode them all.

    Translate
    HSS Sursee
    HSS SurseeAuthor
    Known Participant
    Jul 12, 2023 2:41 PM UTC

    Hello

    I am working with the visible property for my objects. But I was only able to link it with an action.

    My problem is, that when I start the file all objects are still visible and only by clicking the button they turn invisible.

    How can I evade that or where do I need to add the code to make the objects invisible?

     

    Thank you in Advance for your help.

    Translate
    kglad
    Community Expert
    kgladCommunity Expert
    Community Expert
    Jul 12, 2023 2:52 PM UTC

    the first line of my suggested code shows one way to do that.

    Translate
    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices