Question

我尝试通过数组声明变量，以便在dat.Gui控制器中使用它们。这是我的尝试：

<script>
  window.Horizontale = 300;
  window.Vertikale = 300;
  window.A = new Array();

  for (var i=1; i<7; i++) {
    window.A[i] = false;
  }

  window.onload = function() {
    var gui = new dat.GUI();
    gui.add(window, 'Horizontale', 0, 600);
    gui.add(window, 'Vertikale', 0, 600);

    for (var i=1; i<7; i++) {
      gui.add(window, A[i]);
    }
    gui.remember(window);
  };
</script>

数组中的变量不会出现在GUI中。我是Javascript的新手，所以也许这只是声明的问题？

Answer 1

在这一行：

gui.add(window, A[i]);

... add()在对象window上查找A[i]指定的名称的属性，在这种情况下评估为false

但是，false上没有名为window的媒体资源。因此，您需要使用所需的名称在某个对象上指定属性，然后您可以将每个要传递的值作为附加参数分配给add() - 在这种情况下，false会给你一个未选中状态的复选框。

因此，假设您想要6个未经检查的名为1 - 6的复选框，您可以执行一些操作，但它们都涉及向某个对象添加6个命名属性。这是使用第二个对象来保存控制器名称的一种方法，它将取代您的第二个for循环：

for (var i=1; i<7; i++) {
  controller_names[i] = A[i];
  gui.add(controller_names, i, A[i]);
}

但是，这可能无法与保存设置功能很好地协作 - dat.gui似乎只能保存gui对象本身定义的控件的设置，如下所述：Save dat.gui presets for dynamically added controls?

...在这种情况下，你可以尝试更像这样的东西：

<script>
  window.onload = function() {

    var gui = new dat.GUI();
    gui.Horizontale = 300;
    gui.Vertikale = 300;
    gui.A = new Array();

    for (var i=1; i<7; i++) {
      gui.A[i] = false;
    }

    gui.add(gui, 'Horizontale', 0, 600);
    gui.add(gui, 'Vertikale', 0, 600);

    for (var i=1; i<7; i++) {
      gui.add(gui.A, i, gui.A[i]);
    }
    gui.remember(gui);
  };
</script>

如何使用数组将变量插入dat.Gui？

1 个答案: