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

Jun 05, 2023


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

9 Replies
Math Notermans

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.

Math Notermans

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/