Question

我得到的问题是，当我在点击事件中执行console.log（d.info）时，只要点击我的svg元素，我就会设置为触发，我得到一个未定义的错误控制台。

有没有办法从我保存在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);
    })

点击事件中无法访问D3中的数据？

1 个答案: