I am trying to draw birds whose wings oscillate based on their velocity. Simply put, the faster my birds fly, the faster their wings should oscillate.
My complete code is below and it doesn't do what I want. What I've done to create the oscillation is make flyingFactor
vary based on the magnitude of velocity
in my displayAndMoveWings
function. However when I draw
everything I find that, because velocity
changes all the time (i.e. triggered by the random acceleration
force in the draw
function), so does flyingFactor
and means that my birds' wings don't oscillate at all and look very buggy.
Any way to make it work? I want my birds' wings to look like they naturally oscillate, only faster and slower as my birds accelerate or decelerate.
Thank you so much in advance!
angleMode = "degrees";
var Bird = function(m,x,y){
this.mass = m;
this.position = new PVector(x,y);
this.velocity = new PVector(0,0);
this.acceleration = new PVector(0,0);
};
Bird.prototype.applyForce = function(force) {
var f = PVector.div(force, this.mass);
this.acceleration.add(f);
};
Bird.prototype.update = function() {
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
this.acceleration.mult(0);
this.velocity.limit(3);
};
Bird.prototype.displayAndMoveWings = function() {
this.start=-110;
this.stop = this.start + 110;
this.flyingFactor=cos(360+frameCount*this.velocity.mag()*10)*20;
stroke(0, 0, 0);
strokeWeight(2);
noFill();
arc(this.position.x,this.position.y,this.mass,this.mass,this.start-this.flyingFactor,this.stop-this.flyingFactor);
arc(this.position.x+this.mass,this.position.y,this.mass,this.mass,this.start+this.flyingFactor-70,this.stop+this.flyingFactor-70);
};
Bird.prototype.checkEdges = function() {
if (this.position.x > width) {
this.position.x = 0;
} else if (this.position.x < 0) {
this.position.x = width;
}
if (this.position.y > height) {
this.position.y = 0;
} else if (this.position.y < 0) {
this.position.y = height;
}
};
var bird1 = new Bird(15, width/2, height/2);
var draw = function() {
background(255, 255, 255);
bird1.update();
bird1.displayAndMoveWings();
var randomAcceleration = new PVector(random(-3,3),random(-3,3));
bird1.checkEdges();
bird1.applyForce(randomAcceleration);
};
I think I may have found a hack... Before my
displayAndMoveWings
function I created a new global variable calledwhatIsVelocity
. Then indisplayAndMoveWings
I wrote the following:Effectively what this does is pull the velocity every 60 frames (approximately 2 seconds) and introduces that velocity into
flyingFactor
, meaning that it doesn't get recalculated every frame like in my previous code above. Not super pretty but it achieves my purpose.