Make radius an actual radius

This commit is contained in:
Mattéo Delabre 2020-05-04 18:29:00 +02:00
parent 9c9afa2409
commit becafed267
Signed by: matteo
GPG Key ID: AE3FBD02DC583ABB
2 changed files with 7 additions and 67 deletions

View File

@ -1,81 +1,21 @@
import Vector from './vector.mjs'; import Vector from './vector.mjs';
const boidShape = [ const boidShape = [
new Vector(2, 0), new Vector(1, 0),
new Vector(-1, 1), new Vector(-.5, .5),
new Vector(-1, -1), new Vector(-.5, -.5),
new Vector(2, 0), new Vector(1, 0),
]; ];
const boidShapeSize = boidShape.length; const boidShapeSize = boidShape.length;
const transformed = new Vector(0, 0); const transformed = new Vector(0, 0);
export const boids = (activeBoids, params, ctx, width, height, center) => export const fill = (activeBoids, params, ctx, width, height, center) =>
{ {
const boidsSize = activeBoids.length; const boidsSize = activeBoids.length;
ctx.clearRect(0, 0, width, height); ctx.clearRect(0, 0, width, height);
// // Draw each boids visibility and proximity zones
// ctx.beginPath();
// ctx.fillStyle = '#BBEE94';
// for (let boid of activeBoids)
// {
// const trans = boid.pos.add(center);
// ctx.moveTo(
// trans.x + params.visibleDist,
// trans.y
// );
// ctx.arc(
// trans.x, trans.y,
// params.visibleDist,
// 0, 2 * Math.PI
// );
// }
// ctx.fill();
// ctx.stroke();
// ctx.beginPath();
// ctx.fillStyle = '#EE9495';
// for (let boid of activeBoids)
// {
// const trans = boid.pos.add(center);
// ctx.moveTo(
// trans.x + params.closeDist,
// trans.y
// );
// ctx.arc(
// trans.x, trans.y,
// params.closeDist,
// 0, 2 * Math.PI
// );
// }
// ctx.fill();
// ctx.stroke();
// // Draw each boids velocity vector
// ctx.beginPath();
// ctx.strokeStyle = 'rgba(0, 0, 0, 0.5)';
// for (let boid of activeBoids)
// {
// const start = boid.pos.add(center);
// const end = start.add(boid.vel.mul(0.25));
// ctx.moveTo(start.x, start.y);
// ctx.lineTo(end.x, end.y);
// }
// ctx.stroke();
// Draw each boids head following the angle of its course // Draw each boids head following the angle of its course
ctx.beginPath(); ctx.beginPath();
ctx.fillStyle = 'black'; ctx.fillStyle = 'black';

View File

@ -12,7 +12,7 @@ const params = {
closeDist: 20, closeDist: 20,
visibleDist: 80, visibleDist: 80,
radius: 5, radius: 10,
}; };
const boidsCanvas = document.querySelector('#boids-canvas'); const boidsCanvas = document.querySelector('#boids-canvas');
@ -58,7 +58,7 @@ const loop = time =>
lastTime = time; lastTime = time;
boids.update(activeBoids, params, delta); boids.update(activeBoids, params, delta);
draw.boids(activeBoids, params, boidsCtx, width, height, center); draw.fill(activeBoids, params, boidsCtx, width, height, center);
requestAnimationFrame(loop); requestAnimationFrame(loop);
}; };