Question

我有一系列像这样创建的地平线图：

d3.select("body")
  .selectAll(".horizon")
  .data(metrics)
  .enter()
  .append("div")
  .attr("class", "horizon")
  .attr("id", function(d){return d.toString();})
  .call(context.horizon().height(['75']));

其中metrics是metric个对象的数组。

我想重新定义这些extent个对象的一个的horizon。

我尝试在一张图上调用extent函数，但我不确定我是在调用它，还是在正确选择它：

d3.select("#id-attribute")
  .call(context.horizon().extent(function(d,i){return([0,1000]);}));

这种方式似乎有效，但图形显示被搞砸了，在图形下方添加了额外的空白，图形的运动不考虑到这一点，并使图形的顶部没有动画。我怀疑它是以某种方式由于它是extent对象的新实例，所以我尝试了这个：

d3.select("#id-attribute")
  .call(extent(function(d,i){return([0,1000]);}));

但会产生：“ReferenceError: extent is not defined”。

我已尝试有效地重新定义metric的{{1}}函数：

extent

但是这会导致图形为空白（虽然鼠标悬停在图中显示读数中的数字），并且当鼠标没有悬停在任何一个上方时，它会导致其读数和其下方显示的图形的读数为空白的曲线图。

老实说，我不理解这些东西是如何组合在一起的，我对JavaScript也没有特别的经验，所以我不确定我的错误在哪里。我完全不在我的深处。任何提示将不胜感激。

Answer 1

您是否需要在生成视野的初始调用后重新定义范围？

如果没有，请尝试这样的事情：

d3.select("body")
  .selectAll(".horizon")
  .data(metrics)
  .enter()
  .append("div")
  .attr("class", "horizon")
  .attr("id", function(d){return d.toString();})
  .call(context.horizon()  
             .height(['75'])
             .extent(function(d,i){  //use this function to change extents
                   if (d.toString() == 'Whatever the name is'){
                        return [0,1000];
                   } else {
                        return [ <default min>, <default max>]
                   }
              })
 )

您可以设置自己的默认范围，也可以使用d3.min（）/ d3.max（）等函数来获取视野的值。您只需要返回一个包含两个元素的数组。

覆盖一个范围实例的范围

1 个答案: