从kineticjs中的容器中获取舞台

时间:2012-11-09 16:29:52

标签: javascript html5 canvas kineticjs

我将此阶段与容器相关联:

HTML:

<div id="container">

脚本1:

var stageInFirstScript = new Kinetic.Stage({
    container: document.getElementById('container'),
    width: this.SKETCH_WIDTH,
    height: this.SKETCH_HEIGTH
});

在第二个脚本中,我需要操作刚刚创建的舞台上的形状。是否可以使用类似的东西检索stageInFirstScript?

脚本2:

var stageInSecondScript = document.getElementById('container').RetrieveExistingStage();
//now I have retrieved stageInFirstScript
//I can add shapes to it, etc....

任何帮助或替代解决方案都将不胜感激!

1 个答案:

答案 0 :(得分:2)

您应该能够简单地引用您创建的变量,即“stageInFirstScript”。但是如果这两个脚本在两个独立的范围内,请尝试将此变量设置为全局,然后像一个那样访问它,就像这样(我将在本例中使用jquery):

Script1.js:

var stageInFirstScript; // declaring global variable

$(window).load(function() {

   // assigning new stage to the global variable

   stageInFirstScript = new Kinetic.Stage({
       container: document.getElementById('container'),
       width: this.SKETCH_WIDTH,
       height: this.SKETCH_HEIGTH
   });

});

然后在script2.js:

function doSomething() {

    // accessing global variable and calling its method

    stageInFirstScript.setHeight(300); 

}

只要在定义了变量之后调用该函数,这就应该有效,在这种情况下,在加载窗口之后。

如果你想要获得任何容器的阶段,我能想到的一种方法是创建一个将动力学阶段与容器(或者它们的id)相关联的数组。