html5绘制小鱼,HTML5 Canvas 深海游弋的鱼群

JavaScript

语言：

JaveScriptBabelCoffeeScript

确定

/* ---------------- FISH "CLASS" START -------------- */

var FOLLOW_DISTANCE = 100;

var Fish = function() {

// dx/yx is current speed, ox/oy is the previous one

this.ox = this.dx = Math.random() - 0.5;

this.oy = this.dy = Math.random() - 0.5;

this.x = canvas.width * Math.random();

this.y = canvas.height * Math.random();

// A couple of helper functions, the names should describe their purpose

Fish.prototype.angleToClosestFish = function(otherFish) {

otherFish = otherFish == null ? this.following : otherFish;

if (otherFish) {

return Math.atan2(otherFish.y - this.y, otherFish.x - this.x);

} else {

return Number.MAX_VALUE;

}

}

Fish.prototype.angleFromFishDirectionToClosestFish = function(otherFish) {

otherFish = otherFish == null ? this.following : otherFish;

if (otherFish) {

return Math.abs(deltaAngle(this.angle, this.angleToClosestFish(otherFish)));

} else {

return Number.MAX_VALUE;

}

}

Fish.prototype.angleDirectionDifference = function(otherFish) {

otherFish = otherFish == null ? this.following : otherFish;

if (otherFish) {

Math.abs(deltaAngle(this.angle, otherFish.angle));

} else {

return Number.MAX_VALUE;

}

}

// Update the fish "physics"

Fish.prototype.calc = function() {

this.ox = this.dx;

this.oy = this.dy;