import Vector from './vector.mjs'; const boidShape = [ new Vector(2, 0), new Vector(-1, 1), new Vector(-1, -1), new Vector(2, 0), ]; const boidShapeSize = boidShape.length; const transformed = new Vector(0, 0); export const boids = (activeBoids, params, ctx, width, height, center) => { const boidsSize = activeBoids.length; ctx.clearRect(0, 0, width, height); // // Draw each boid’s 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 boid’s 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 boid’s head following the angle of its course ctx.beginPath(); ctx.fillStyle = 'black'; for (let i = 0; i < boidsSize; ++i) { const boid = activeBoids[i]; const angle = boid.vel.angle(); let isFirst = true; for (let j = 0; j < boidShapeSize; ++j) { transformed.x = boidShape[j].x; transformed.y = boidShape[j].y; transformed .rotate(angle) .mul(params.radius) .add(center) .add(boid.pos); if (isFirst) { ctx.moveTo(transformed.x, transformed.y); isFirst = false; } else { ctx.lineTo(transformed.x, transformed.y); } } } ctx.fill(); };