Forum Discussion

mahbag-e8b66d7e's avatar
mahbag-e8b66d7e
Community Member
2 years ago

Variables that show continuously x and y an object that is moving with motion path.


Hello. I want to see contiuously the position of an object (X and Y) that is moving with motion path in two variables and the object to go to a specific point with a specific X and Y after click on a button.please help me about javascript codes.thanks

storyline 360
  • MathNotermans-9's avatar
    MathNotermans-9
    Community Member
    2 years ago

    As Gsap is default built into Storyline360 this code would do the trick.

    var myElement = document.querySelector("[data-acc-text='someAccName']");
    var elXPos = gsap.getProperty(myElement, "x", "px");
    var elYPos = gsap.getProperty(myElement, "y", "px");
    console.log("x: "+elXPos+" | y: "+elYPos);

    Whether it works with Motion Paths has to be tested though.

    • mahbag-e8b66d7e's avatar
      mahbag-e8b66d7e
      Community Member
      2 years ago


      Hello and thanks. I will try and see if I can use Gsap in motion Path or not?

      • MathNotermans-9's avatar
        MathNotermans-9
        Community Member
        2 years ago

        You have to ensure a loop... every second or so get the updated values.

  • MathNotermans-9's avatar
    MathNotermans-9
    Community Member
    2 years ago

    When you check your console in Chrome you notice these messages:

    x: 107.667px | y: 387.753px
    story.html:1 Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause(). https://goo.gl/LdLk22
    user.js:19 x: 107.667px | y: 387.753px
    story.html:1 Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause(). https://goo.gl/LdLk22
    user.js:19 x: 107.667px | y: 387.753px

    So it is calling the function but somehow not getting the actual x/y.
    Probably due to some internal Articulate thing.

    Easiest solution would be not to use Motion Paths but Gsap.

    Use it like this...
    https://greensock.com/motionpath/

Related Content