Kinetijs:无法为数组元素创建Text对象

Question

我现在尝试了一段时间，在谷歌上搜索了很多，但总是会抛出一个错误：

我想创建一个用于在其中写入名称的数组：

function writeNames(){
 names = new Array();
 for (i = 0; i <= 15; i++){
    names[i] = new Kinetic.Text();
    names[i].x(100 * i);
    names[i].y(100 * i);
    names[i].text("Name " + (i+1));
    names[i].fontSize(10);
    names[i].fontFamily("Lucida Sans Unicode");
    names[i].fill("black");
  }
}

但每次我调用这个函数时，我都会得到错误"无法读取未定义的属性'width'"，就好像什么都没有初始化一样。

例如，我正在创建Kinetic.Image和Kinetic.Line这样的对象，没有任何麻烦。

有什么想法吗？为什么它不适用于文本对象，或者我在这里做错了什么？

Answer 1

问题似乎是无法创建空的Text形状。Text形状构造函数需要设置Text属性或width属性。在构造过程中，Kinetic使用任一属性来确定形状的宽度。

var text = new Kinetic.Text();

将导致您收到的错误。然而

var text = new Kinetic.Text({text: 'hello'});

或

var text = new Kinetic.Text({width: 100});

将解决您的问题。

在您的情况下，我会使用将所有属性传递到构造函数中，而不是在之后设置属性。

for (i = 0; i <= 15; i++) {
    names[i] = new Kinetic.Text({
        x: 10,
        y: 25*i,
        text: "Name " + i,
        fontSize: 10,
        fontFamily: 'Lucida Sans Unicode',
        fill: 'black'
    });  
}

另请参阅http://jsfiddle.net/x764C/