Move an Object 3D away from other an object

Questions
1

Hi All,
So my goal is to animate Object2, Object3, and Object4 away from a point (x1,y1,z1). Hopefully this image clears it up what I am trying to achieve. I want to radially move away from (x1,y1,z1). What are the different ways of going about it. PS: I am fairly new to three.js and using Forums. :sweat_smile:

image
image881×703 31.8 KB

2

This remembers me in context of game development at the Flee steering behavior. Meaning you can compute the subtraction between let’s say object2 and object1, normalize this vector and then scale it with the desired speed which will produce the desired velocity and force. If you apply this force to object2, it will produce the impression of fleeing from object1. You can check out this approach here:

You not necessarily need an additional library for this. With the above computations, you should be able to implement something useful with a few lines of code.

1 Like
3

This solution is to complicated for me to understand. So you mean to imply that:

  1. First apply resultVector.subVectors(obj2-obj1).normalize();
  2. resultVector.multiplyScalar(scalar);

I dont understand after this. Can you pls help me out here? Thanks in advance!

4

This is not the way how the API is used. It’s not even meaningful JavaScript code.

Have you considered to study a book for three.js beginners? E.g.

https://threejsfundamentals.org/ or https://discoverthreejs.com/

With more basic understanding of the API, it will be easier for you to understand what people are going to explain in this forum.

5

@Mugen87 Apologies for the poorly framed question. I did go through the three.js fundamentals. Let me try to be more clear this time. I have a point P1(x1,y1,z1) (Note that P1 is not located at the origin) and I have another Object3D by name obj1 with bounding box center at P2(x2,y2,z2). My goal is move this Object3D away from P1(x1,y1,z1). I’ve several other Objects So my approach has till now has been:

var bbox = new THREE.Box3();

bbox.expandByObject(obj1);

var bbBoxCenter = new THREE.Vector3();

bbox.getCenter(bbBoxCenter);



var direction = new THREE.Vector3();

direction.subVectors(bbBoxCenter, point).normalize();

renderer.setAnimationLoop(function () {

    obj1.translateOnAxis(direction, 0.01);

})

The above approach doesn’t seem to work because the object isn’t animating away from P1 but rather appears to move towards P1. Hope I am clear now. Thanks in advance!