KineticJS创建画布

我是JavaScript/Canvas和KineticJS的新手。KineticJS创建画布

我知道这是可能创造一个帆布和这样一个阶段 -

<div id="container"></div> 
    <script src="http://www.html5canvastutorials.com/libraries/kinetic-v4.3.0-beta2.js"></script> 
    <script> 
     var stage = new Kinetic.Stage({ 
     container: 'container', 
     width: 578, 
     height: 200 
     }); 
    </script>

但我在想，如果我已经有了一张画布，我如何将创建一个阶段出来的呢？因此，像这样......

<canvas id="myCanvas"></canvas> 
<script src="http://www.html5canvastutorials.com/libraries/kinetic-v4.3.0-beta2.js"></script> 
<script> 
    //How do I create a Kinetic.stage of the #myCanvas? 
</script>

来源

2013-03-20 Joe Slater

如何：

创建一个新的阶段。

创建一个新图层。

创建一个与舞台大小相同的新图像。

将图像的图像源设置为myCanvas。

注：我没有测试下面的代码，但它应该+/- +/-调整。

var myCanvasImg=new Kinetic.Image({ 
     x: 0, 
     y: 0, 
     image: document.getElementById("myCanvas").getContext("2d").toImageURL(), 
     width: stage.getWidth(), 
     height: stage.getHeight() 
    });

将图像添加到图层并将图层添加到舞台。

Bang ... myCanvas内容的新舞台！

来源

2013-03-20 20:18:49 markE

我想你误会了我。我正在寻找初始化我的Kinetic Stage，但不是创建舞台到容器div中，我不想创建它，而是给它一个名为myCanvas的现有画布。我不认为答案会如此复杂，只是我是一个新手而不是恰当地解答问题。为此说。如果你不明白我在说什么，请问澄清。 – 2013-03-20 20:23:26

注意：myCanvas空闲。这不是我想要将它的内容复制到舞台上。 – 2013-03-20 20:27:54

一点也不复杂......不能像KineticJS那样按照你的建议来完成！好吧，不是没有拉开源代码;） – markE 2013-03-20 20:32:35

KineticJS创建画布

回答

相关问题