相关疑难解决方法(0)

HTML5/Canvas是否支持双缓冲?

我想做的是在缓冲区上绘制我的图形然后能够将其原样复制到画布上,这样我就可以做动画并避免闪烁.但我找不到这个选项.谁知道我怎么能这样做?

javascript html5 canvas double-buffering

81
推荐指数
8
解决办法
6万
查看次数

Clear Canvas Rect(但保留背景)

我正在尝试动画一个圆圈,只是水平移动它,工作正常.然而,当圆圈移动时,我必须对该圆圈执行clearRect,以便在水平方向上重新绘制它.当我做一个clearRect时,它也会使背景周围有白框,这样它就会在圆圈移动的方向上成为一条白色的水平线.

  1. 有没有办法在没有clearRect的情况下清除圆圈?
  2. 如果我必须在clearRect之后继续重新绘制背景,那么当theres说10个圆圈在那个区域移动时,画布将会闪烁.

还有其他解决方法吗?

    function drawcircle() {
        clear();    

        context.beginPath();
        context.arc(X, Y, R, 0, 2*Math.PI, false);                  
        context.moveTo(X,Y);            
        context.lineWidth = 0.3;
        context.strokeStyle = "#999999"; 
        context.stroke();

        if (X > 200)
        {
            clearTimeout(t); //stop
        }
        else
        {
            //move in x dir
            X += dX;
            t = setTimeout(drawcircle, 50);
        }
    }

    function clear() {
        context.clearRect(X-R, Y-R, 2*R, 2*R);
    }
Run Code Online (Sandbox Code Playgroud)

html drawing canvas

13
推荐指数
1
解决办法
2万
查看次数

标签 统计

canvas ×2

double-buffering ×1

drawing ×1

html ×1

html5 ×1

javascript ×1