html5_and_javascript_animation

if (document.createElement('canvas').getContext) {
    console.log('support')
}

if (!window.requestAnimationFrame) {
    window.requestAnimationFrame = (
        window.webkitRequestAnimationFrame ||
        window.mozRequestAnimationFrame ||
        window.oRequestAnimationFrame ||
        window.msRequestAnimationFrame ||
        function(callback) {
            return window.setTimeout(
                callback,
                1000 / 60 //每秒60帧
            )
        }
    )
}

textarea.focus()

textarea.addEventListener('keydown', function(event) {
    console.log(event.type)
}, false)

radian = angle * Math.PI / 180
angle = radian * 180 / Math.PI

Math.asin(0.5) * 180 / Math.PI //30
Math.sin(30 * Math.PI / 180) //4.999

dx = mouse.x - obj.x
dy = mouse.y - obj.y
obj.rotation = Math.atan2(dy, dx) //此处是弧度值 

function drawFrame() {
    window.requestAnimationFrame(drawFrame, canvas)

    value = cneter + Math.sin(angle) * range
    angle += speed
}

positionX = centerX + Math.cos(angle) * radius
positionY = centerY + Math.sin(angle) * radius
angle += speed

positionX = centerX + Math.cos(angle) * radiusX
positionY = centerY + Math.sin(angle) * radiusY
angle += speed

dx = x2 - x1
dy = y2 - y1
dist = Math.sqrt(dx * dx + dy * dy)