D3尝试访问json对象中的vis元素

Question

我正在尝试使用D3访问下面的json对象中的vis元素（请参见屏幕截图），但无法这样做。 使用类似于以下内容的代码，我可以毫无问题地访问键和值元素：

console.log(d.key);

但这不起作用（我收到未定义的错误）：

console.log(d.vis);

有什么想法我做错了吗？ 谢谢！

以下是一些代码段：

var nested = d3.nest().key(function(d) { return d._id.stream; })
  .entries(data.result);

var stream = main.selectAll(".stream")
  .data(nested)
  .enter().append("g")
  .attr("class", "stream");    

  stream.append("rect")
  .attr("height",10)
  .attr("width", 25)
  .attr("x",width-215)
  .attr("y", function(d,i) { return height-400 + (i*40); })
  .attr("stroke", function(d) { return color(d.key);})
  .attr("fill",function(d) {
      if(d.vis=="1") {
        return color(d.key);
      }
      else {
        return "white";
      }
   })
   .on("click", function(d) {
     console.log(d);
     console.log(d.vis);  // undefined
     if(d.vis=="1") {
        d.vis="0";
      }
      else{
        d.vis="1";
      }
   });

Answer 1

看起来正在发生以下情况。 点击处理程序功能被执行。 在内部，您正在记录d.vis ，它是未定义的。 之后的代码将检查d.vis是否具有特定值，否则将其设置为“ 1”。 该“其他”包括未定义的情况。

因此，在执行处理程序之后， d.vis所有d设置d.vis 。 您正在使用的调试器显示变量的值，该值在console.log()语句之后进行了修改 。 也就是说，在您打印d ， d.vis确实未定义。 但是您要在之后立即进行设置，这就是您在控制台中看到的内容。

日志在打印时不会d.vis变量状态的快照，但会向您显示当前版本（在本例中已设置d.vis 。

Answer 2

注意数据结构：请参阅fetchData.js，除了priceList和name之外，还应该有vis元素，用于确定是否显示曲线。

//The main data array of the graph
//format:
//data2 (List of fundObj)
//   fundObj (Name, priceList)
//      Name
//      vis
//      priceList (List of priceItem)
//         priceItem (date, price)

因此，请清楚代码中的“ d”是什么，这完全取决于您传递给调用的数据：

var fund = focus.selectAll(".fund")
        .data(data2)
        .enter().append("g")
        .attr("class", "fund");

这里的data2是原始数据，您可以使用其他结构，但是需要在“ d”处修改一些代码。