interpolation-builder

2.1.0 • Public • Published

interpolation-builder

experimental

Using interpolation-builder you can build interpolation functions for objects and arrays. By default lerp is used but you can drop in custom interpolation functions also.

Usage

NPM

Example

var builder = require( 'interpolation-builder' );
 
var lerper = build( {
  
  x: null, // will use linear interpolation
  sub: {
 
    x: function( percentage, start, end ) {
 
      return 'value is: ' + ( ( end - start ) * percentage + start );
    }
  } 
});
 
var start = {
    
  x: 0,
  sub: {
    x: 0
  }
};
 
var end = {
    
  x: 100,
  sub: {
    x: 100
  }
};
 
console.log( lerper( 0.5, start, end ) ); // { x: 50, sub: { x: 'value is: 50' } }

Example with Objects using sub and map functions

var builder = require( 'interpolation-builder' );
 
var lerper = builder();
 
lerper.map( [ 'x', 'y' ] ) // <- use default lerp for these properties
      .map( 'z', customInterpolation1 ) // <- custom interpolation for one prop
      .map( [ 'u', 'v' ], customInterpolation2 ); // <- custom for two props
 
var start = { x: 0, y: 0, z: 0, u: 0, v: 0 };
var end = { x: 100, y: 150, z: 100, u: 100, v: 200 };
 
console.log( lerper( 0.5, start, end ) ); // { x: 50, y: 75, z: 'c1 50', u: 'c2 50', v: 'c2 100' }
 
function customInterpolation1( time, start, end ) {
 
  return 'c1 ' + ( ( end - start ) * time + start );
}
 
function customInterpolation1( time, start, end ) {
 
  return 'c2 ' + ( ( end - start ) * time + start );
}

Example with Arrays

var builder = require( 'interpolation-builder' );
 
var lerper = builder();
 
lerper.map( [ 0, 1, 2 ] ); // <- use default lerp for these properties
 
var start = [ 0, 0, 0 ];
var end = [ 100, 200, 300 ];
 
console.log( lerper( 0.5, start, end ) ); // [ 50, 100, 150 ]

Example with sub/child objects

var start = {
 
  inner: {
    x: 0,
    y: 0
  }
};
 
var end = {
 
  inner: {
    x: 104,
    y: 100
  }
};
 
var animator = interpolator();
 
animator.sub( 'inner' )
        .map( [ 'x', 'y' ] );
 
animator( 0, start, end ); // { inner: { x: 52, y: 50 } }

License

MIT, see LICENSE.md for details.

Package Sidebar

Install

npm i interpolation-builder

Weekly Downloads

114

Version

2.1.0

License

MIT

Last publish

Collaborators

  • mikkoh