使用dat.gui保存参数似乎出现了问题？

Question

在使用dat.gui时，保存参数似乎存在问题，或者我漏掉了一些非常明显的东西...

当单击齿轮图标以打开应保存JSON的弹出窗口时，问题就会出现。对于我来说，保存到本地存储也不起作用。这里有两个JSFiddles：

• http://jsfiddle.net/navFooh/XZcde/ 使用dat.gui.min.js，单击齿轮会在控制台中引发错误：Uncaught TypeError: Cannot read property 'forEach' of undefined dat.gui.min.js:3

• http://jsfiddle.net/navFooh/8Hek6/ 使用dat.gui.js，单击齿轮图标确实显示了带有JSON的弹出窗口，但参数x没有显示

他们在线上提供的示例可以正常工作（请参见链接的评论）。但是，他们已经最小化了所有示例代码，包括库本身。因此，我甚至无法确定他们是否正在使用最新版本。

任何帮助都将不胜感激。

- navFooh

---

http://workshop.chromeexperiments.com/examples/gui/#5--Saving-Values - navFooh

Answer 1

我犯了一个错误，调用gui.remember(obj);和gui.add(obj，'x');的顺序不正确。

所以这是解决方案：

var obj = { x: 5 };
var gui = new dat.GUI();
gui.remember(obj);
gui.add(obj, 'x');

发生的情况是，dat.gui 在调用 gui.add() 函数时会创建一个内部对象映射表以便记忆对象。这个映射表名为 gui.__rememberedObjectIndecesToControllers[]，在保存数值时会在内部的 getCurrentPreset() 函数中使用。

然而，只有当对象已经存储在 gui.__rememberedObjects[] 中时，它才会将对象添加到这个映射表中，这就是为什么顺序如此重要的原因。

缩小版本抛出错误的原因是，当它尝试从 gui.__rememberedObjectIndecesToControllers[] 获取映射值时，它会尝试循环遍历一个 undefined 值。 http://workshop.chromeexperiments.com/examples/gui/#5--Saving-Values 上的示例展示了正确的顺序，我只是忽略了它。

var fizzyText = new FizzyText();
var gui = new dat.GUI();

gui.remember(fizzyText);

// Add controllers ...

- navFooh

Answer 2

只有使用压缩版时我才会出现错误。当我使用调试版本时，就没有错误。

至于 x 属性不出现的问题，这也是我的情况。我发现需要先单击齿轮图标一次，关闭弹出窗口，然后撤消并再次单击齿轮图标，才能显示正确的数据。

在使用他们的 FizzyText 示例代码时也是如此。

然而，即使没有 x 属性，如果将弹出窗口中看到的内容用作 dat.gui 构造函数中的 load 参数，在页面加载时也将按预期工作：

var gui = new dat.GUI({load:
{
  "preset": "Default",
  "closed": false,
  "remembered": {
    "Default": {
      "0": {"x": 8}
    }
  },
  "folders": {}
}
});

所以我建议这样做，从技术上来说也是他们在弹出窗口中的指示，尽管我必须说那很不清楚。

- rockabit

---

虽然调试版本没有抛出错误，但无论如何它都无法工作。我的错误在于我调用gui.add()和gui.remember()的顺序。之所以在两者之间调用revert()会得到正面的输出，是因为点击该按钮时，它也会创建gui.__rememberedObjectIndecesToControllers[]映射表。有关详细说明，请参阅我的答案。 - navFooh