單擊事件中無法訪問D3中的數據？

Question

我得到的問題是，當我點擊事件，我已經設置爲每當我的svg元素被點擊時，觸發console.log（d.info），我在控制檯中得到一個未定義的錯誤。

有沒有辦法從我保存在infoData變量中的csv文件中訪問我的數據？

在此先感謝！

d3.csv("../data/dataset.csv", function(data) { 
    var infoData = data; 

    var svg = d3.select(".container").append("svg") 
    .attr("width", 500) 
    .attr("height", 500); 

    svg.selectAll("rect") 
    .data(infoData) 
    .enter() 
    .append("rect") 
    .attr("fill", "#0000ff") 
    .attr("width", function(d, index) { 
     return (d.width); 
    }) 
    .attr("height", 80); 

    $(document).ready(function(d) { 
    svg.on("click", function(event, d) { 
     console.log(d.info); 
    }); 
    }); 
}); 

Answer 1

移動單擊處理程序到您要定義rect：

svg.selectAll("rect") 
    .data(buildingData) 
    .enter() 
    .append("rect") 
    .attr("fill", "#0000ff") 
    .attr("width", function(d, index) { 
     return (d.width); 
    }) 
    .attr("height", 80) 
    .on('click', function(event, d) { 
     console.log(d.info); 
    })