# mat4-interpolate

> interpolates two matrices in place

Latest version **1.0.4** (published 2015-05-09) · MIT license · 23.3K weekly downloads

## Install

```sh
npm install mat4-interpolate
pnpm add mat4-interpolate
yarn add mat4-interpolate
bun add mat4-interpolate
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2015-05-09 |
| First published | 2014-12-09 |
| Weekly downloads | 23.3K |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 5 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 6 |
| Author | Matt DesLauriers |
| Maintainers | mattdesl |
| Keywords | animate, animation, matrix, mat4, gl-mat4, gl-matrix, 4x4, matrices, decompose, recompose, tween, css, style, quat, slerp, interpolate, mix |

## Links

- npm: https://www.npmjs.com/package/mat4-interpolate
- Repository: https://github.com/mattdesl/mat4-interpolate
- Issues: https://github.com/mattdesl/mat4-interpolate/issues
- npm.io page: https://npm.io/package/mat4-interpolate

## Dependencies (5)

- [gl-mat4](https://npm.io/package/gl-mat4.md) ^1.0.1
- [gl-vec3](https://npm.io/package/gl-vec3.md) ^1.0.2
- [quat-slerp](https://npm.io/package/quat-slerp.md) ^1.0.0
- [mat4-decompose](https://npm.io/package/mat4-decompose.md) ^1.0.3
- [mat4-recompose](https://npm.io/package/mat4-recompose.md) ^1.0.3

## Alternatives

- [style-dictionary](https://npm.io/package/style-dictionary.md) — 2.0M weekly downloads
- [postcss-merge-idents](https://npm.io/package/postcss-merge-idents.md) — 1.7M weekly downloads
- [@fontsource/noto-sans](https://npm.io/package/@fontsource/noto-sans.md) — 93.0K weekly downloads
- [uglifycss](https://npm.io/package/uglifycss.md) — 71.6K weekly downloads
- [@fontsource/amiri](https://npm.io/package/@fontsource/amiri.md) — 6.8K weekly downloads

## Recent versions

- 1.0.4 (latest) — 2015-05-09
- 1.0.3 — 2014-12-09
- 1.0.2 — 2014-12-09
- 1.0.1 — 2014-12-09
- 1.0.0 — 2014-12-09

## README

# mat4-interpolate

[![stable](http://badges.github.io/stability-badges/dist/stable.svg)](http://github.com/badges/stability-badges)

Interpolates between two 4x4 matrices, using algorithms from W3C Spec to produce consistent results with CSS animations. Like [mat4-interpolator](https://www.npmjs.org/package/mat4-interpolator) but does the decomposition in place. 

Translation, scale, skew and perspective are interpolated linearly, and rotation is interpolated with spherical interpolation.

```js
var mat4 = require('gl-mat4')
var start = mat4.create()
var end = mat4.fromRotationTranslation([], [0,1,0,0], [20, 50, -10])
var out = mat4.create()

//the matrix interpolator
var interpolate = require('mat4-interpolate')


//.. in your render loop
function render() {
    //interpolate based on alpha, storing results in 'out' matrix
    var vlid = interpolate(out, start, end, alpha)
    
    if (!valid) {
        //could not interpolate, you need to animate yourself somehow   
    }
}
```

## Usage

[![NPM](https://nodei.co/npm/mat4-interpolate.png)](https://nodei.co/npm/mat4-interpolate/)

#### `valid = interpolate(out, start, end, alpha)`

Interpolates between `start` and `end` matrices (16 floats in an array) and stores the result in `out`, using `alpha` for interpolation. This will decompose the two matrices into components, lerp/slerp, and then recompose.

Returns `true` is the interpolation succeeded, or `false` if either matrix is non-invertible (i.e. scale or perspective W of zero). W3C suggests falling back to discrete animations in this case.

## License

MIT, see [LICENSE.md](http://github.com/mattdesl/mat4-interpolate/blob/master/LICENSE.md) for details.

---
_Source: https://npm.io/package/mat4-interpolate · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._