Animating a background 'pulse' with easing equation

Question

I'm trying to find a suitable easing equation (or other method) to animate an object so that it 'pulses' (imagine a 'spike' on a music visualiser, or see the image I drew badly below)

'v' is the value I'm using to scale. 't1' and 't2' mark the end of a single pulse.

The game I'm working on is a puzzler, but I'd like to have objects in the background pulse in time with user-selected music.

I'm sure it's just a case of knowing what to search for, but any advice would be appreciated on how best to achieve this.

Answer 1

My answer is similar to Miro's, but I think the Math ought to be a lot simpler. Of course, the details of your curve make all the difference. If you don't care precisely what the curve looks like, then all you need is the basic sawtooth.

var clock = function(x) {
  return (1-x) - floor(1-x);  //I like this method, though not the simplest.
}

var clockVal = clock(time);

That yields:

If you want to make it more curvy, raise it to some power:

var clockVal = Math.pow(clock(time), 2);
var clockVal = Math.pow(clock(time), 3);

Answer 2

I assume that you want to create periodic function so you need to periodize x:

p(x) = x/T - floor(x/T)

Then you'll create rational function from two linear functions.

f(x) = ( a*x + b ) / ( c*x + d )

You've got 2 points [0,V], [1,0] and together you have:

f(x) = (V - V * p(x)) / (1 + p(x) * shape)