2015-10-12 2 views
0

Когда я пытаюсь сделать мой dat.gui с кнопкой и текстовое поле в верхней части моего окна WebGL я получаю это:dat.gui не отображается правильно в окне WebGL

The button and the textbox is not showing

«Закрыть Controls "часть dat.gui показывается, но по какой-то причине моя кнопка и текстовое поле - нет. Я использую three.js для создания окна WebGL.

function ini() 
 
{ 
 
    this.button1 = function() { alert("HEJ"); }; 
 
    this.text1 = "Hallo World"; 
 
} 
 

 
var gui = new dat.GUI({ autoPlace: false }); 
 
var div = document.getElementById('datGui'); 
 
div.appendChild(gui.domElement); 
 
var i = new ini(); 
 
gui.add(i, "button1"); 
 
gui.add(i, "text1");
<div id="datGui"> 
 
\t <canvas id="canvas" style="position: absolute; background-color: black; width: auto; "></canvas> 
 
</div>

+0

Я думаю, вы пытаетесь ограничить dat.GUI, и ему это не нравится. Попробуйте удалить эти две строки: 'var div = document.getElementById ('datGui'); div.appendChild (gui.domElement); ' – gaitat

+0

Удаление этих строк делает рендеринг dat.gui корректно. Однако dat.gui больше не отображается внутри окна WebGL. Вместо этого он отображается в правом верхнем углу веб-сайта. Причина, по которой я написал две строки кода, заключалась в том, чтобы dat.gui отображался внутри моего окна WebGL. –

+0

Может ли быть, что z-индекс двух элементов сражается? – gaitat

ответ

0

Это ошибка в dat.gui. Решение: Не используйте dat.gui, это очень багги вообще

Смежные вопросы