two.js 中的文本不会显示

Text in two.js wont show up

我有一个显示扩大圆圈的程序。最后,我希望它显示一个名为 list 的数组中随机生成的项目。

The Code

这里是具体的代码

var list = ["list","of","names"];
var person = ("")
person = list[Rnd(0,2)]; 
var text1 = new Two.Text(person ,250,250, 'normal');

text1.value = person;
text1.fill = '#FFFFFF';
text1.stroke ='#FFFFFF';
text1.visible = true;

编辑:

我特别想使用双文本而不是 HTML

当圆达到一定宽度时。

根据您的数组大小生成一个随机数,然后使用 getElementById 和您的 list[i](i = 您的随机数)设置元素的值。

我能够通过使用圆的半径作为添加文本的条件来获得效果。我把圆的半径设为 100 开始。

var circle = two.makeCircle(two.width / 2, two.height / 2, 100);
circle.fill = "orange";
var list = ["list","of","names"];
var person = list[Math.floor(Math.random() * list.length)];
var text1 = new Two.Text(person, two.width / 2, two.height / 2, 'normal');
text1.fill = '#FFFFFF';
text1.stroke ='#FFFFFF';

绑定循环播放圆形动画。一旦圆扩大到半径 200,它就会停止动画,并将 text1 添加到两个 canvas.

two.bind('update', function() {
  if (circle.radius > 200) {
    two.pause();
    two.add(text1);
  }
  circle.radius++;
});

对所有文本执行此操作:

two.scene.add(text);