我刷过一组矩形(一系列矩形)。我需要做的是一旦刷过,我想选择矩形的开始和结束,而不管它是否被部分选中。需要在绘制画笔的地方选择整个矩形集。 目前我只能刷一次,如果我执行下面的代码则不会更进一步。 矩形的高度是15.我在这里缺少什么?
我发现只有当我添加以下内容时,我才能再刷一次: gbrush .attr(" X",baseval) .attr("宽度",endval);
我的代码:
var baseval, endval,selected,gbrush
//initial brush drawn
var brush = d3.svg.brush()
.x(d3.scale.identity().domain([30, 290]))
.y(d3.scale.identity().domain([0, height-50]))
.on("brushstart", brushstart)
.on("brush", brush)
.on("brushend", brushed);
gbrush=svg.append("g").call(brush);
function brushed()
{
var e = brush.extent();
//get all the selected rectangles where brushed.
selected = svg.selectAll("rect").filter(function(d)
{
return d.x_axis <= e[1][0] && d.x_axis + d.width >= e[0][0] && d.y_axis <= e[1][1] && d.y_axis + d.height >= e[0][1];
})
gbrush.selectAll("rect")
.attr("height", 15)
.attr("y",10)
//get the start and end point of the rectangle's x-axis where the brush is drawn
baseval = selected[0][0].x.baseVal.value;
endval = selected[0][selected[0].length-1].x.baseVal.value;
gbrush.selectAll("rect")
.attr("height", 15)
.attr("y",10)
.attr("x",baseval)
.attr("width",endval);
.....
}
function brushstart()
{
//var e = brush.extent();
//brush.extent = [100,100];
gbrush.selectAll("rect")
.attr("height", 15)
.attr("y",10);
}
function brush()
{
gbrush.selectAll("rect")
.attr("height", 15)
.attr("y",10);
}