HTML and CSS Reference
In-Depth Information
Simple spring, short form
vx += (targetX - object.x) * spring;
vy += (targetY - object.y) * spring;
object.x += (vx *= friction);
object.y += (vy *= friction);
Offset spring
var dx = object.x - fixedX,
dy = object.y - fixedY,
angle = Math.atan2(dy, dx),
targetX = fixedX + Math.cos(angle) * springLength,
targetY = fixedY + Math.sin(angle) * springLength;
//spring to targetX, targetY as above
Chapter 9
Distance-based collision detection
//starting with objectA and objectB
//if using an object without a radius property,
//you can use width or height divided by 2
var dx = objectB.x - objectA.x,
dy = objectB.y - objectA.y,
dist = Math.sqrt(dx * dx + dy * dy);
if (dist < objectA.radius + objectB.radius) {
//handle collision
}
Multiple-object collision detection
objects.forEach(function (objectA, i) {
for (var j = i + 1; j < objects.length; j++) {
//evaluate reference using j. For example:
var objectB = objects[j];
//perform collision detection between objectA and objectB
}
});
Chapter 10
Coordinate rotation
x1 = x * Math.cos(rotation) - y * Math.sin(rotation);
y1 = y * Math.cos(rotation) + x * Math.sin(rotation);
