Настройка минимальных и максимальных значений в dat.gui с помощью трех JS

#dat.gui

#dat.gui

Вопрос:

Я использую dat.gui в morphTargets. По умолчанию графический интерфейс принимает 0 как минимум и 1 как максимум, я хочу, чтобы они отображались как мои соответствующие значения, например: 0 как 10 и 1 как 20.

Как я могу это сделать?

Ответ №1:

Вы можете вычислить это значение следующим .onChange образом:

 <script type="module">
import {GUI} from "https://threejs.org/examples/jsm/libs/dat.gui.module.js";

let gui = new GUI();

let params = {
    value: 10
}
let influences = {
    value: 0
}

gui.add(params, "value", 10, 20).onChange(val => {
  influences.value = range01(val, 10, 20);
  console.log(influences.value);
})

function range01(val, min, max){
  return (val - min) / (max - min);
}

</script>