[SOLVED] Set position of one entity to the position of another entity?

I have a row of menu buttons, when one is clicked I have a marker that highlights that button to help indicate that section is currently active.

In the scripting I’m familiar with, that code would look like:

this.sctn_Mark.x = this.Nav1_Button.x;

My guess is it’s a more complex operation for this platform, I’m not having much luck figuring it out, any helpful hints would be welcome.

Thanks!

Hi @Jeffery.Wright,

To set the position of an entity you use the following method:

myEntity.setPosition(0.5, 1.0, 0.0);

To have that entity match the position of another entity:

entityA.setPosition( entityB.getPosition()); 

For entities that use element components and belong to a UI group/screen, usually we use setLocalPosition/getLocalPosition instead.

Thanks!

These elements are in the 2D Screen so I used the script:

sctn_Mark.setLocalPosition(Nav1_Button.getLocalPosition());

…which produced the error:

Uncaught ReferenceError: sctn_Mark is not defined

In your code example, is “entityA” the example entity Name or a variable defined with other code somehow?

Thanks, again!

Good, yes it’s a variable defined elsewhere to get a reference to a scene entity. If sctn_Mark is the name of your entity you can do the same like this:

var sctn_Mark_entity = this.app.root.findByName('sctn_Mark');

So the complete code in my case would be:

var sctn_Mark = this.app.root.findByName('sctn_Mark');
var Nav1_Button= this.app.root.findByName('Nav1_Button');
sctn_Mark.setLocalPosition( Nav1_Button.getLocalPosition());

…which now works, thanks!

Is there a method to add easing to the abrupt transition from one position to another using deltaTime similar to the scaling method mention on the Manipulating Entities tutorial page, for a case like moving an entity to another entity’s position?

this.timer += deltaTime;
var s = Math.sin(this.timer) + 1;
entity.setLocalScale(s, s, s);

Thanks!

So yes, you can use the script update method to increment a timer and then use the .lerp method available on the pc.Vec3 class. Though there is an easier option that supports also a big number of easing curves, that is the Playcanvas Tween library. You can study here how it works:

https://developer.playcanvas.com/en/tutorials/tweening/