Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

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)

enter image description here

'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.

share|improve this question
add comment

2 Answers

up vote 3 down vote accepted

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: a simple sawtooth

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);

squared sawtooth

cubed sawtooth

share|improve this answer
    
Interim results say this looks good - though in my original drawing there was a small amount of time over which the pulse 'spikes' (rather than right on t = 1). Any ideas? –  codinghands Apr 7 '13 at 4:56
1  
Another way to give credit to @Miro; he already included that. Change the call to clock to input a longer period like so: var clockVal = clock(time / period); –  Seth Battin Apr 7 '13 at 5:30
add comment

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)

enter image description here

share|improve this answer
    
p(x) = x/T - floor(x/T) : ten times faster with : (x/T) % 1 . How to be sure (c*x+ d) !== 0 ? And how do you use the rationnal function ? –  GameAlchemist Apr 6 '13 at 20:40
    
@VincentPiel Modulo is usually associated with integers. Some languages may allow n % 1 to retrieve the decimal portion of the number, but it's not necessarily a good idea. And the claim that using the operator is "ten times faster" that some other operation is probably untrue. –  Seth Battin Apr 6 '13 at 21:34
    
jsperf.com/trunc-or-1/2 floor 92% slower (% 1) is faster, and valid in Javascript. The fact that it doesn't work in other languages doesn't seem like a good reason not to use it in Javascript. How to be sure (c*x+ d) !== 0 ? And how do you use the rationnal function ? –  GameAlchemist Apr 6 '13 at 21:40
    
Wow. Well, congratulations on writing proving yourself correct. –  Seth Battin Apr 6 '13 at 21:51
    
Hi Miro - thanks for your answer. As Vincent said: "And how do you use the rational function?" –  codinghands Apr 7 '13 at 4:55
show 1 more comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.