I an new to Twincat3 and Javascript. Would like to create translate animation for image.
The layout can refer to below image. The location of orange cubes are fix, while green cube is the moving image.
enter image description here

Below are the concept for the animation.
1.Moving of green cube is triggered by moving bit from PLC, while the moving destination is send by the integer variable (1-10) from PLC
2.The script shall be able to read current location of green cube and location of destination (orange cube), and calculate the movement px for animation to reach destination.

Currently I having difficulties in getting below info for javascript execution:

1. Get current location of green cube and destination
2. Bind PLC variable to javascript and get the value inside the PLC variable
3. Declare function in javascript

Below is the script i edited from the sample get from Beckhoff Infosys:

var data = TcHmi.Symbol.readEx2('%s%PLC1.MAIN.yardGate.x2%/s%', function (data) {
    if (data.error === TcHmi.Errors.NONE) {
        // Handle result value... 
        var value = data.value; 
        console.log(value); 
    } else {
      // Handle error... 
  }
});

But when go to live view, show error data is not define.
Hope can get advice from members.

Thanks

Below are the concept for the animation.
1.Moving of green cube is triggered by moving bit from PLC, while the moving destination is send by the integer variable (1-10) from PLC
2.The script shall be able to read current location of green cube and location of destination (orange cube), and calculate the movement px for animation to reach destination.

Currently I having difficulties in getting below info for javascript execution:

1. Get current location of green cube and destination
2. Bind PLC variable to javascript and get the value inside the PLC variable
3. Declare function in javascript

Below is the script i edited from the sample get from Beckhoff Infosys:

var data = TcHmi.Symbol.readEx2('%s%PLC1.MAIN.yardGate.x2%/s%', function (data) {
    if (data.error === TcHmi.Errors.NONE) {
        // Handle result value... 
        var value = data.value; 
        console.log(value); 
    } else {
      // Handle error... 
  }
});