Как я могу вызвать функцию, используя DAT.Gui как кнопку? - PullRequest
Новая
       18

Как я могу вызвать функцию, используя DAT.Gui как кнопку?

1 голос
/ 30 мая 2019

Я почти не знаю JavaScript, но знаю достаточно, чтобы знать, как устанавливать соединения функций, таймеры, редактирование CSS / редактирование HTML и многое другое, но я не понимаю, как использовать этот «dat.GUI», как мой текущийдизайн проекта ... ну .. Это отстой.

Все мои кнопки - просто ссылки, которые я использовал, чтобы сделать минималистичный дизайн.Просто посмотрите на это: codepen.io .. Итак, я хотел перейти на Dat.GUI, но я не знаю, как создать графический интерфейс, поскольку все обучающие программы, которые я пытался, обычно заканчивались, что приводило кневидимый графический интерфейс (он даже не отображается) и ничего не работает.

Итак, я пришел сюда, чтобы спросить, есть ли у кого-нибудь какая-то информация и, возможно, примеры, с которыми я могу работать?В моем проекте, который я опубликовал выше, я включил код, который я сделал до сих пор для части dat.gui в самом низу JavaScript.

Для тех, кто собирается опубликовать ответ с этим примером, включенным: ChromeExpirements НЕ.Я не ищу это снова и снова, я не могу понять, как использовать это из этого, и это действительно не объясняет это с уровнем детализации, который я могу понять (я не неумелый javascripter).Я также начал использовать этот пример на codepen для обучения: codepen.io

Количество кода, которое у меня есть в моем проекте, немного ... Невероятно для использования / вставки здесь.Вот мой текущий код для запуска.Скажем, у меня есть function raintest() { intervalID = window.setInterval(myCallback, 100); }, который запускает интервал, который запускает myCallback каждые 100 миллисекунд, который нажимает кнопку на моем экране, которая что-то делает, это не так важно, но как мне запустить функцию raintest() с dat.gui и другими функциями?

Вот код dat.gui, который у меня есть, и я пытаюсь работать с ним.Пока что все, что он делает, это показывает вкладку закрытия / открытия, и я не знаю, как добавить кнопки в список: 

window.onload = function() {
  var gui = new dat.GUI();
  gui.add(text, 'message').onChange(setValue);
};

Текущие результаты пусты, я не знаю, как подключитьКод JavaScript для dat.gui правильно.Он просто загружает вкладку для базового графического интерфейса на данный момент.Я действительно хочу, чтобы он мог открываться, и чтобы в нем были все мои кнопки со всеми моими функциями, поэтому у меня есть параметры настройки одежды, которые легко доступны без заполнения верхней части экрана 24/7.

1 Ответ

3 голосов
/ 06 июня 2019

Я нашел свой СОБСТВЕННЫЙ ответ: (поскольку никто не ответил)

Запустите графический интерфейс с 

window.onload = function() {
  text = new sampleText();
  setValue();
  var gui = new dat.GUI();

sampleText представляет ваши AccessPoints в GUI.

Name1 представляет название вашей кнопки / вкладки.Под var gui добавить gui.add(text, 'Name1');Это представляет вашу первую кнопку.

Это даст вам доступ к функциям, если вы хотите прикрепить кнопку к функции, сначала напишите: 

var sampleText = function() {
  this.Name1 = DataType;

DataType (Это представляеттип значения) следует заменить именем вашей функции, и в случае переключателя или утверждения true / false вы должны написать там true или false.(С помощью функций, исключая закрывающие скобки, просто имя (function test1 () {}> this.Name1 = test1)


Если вы хотите создать радиокнопку, которая вызывает 2 разных кода переменной, тогда выполнитеthis:

добавьте this.NameOfButton = false; в конец var sampleText
, затем добавьте gui.add(text, 'NameOfButton').onChange(setValue); под var Gui и создайте новую функцию с именем 

function setValue () {
  if(text.NameOfButton) {
    VariableOrSomething = 1000;
  }
  else {
    VariableOrSomething = 0;
  }
}


ELSE - это то, что вызывается, когда радиокнопка не отмечена (ложно), IF - это то, что вызывается, когда оно проверено (верно).

...