填充化JSON文件中dat.gui

Question

我想提出一個下拉使用JavaScript 這裏的菜單下拉菜單是JSON文件

{ 
"bg1":"assets/bg/people_bg.jpg", 
"bg2":"assets/bg/people_bg.jpg" 
} 

我只是試圖把名字作爲BG1和BG2到BG（ n）下拉，所以用戶可以選擇任何background.Here是我的代碼dat.gui（）;

{ 
controller = new function() { 
this.bg = ''; 
} 
var gui = new dat.GUI(); 
f1 = gui.addFolder('Sphere'); 
f1.add(controller, 'bg', displayingNameOfBackground).onChange(function() { 
    //if change using their path to change background 
      ); 

Answer 1

這取決於你想要的結果是什麼，但作爲一個選項，你可以做這樣的：

var json = { 
 
    "background": { 
 
    "bg1": "assets/bg/people_bg1.jpg", 
 
    "bg2": "assets/bg/people_bg2.jpg" 
 
    } 
 
}; 
 

 
var gui = new dat.GUI(); 
 
f1 = gui.addFolder('Sphere'); 
 
f1.add(json, "background", json.background).onChange(function(value) { 
 
    alert(value) // do the stuff to change background 
 
}); 
 
f1.open();

body { 
 
    overflow: hidden; 
 
    margin: 0; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.5/dat.gui.min.js"></script>