javascript - Canvas 上基于文本的倒计时

Question

我想在 Canvas 上运行文本倒计时，但最后我检查了无法将文本写入 Canvas 。

我想知道是否有其他人遇到过可以在 Canvas 上从 60 到 0 进行数字倒计时的实现。

Answer 1

$(function () {
    var width = 200;
    var height = 200;
    $('canvas').width(width).height(height);
    var ctx = $('canvas')[0].getContext('2d');
    var i = 60;
    (function draw() {
        with(ctx) {
            fillStyle = '#000';
            fillRect(0, 0, width, height);
            fillStyle = '#0f0';
            font = 'bold 20px Arial';
            fillText(i, 100, 50)
            fill();
        }
        if (!(i--)) return;
        setTimeout(draw, 1000);
    })();
});

see in action