KineticJS：向图层添加形状并绘制几乎崩溃浏览器答案

【问题标题】：KineticJS: Add shape to layer and draw almost crashes browserKineticJS：向图层添加形状并绘制几乎崩溃浏览器
【发布时间】：2014-07-13 08:37:56
【问题描述】：

我对@987654321@ 和 KineticJS 还是很陌生。

我尝试过 KineticJS，因为我在谷歌上搜索不同问题的答案时偶然发现了它几次，发现它对我正在制作的 2D 游戏很有用。

游戏是驾驶游戏，但汽车的行为像蛇，但长度无限。我的概念证明适用于 vanilla canvas，但是当我使用 KineticJS 层并添加形成蛇形的形状时，浏览器在 20-30 秒后几乎崩溃......

我有一个汽车图层：

var carLayer = new Kinetic.Layer();
stage.add(carLayer);

我每 10 毫秒获取汽车的方向，并在图层上绘制一个新圆圈：

var drawCarPoint = function(x, y) {
    var newCarSection = new Kinetic.Circle({
        x: x,
        y: y,
        radius: 5,
        fill: 'magenta'
    });

    carLayer.add(newCarSection);
    carLayer.drawScene();
};

如果我不使用drawScene() 函数，则不会绘制任何内容。

我做错了什么？

【问题讨论】：

标签： javascript canvas html5-canvas kineticjs

【解决方案1】：

我认为您可能需要在每次向图层添加圆圈时绘制舞台。那么，您是否尝试将carLayer.drawScene() 替换为以下内容：

stage.add(carLayer);
stage.draw();

【讨论】：