9

我使用 dat.gui 为我的 Three.js 应用程序制作了一个菜单。它工作正常，我还发现按 h 键可以隐藏使用 dat.gui 创建的菜单。我的问题是如何使菜单直接从代码中出现/消失？

 var gui = new dat.GUI();
 gui.add(text, 'message');
 gui.add(text, 'speed', -5, 5);

 gui.???

我尝试使用 DOMElement hide 的属性，它可以工作，但我想要一种独特的方式来处理这个函数。有函数调用吗？我注意到与击键相关的 JavaScript 事件通过库中的绑定与范围相关。但是这样做的正确方法是什么？

4

7 回答 7

12

我遇到了同样的问题并通过以下方式解决了它：

var gui = new dat.GUI();
dat.GUI.toggleHide();
于 2013-08-20T05:27:48.283 回答
2

你可以试试

var gui = new dat.GUI();
 //... your logic here
gui.__proto__.constructor.toggleHide()
于 2016-10-15T16:40:03.047 回答
1

你和我一直在寻找的是

var gui = new dat.GUI();
// to toggle it closed
gui.closed = true;
// to toggle it open again
gui.closed = false;

我从第2104 行的源代码中得到了这个，内部函数open和close 正是这样做的。

gui 会即时对值的变化做出反应（您可以从控制台重新分配 gui.close 以查看它的运行情况）。

于 2016-09-19T17:06:43.570 回答
1

截至最新版本：

gui.close();

于 2018-03-12T11:47:35.540 回答
0

Ok 找到了解决办法，在 dat.GUI 的原型中加入如下函数：

  dat.GUI.prototype.removeFolder = function(name) {
    var folder = this.__folders[name];
    if (!folder) {
      return;
    }
    folder.close();
    this.__ul.removeChild(folder.domElement.parentNode);
    delete this.__folders[name];
    this.onResize();
  }
于 2013-04-06T12:49:01.127 回答
0

我建议：

$(gui.domElement).attr("hidden", true);

因为它还可以防止点击。toggleHide()仍然可以单击它。只需关闭它就会有机会重新打开。

为我工作，因为我不希望用户重新打开它；）

于 2015-07-29T08:14:55.223 回答
-1

您可以在 gui domElement 中的第一个 ul 标记上切换“关闭”类。

如果您使用 JQuery，请执行以下操作：

var gui = new dat.GUI();
$(gui.domElement).find(">ul").toggleClass("closed");
于 2015-02-14T03:27:54.813 回答