dat.gui загружает настройки из внешнего JSON?

#javascript #json #user-interface #dat.gui

#javascript #json #пользовательский интерфейс #dat.gui

Вопрос:

У меня есть веб-приложение с интерфейсом dat.gui, и я бы хотел, чтобы люди могли делиться своими настройками друг с другом. Я знаю, что вы можете сохранять предварительные настройки в файл localStorage или сохранять их непосредственно в исходном коде как объект JSON. (http://workshop.chromeexperiments.com/examples/gui/#5—Saving-Values )

И я вижу, что в более старой версии dat.gui была saveURL() функция, которая, как я полагаю, передавала настройки в строке запроса. (https://dat-gui.googlecode.com/git-history/v0.3.2/index.html )

Возможно ли в текущей версии либо передавать произвольный JSON в графический интерфейс при загрузке страницы, либо указывать ссылку на файл JSON, возможно, через строку запроса?

Ответ №1:

Я создал пример (используя dat.gui версии 0.5), который демонстрирует загрузку предустановленных значений из файла JSON при инициализации dat.Объект GUI:

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

Ключевая часть кода, которая «повторно увлажняет» dat.Объект GUI — это:

 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) });
 

Обратите внимание, что значение «message» (например) имеет значение из JSON (т. Е. «Значение из JSON»), в отличие от значения в dat по умолчанию.Объект GUI (т.е. «dat.gui»).

На практике вы бы получили JSON из файла вместо его жесткого кодирования. Также обратите внимание на использование JSON.parse() для преобразования строки JSON в объект JSON.