问题标签 [dat.gui]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
2292 浏览

javascript - 无法读取未定义的 Three.js 的属性“材料”

我不明白为什么它向我显示以下错误:

无法读取未定义“在线”scene.getObjectByName(“cube”) 的属性“材料”。material.opacity = control.opacity ; "

我的代码:

0 投票
1 回答
593 浏览

javascript - 将两个按钮居中到父 div 的子 div

我正在使用 dat.gui.js 来使用 Three.js 的参数菜单。我想把这个菜单放在主窗口的右上角。此外,我想在这个菜单的底部添加 2 个按钮,它们必须水平居中并且相对于父 div。

这是JS Fiddle 中的一个示例

如您所见,在 HTML 中,子 div 和父 div 具有以下结构:

与 CSS 为#gui

对应于:

#global-ui div#gui div表示和的父 div #buttons div

使用这个 css,我得到以下图像:

上面代码的结果

我想得到这个:

要获取的图像

正如您在第一张图片中看到的那样,有两个问题:首先,即使使用 CSS ",DAT.GUI 也不是严格位于右侧和顶部#gui {position: absolute; top: 0; right: 0;}"。看起来右侧有一个边距。

第二个问题,这两个按钮相对于 DAT.GUI 没有居中,我尝试使用“ margin: 0 auto;”或“ text-align: center;”但没有成功。我想将它相对于#guidiv 容器并以自动方式居中。

我该如何解决这两个问题?

0 投票
1 回答
451 浏览

javascript - 用 dat.gui 隐藏 THREE.Mesh

我正在尝试创建 3 个建筑物的简单 3D 形状,假设我从轮廓开始(每条线的开始/结束都有 X 和 Y)然后挤压它们。

谷歌没有帮助我,所以如果可以的话,我恳请你看看。我将线条作为图像附加(仅供参考)。

然后我怎样才能做一个小 dat.GUI 开关来打开/关闭形状(我不确定如何将几何图形与 gui 连接)。

谢谢!

大纲

0 投票
2 回答
778 浏览

javascript - 三角剖分 Three.js 算法

我正在尝试使用 Three.js 在 javascript 中按照简单的规则制作三角测量算法。

以下是实际步骤:

在此处输入图像描述

我们从一个正方形开始,在对称划分为四个部分之后“随机”定义单元格的高度。

我打算用 dat.GUI 面板制作“步骤”。

如果有人可以帮助我,我将不胜感激!

0 投票
2 回答
1831 浏览

javascript - 默认下拉值 dat.gui

我对 javascript 和 dat.gui 非常陌生,所以请耐心等待。我想知道如何在顶部创建一个默认值的下拉菜单:

所以我有类似的东西:

在实际选择一个值之前,如何让该下拉菜单默认显示类似“选择语言”的内容?

谢谢!

0 投票
1 回答
275 浏览

javascript - 三个 js 防止通过 GUI 选择光线投射

我需要通过单击对象和弹出的非模式对话框来选择对象以显示有关对象的信息。它可以正常工作,但是如果用户单击任何 GUI 项,包括对话框,并且后面有一个对象,则将选取三个 js 对象,从而更改弹出窗口中的信息。

这是片段。

jQuery 对话框生成器:

onMouseDown 函数:

其他 GUI 元素是使用 dat.GUI 创建的。

在搜索此问题时,大多数结果都是关于 Unity,而不是作为经验丰富的开发人员,我并不真正了解如何适应它们。

0 投票
1 回答
196 浏览

three.js - 三.js简单自定义动画不继续用DAT.GUI.onChange函数变化

如果我的错误很明显,请道歉。几周前开始学习代码。已经大量搜索答案。

尝试使用 Dat.Gui 控制在 three.js 中动画的图形方程的变量。通过将变量分配为空,我可以看到 gui 是链接的,因为在滑块上的任何位置都立即调用了预期的图形方程(为简单起见,我用简单的抛物线替换了更复杂的方程)。当再次单击 gui 滑块时,图形方程也会消失,如希望的那样,为“重绘”方程(由 gui 滑块确定的更宽或更窄的抛物线)扫清道路,但它会引发此错误:

“[.CommandBufferContext]RENDER WARNING:渲染计数或 primcount 为 0。”

我已经能够重新排列代码,所以它不会抛出这个错误,但它仍然没有调用方程的下一个可见迭代......下面是成功绘制抛物线的代码,在下一个.onChange,但随后抛出上述错误......

帮助将不胜感激。

0 投票
4 回答
3762 浏览

javascript - 如何锁定滑块并防止使用鼠标将值更新到 dat.GUI 菜单

我尝试实现一种方法来防止用鼠标更新值(实际上是在three.js动画开始时,通过单击按钮启动)。

目前,我有以下dat.GUI菜单:

在此处输入图像描述

单击“开始”按钮后,我想防止用户用鼠标修改参数“ Rotation x”和“ Rotation y”。

这是此菜单的相关代码部分:

当我单击重置按钮时,我调用以下函数:

我不知道控制器是否可以选择锁定这些通常会更改其值的滑块。可能吗?

更新 1

也许我可以将 dat.GUI 菜单包装成一个 div 并使这个 div 不可点击,这是一个解决方案吗?

更新 2

我试图应用方法上使用的方法来禁用 dat.gui 中的按钮?

遵循此解决方案,我已将扩展名添加到 中dat.gui,紧随其后:

以下添加的代码片段是:

扩展代码是否很好地位于dat.GUI源代码中?

然后,我将属性“ disabled”设置到我的代码中,以防止用户controllerRotationx用鼠标滑动“”(一旦按下开始按钮):

不幸的是,我的方法不起作用:当动画开始时,我仍然可以将包含的滑块移动到“ controllerRotationx”中。

我看到上面的链接(在 dat.gui 中禁用按钮的方法?),这是关于按钮而不是滑块,它对我的​​情况有什么改变吗?

我没有找到滑块的显式控制器。

0 投票
1 回答
4255 浏览

javascript - 如何在 dat.gui 中添加文件夹?

我正在尝试在从three.js 示例复制的three.js 项目中为灯光添加文件夹。但我无法让它工作。我想我应该使用 f1=add.folder('light1') ,然后以某种方式使用 f1.add('intensity') 等将参数添加到 f1 ......但是当代码结构像这样时,如何做到这一点?node = f1.add() 不起作用!

0 投票
0 回答
412 浏览

javascript - 使用滑块中的值更新几何图形

如何将 dat.gui 滑块动态生成的值传递到 TorusKnotGeometry 的 p 和 q 属性中,就像在这个例子中一样?http://threejs.org/docs/#Reference/Extras.Geometry/TorusKnotGeometry

我尝试查看源代码,但不明白如何应用它:http ://threejs.org/docs/scenes/js/geometry.js

这是我尝试过的。我有正确的立方体旋转渲染,但圆环没有用滑块的值渲染。

谢谢你的帮助!我是新手。