MathUtils.lerp()

The MathUtils.lerp() method is a function of the Three.js library that performs linear interpolation between two values. This interpolation is based on a third parameter, t, which is a value between 0 and 1.

Syntax

MathUtils.lerp(x, y, t);

Parameters

• x: The starting value.
• y: The ending value.
• t: The interpolation factor.

Return value

The interpolated value between x and y based on the interpolation factor t.

Examples

Example 1

let x = 0;
let y = 100;
let t = 0.5;

let result = MathUtils.lerp(x, y, t);

console.log(result); // Output: 50

In this example, x is the starting value (0), y is the ending value (100), and t is the interpolation factor (0.5). When MathUtils.lerp() is called, it returns the interpolated value (50).

Example 2

let x = {x: 0, y: 0};
let y = {x: 100, y: 100};
let t = 0.25;

let result = {
  x: MathUtils.lerp(x.x, y.x, t),
  y: MathUtils.lerp(x.y, y.y, t)
};

console.log(result); // Output: {x: 25, y: 25}

In this example, x and y are two points in a 2D space. The MathUtils.lerp() method is used to interpolate between these two points based on the interpolation factor t (0.25). The interpolated point is returned as an object with x and y values.

Conclusion

The MathUtils.lerp() method is a simple yet powerful tool for linear interpolation between two values. It can be used to create smooth transitions between values, to animate objects or to calculate the position of objects in 2D or 3D spaces.