dat.gui load settings from external JSON? dat.gui load settings from external JSON? json json

dat.gui load settings from external JSON?


I've created an example (using dat.gui version 0.5) which demonstrates loading preset values from a JSON file on the initialisation of a dat.GUI object:

http://codepen.io/BenSmith/pen/lxiqb

The key part of the code which "re-hydrates" the dat.GUI object is this:

var json = '{ \  "preset": "Default",\  "closed": false,\  "remembered": {\    "Default": {\      "0": {\        "message": "Value from JSON",\        "speed": 5,\        "displayOutline": true,\        "color1": [\          128,\          128,\          128\        ]\      }\    }\  },\  "folders": {}\}';    var text = new datGUI();  var gui = new dat.GUI({ load: JSON.parse(json) });

Note how the "message" value (for example) has the value from the JSON (i.e. "Value from JSON") as opposed to the value in the default dat.GUI object (i.e. "dat.gui").

In practise you would obtain the JSON from a file instead of hard-coding it. Also note the use of JSON.parse() to convert the JSON string to a JSON object.