Dat.GUI 中的随机值

问题描述

我使用 dat.gui 来控制值，但想添加一个按钮来随机化值。有没有办法做到这一点？我有随机按钮，但我不知道如何引用参数来更改其值。

基本代码类似于：

const params = {}
params.num = 20

gui.add(params,'num').onChange(doSomething)

//on clicking the 'Randomise' button I would essentially like this to happen:

gui.(params,'num').setValue( randomValue ).onChange(doSomething)

有什么方法可以引用参数，然后将其值设置为 x？ 提前致谢！

解决方法

您可以更改属性的值并在 GUI 中使用 .listen() 来侦听属性的更改。

在 GUI 上单击 randomize 并查看它的作用：

<script type="module">
import {GUI} from "https://cdn.jsdelivr.net/npm/three@0.125.2/examples/jsm/libs/dat.gui.module.js";

let params = {
  value: 20,randomize: _ => {
    params.value = Math.random() * 40;
  }
}

let gui = new GUI();
gui.add(params,"value",40).step(0.1).listen();
gui.add(params,"randomize");

</script>