如何從內部json數組中獲取目標值

Question

如何從下拉菜單中選擇與所選名稱對應的目標值。 I have a dataset在具有以下結構層次結構：

世界=>孩子：大陸有=>兒童國家

現在，我想個別國家的值時，它的名字是從下拉列表中選擇。

當我嘗試我的代碼返回錯誤

遺漏的類型錯誤：無法讀取空

這一點我想，我不能得到我所需要的值手段的特性「目標」。 的js小提琴：

http://jsfiddle.net/9tnmwdyv/3/

我的代碼：

function checkIt(error, root){ 
    if (error) throw error; 

    var partition = d3.layout.partition() 
        .value(function(d) { return d.Total; }); 

     var dropDown = d3.select("#dropdown_container") 
        .append("select") 
        .attr("class", "selection") 
        .attr("name", "country-list"); 

    var options = dropDown.selectAll("option") 
        .data(partition.nodes(root)) 
        .enter() 
        .append("option"); 
     options.text(function (d) { var dropdownValues = d.name.replace(/[_-]/g, " "); 
            return dropdownValues.replace(/[_-]/g, " ") }) 
     .attr("value", function (d) { var dropdownValues = d.name; 
            return dropdownValues}); 

    function changePie() { 

    //get the data value and index from the event 
    var selectedValue = d3.event.target; 
    var selectedIndex = d3.event.target.selectedIndex; 

    //alert("You selected the option at index " + selectedIndex + ", with value attribute "+ selectedValue); 

    var selectedDOMElement = 
     d3.event.target.children[selectedIndex]; 
    var selection = d3.select(selectedDOMElement); 

//Output selected country with all its values 
    var uniqueData = data[selectedIndex]; 
     console.log(uniqueData) 
    } 
changePie(); 
}; 

d3.json("https://gist.githubusercontent.com/heenaI/cbbc5c5f49994f174376/raw/55c672bbca7991442f1209cfbbb6ded45d5e8c8e/data.json", checkIt); 

Answer 1

你調用changePie自己，應該調用作爲事件的回調。 d3.events.target爲空，因爲「d3.events」沒有名爲「target」的屬性，它不是傳遞給回調的事件對象。你也可以在回調函數中使用「this」來訪問目標元素，它是普通的DOM元素。如果您需要調用它D3方法，只是D3把它包裝成d3.select（本）

下面是代碼示出了事件的回調

d3.select(".selection").on("change", function changePie() { 
    console.log(this.value); 
}); 

工作的jsfiddle：

http://jsfiddle.net/9tnmwdyv/6/

編輯*

如果您要訪問相應的數據，你可以將分區數組保存在變量中並進行訪問。

var nodeArr = partition.nodes(root); 
d3.select(".selection").on("change", function changePie() { 
    var value = this.value; 
    var index = this.selectedIndex; 
    var dataObj = nodeArr[index]; 
    console.log(this.value + " : " + dataObj.Total + " in " + (dataObj.parent && dataObj.parent.name)); 
}); 

檢查以下的jsfiddle鏈接：

http://jsfiddle.net/9tnmwdyv/10/