Fatal编程技术网
  • javascript/
  • Javascript dat.gui未在WebGL窗口中正确呈现

Javascript dat.gui未在WebGL窗口中正确呈现

javascript three.js webgl

Javascript dat.gui未在WebGL窗口中正确呈现,javascript,three.js,webgl,dat.gui,Javascript,Three.js,Webgl,Dat.gui,当我尝试使用WebGL窗口顶部的按钮和文本框呈现我的dat.gui时，我得到以下结果： dat.gui的“关闭控件”部分正在显示，但由于某些原因，我的按钮和文本框没有显示。我使用three.js创建WebGL窗口 函数ini（） { this.button1=函数（）{alert（“HEJ”）；}； this.text1=“你好世界”； } var gui=new dat.gui（{autoPlace:false}）； var div=document.getElementById（'dat

当我尝试使用WebGL窗口顶部的按钮和文本框呈现我的dat.gui时，我得到以下结果：

dat.gui的“关闭控件”部分正在显示，但由于某些原因，我的按钮和文本框没有显示。我使用three.js创建WebGL窗口

函数ini（）
{
this.button1=函数（）{alert（“HEJ”）；}；
this.text1=“你好世界”；
}
var gui=new dat.gui（{autoPlace:false}）；
var div=document.getElementById（'datGui'）；
附件子类（gui.DOMELENT）；
var i=新的ini（）；
添加（i，“按钮1”）；
添加（i，“文本1”）



这是dat.gui中的一个bug。解决方案：不要使用dat.gui，它通常有很多错误
FWIW，此代码笔演示了zIndex对文档和dat-gui呈现的影响：




 我认为您试图限制dat.GUI，但它不喜欢它。尝试删除这两行：
var div=document.getElementById（'datGui'）；附件子类（gui.DOMELENT）删除这些行会使dat.gui正确呈现。但是，不再在WebGL窗口内呈现dat.gui。相反，它呈现在网站的右上角。我之所以编写这两行代码，是为了在我的WebGL窗口中呈现dat.gui。这可能是因为这两个元素的z索引相互冲突吗？不，但这也是我的第一个猜测。您可以尝试查看在WebGL窗口中呈现dat.gui的页面。

document.getElementById("canvas").style.zIndex = "-1";