Object3d scale and translate simultaneously

Questions
,
1

given a simple mutation function that gets an Object3d as an argument and translates it or scales it along X axis:

function mutate(object: Object3d, mutation: "scale" | "translate", value: number) {
   if (mutation === 'scale') {
      object.scale.x = 1 + value;
   }
   if (mutation === 'translate') {
      object.position.x = value;
   }
}

I want to translate two objects along X-axis based on user input from <input type="range" onChange={onChange}/> like so:

const firstObject: Object3d;
const secondObject: Object3d;

function onChange(value: number) {
    //move first object
    mutate(firstObject, "translate", value);
    //scale second object
    mutate(secondObject, "scale", value;
    //move second (scaled) object
    mutate(secondObject, "translate", value;
}

Initially my expected result was two objects that are moving along X-axis side by side, but the second one gets bigger the further they go to the right.

I know now that when I use Object3d.scale then I’m also changing the way translation works for that object (if I scale an object two times then the same translation will move it twice as far).

How could I get the result I want? I want to have a scene with two objects side by side and one gets larger than the other while they both translate at the same speed.

2

This behaviour (both move together, but one gets bigger) sounds exactly like what you want:

And the code above does exactly this - both objects are moved, but one gets bigger along the axis of motion.

I do not know the actual range of values for value, but the change of size might be too drastic if, for example, value∈ [0,100].

BTW scaling should not affect the translation speed of the center of the object, but might confuse you if you look at the sides of the object.

Here is an illustration - both objects move together (see the dashed lines) but because the size of the red object changes, it may be perceived as if it is moving faster, because its front side moves faster. This is just a hypothesis what you might experience.

image
image645×378 7.75 KB

3 Likes
3

you could compensate the appropriate translation offset for the scaled object in one of two ways…

1: translate the objects’ geometries by half their width before moving the objects eg… firstObject.geometry.translate(objSize / 2,0,0 ) and then accounting for this offset when moving the object to re-centre the mesh eg… object.position.x = value - (objSize / 2)

2: move the scaled object subtracting the (mesh.scale.x -1) / 2 from the translation value eg… object.position.x = value + ((object.scale.x - 1) / 2 );

I put together a pen that demonstrates both approaches by toggling the “translate geometry” switch hopefully you should be able to take what you need from this…

https://codepen.io/forerunrun/full/VYaEBQR

1 Like
4

Thank you !

This is exactly what i was misunderstanding.

For some reason all AI’s i ‘consulted’ were very confident that when one changes the scale of an object the perceived speed of translation is directly proportional to its scale. This turns out to be a complete hallucination…

Great image example @PavelBoytchev
Thank You @Lawrence3DPK for the code example

Have a great day!

1 Like