暂停和恢复HTML5画布？

有没有办法让HTML5 Canvas暂停/恢复？暂停和恢复HTML5画布？

说我的代码：

// Draw lines with decreasing widths 
for (i = 20; i > 0; i--) 
{ 
    var v=i*20 
    ctx.strokeStyle = "rgb("+v+", "+v+", "+v+")"; 
    ctx.lineWidth = i; 
    ctx.beginPath(); 
    ctx.moveTo(55, 20 + (20 - i) * 24); 
    ctx.lineTo(335, 20 + (20 - i) * 24); 
    ctx.stroke(); 
}

在代码的开始，我想暂停（）的意思，我会告诉浏览器“确定你真的没有浪费做任何的任何资源实际绘制“，我只是要告诉你的命令。然后循环后，我会打电话Resume（）意思是“好吧，你可以开始画他们现在”

btw没有人知道是否有一个JavaScript的上下文对象的完整引用（我无法在谷歌找到它也没有MDC ..）

来源

2011-05-31 Pacerier

上下文对象的完整引用在这里：http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html – 2011-05-31 15:12:24

@Simon Sarris thxalot – Pacerier 2011-06-01 08:45:22

尝试绘制的线条屏幕外，而不是“暂停”画布：http://kaioa.com/node/103

这将有同样的结果。

var renderToCanvas = function (width, height, renderFunction) { 
    var buffer = document.createElement('canvas'); 
    buffer.width = width; 
    buffer.height = height; 
    renderFunction(buffer.getContext('2d')); 
    return buffer; 
};

（从上面提到的网页采取代码段），我已经解决了资源使用的这个问题时，什么也没有发生

来源

2011-05-31 05:28:32 rdmueller

一种方式是通过设置VAR isStarted = FALSE;

然后根据动画是否有动画来打开和关闭它。

然后使用VAR来控制你的setTimeout/requestAnimFrame

if (isStarted) { 
    setTimeout(function() {}, 1000/33);// animation loop thing 
}

我这样做是为了一个游戏环境我开始建立和它完美的作品。

来源

2011-11-16 04:30:43 jaredwilli

暂停和恢复HTML5画布？

回答

相关问题