删除时d3刷不复位

时间:2017-10-12 21:00:48

标签: javascript angularjs d3.js

这里缺少一些东西,因为当刷子被移除时(你点击刷子而不是拖动)?活动选择不会重置(即不删除画笔)。

任何想法如何解决?

干杯!

// Handles a brush event, toggling the display of foreground lines.
function brush_parallel_chart() {    
    for(var i=0;i<dimensions.length;++i){
        if(d3.event.target==y[dimensions[i]].brush) {
            extents[i]=d3.event.selection.map(y[dimensions[i]].invert,y[dimensions[i]]);
        }
    }

    foreground.style("display", function(d) {
        return dimensions.every(function(p, i) {
            if(extents[i][0]==0 && extents[i][0]==0) {
                return true;
            }
            return extents[i][1] <= d[p] && d[p] <= extents[i][0];
        }) ? null : "none";
    });
}

http://plnkr.co/edit/RkWBgQ6oi584H3212WrM?p=preview

当我们在开始时完全清除画笔时会发生这种情况:

enter image description here

1 个答案:

答案 0 :(得分:2)

我分叉你的代码。看看这个 - http://plnkr.co/edit/oYhx6DSjQHI3E3nmE97h?p=preview 这是你需要的行为吗?

g.append("g")
  .attr("class", "brush")
  .each(function(d) {
    d3.select(this).call(y[d].brush = d3.brushY().extent([[-8, 0], [8,height]])
    .on("start", brushstart) // <-- !!
    .on("brush", gobrush)
    .on("brush", brush_parallel_chart));
  })
  .selectAll("rect")
  .attr("x", -8)
  .attr("width", 16);

我将brushstart功能重命名为gobrush。并创建了新的brushstart函数。我在选择开始事件上添加了新的brushstart函数。在此功能中,我设置了适当的样式,重置选择。

function brushstart(selectionName) {
  foreground.style("display", "none")

  var dimensionsIndex = dimensions.indexOf(selectionName);

  extents[dimensionsIndex] = [0, 0];

  foreground.style("display", function(d) {
    return dimensions.every(function(p, i) {
        if(extents[i][0]==0 && extents[i][0]==0) {
            return true;
        }
      return extents[i][1] <= d[p] && d[p] <= extents[i][0];
    }) ? null : "none";
  });
}