Skip to content

Commit 24f9f2c

Browse files
committed
Store brush transition state on the DOM.
Rather than capture the brush’s pre-transition state via closure, store the state on the DOM like the axis component (this.__chart__). Now the brush can be instanced on multiple elements, and each element’s pre-transition state can be tracked separately, consistent with its display. Further, restore the pre-transition state of the brush prior to emitting the brushstart event, using the pre-transition data-space extent, if any. And likewise, when the transition ends, restore the post-transition data-space extent if available, rather than the less accurate pixel-space extent. Since the data-space extent is restored when the transition ends, an additional brush event is now emitted prior to brushend, since the extent may have changed.
1 parent dddb501 commit 24f9f2c

3 files changed

Lines changed: 56 additions & 44 deletions

File tree

d3.js

Lines changed: 26 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -7941,7 +7941,7 @@ d3 = function() {
79417941
});
79427942
}
79437943
d3.svg.brush = function() {
7944-
var event = d3_eventDispatch(brush, "brushstart", "brush", "brushend"), x = null, y = null, xExtent = [ 0, 0 ], yExtent = [ 0, 0 ], xExtent0 = xExtent, yExtent0 = yExtent, xExtentDomain, yExtentDomain, xClamp = true, yClamp = true, resizes = d3_svg_brushResizes[0];
7944+
var event = d3_eventDispatch(brush, "brushstart", "brush", "brushend"), x = null, y = null, xExtent = [ 0, 0 ], yExtent = [ 0, 0 ], xExtentDomain, yExtentDomain, xClamp = true, yClamp = true, resizes = d3_svg_brushResizes[0];
79457945
function brush(g) {
79467946
g.each(function() {
79477947
var g = d3.select(this).style("pointer-events", "all").style("-webkit-tap-highlight-color", "rgba(0,0,0,0)").on("mousedown.brush", brushstart).on("touchstart.brush", brushstart);
@@ -7972,38 +7972,45 @@ d3 = function() {
79727972
redrawY(gUpdate);
79737973
}
79747974
redraw(gUpdate);
7975-
});
7976-
if (g instanceof d3.transition) {
7977-
g.each(function() {
7978-
var event_ = event.of(this, arguments);
7979-
d3.select(this).transition().each("start.brush", function() {
7975+
var event_ = event.of(this, arguments), extent1 = {
7976+
x: xExtent,
7977+
y: yExtent,
7978+
i: xExtentDomain,
7979+
j: yExtentDomain
7980+
}, extent0 = this.__chart__ || extent1;
7981+
this.__chart__ = extent1;
7982+
if (d3_transitionInheritId) {
7983+
gUpdate.each("start.brush", function() {
7984+
xExtentDomain = extent0.i;
7985+
yExtentDomain = extent0.j;
7986+
xExtent = extent0.x;
7987+
yExtent = extent0.y;
79807988
event_({
79817989
type: "brushstart"
79827990
});
79837991
}).tween("brush:brush", function() {
7984-
var xi = d3_interpolateArray(xExtent0, xExtent), yi = d3_interpolateArray(yExtent0, yExtent);
7992+
var xi = d3_interpolateArray(xExtent, extent1.x), yi = d3_interpolateArray(yExtent, extent1.y);
79857993
xExtentDomain = yExtentDomain = null;
7986-
xExtent0 = xExtent = xi(0);
7987-
yExtent0 = yExtent = yi(0);
79887994
return function(t) {
7989-
xi(t);
7990-
yi(t);
7995+
xExtent = extent1.x = xi(t);
7996+
yExtent = extent1.y = yi(t);
79917997
event_({
79927998
type: "brush",
79937999
mode: "resize"
79948000
});
79958001
};
79968002
}).each("end.brush", function() {
8003+
xExtentDomain = extent1.i;
8004+
yExtentDomain = extent1.j;
8005+
event_({
8006+
type: "brush",
8007+
mode: "resize"
8008+
});
79978009
event_({
79988010
type: "brushend"
79998011
});
80008012
});
8001-
});
8002-
} else if (xExtent0 !== xExtent || yExtent0 !== yExtent) {
8003-
xExtent0 = xExtent;
8004-
yExtent0 = yExtent;
8005-
g.each(function() {
8006-
var event_ = event.of(this, arguments);
8013+
} else if (extent0.i !== extent1.i || extent0.j !== extent1.j) {
80078014
event_({
80088015
type: "brushstart"
80098016
});
@@ -8014,8 +8021,8 @@ d3 = function() {
80148021
event_({
80158022
type: "brushend"
80168023
});
8017-
});
8018-
}
8024+
}
8025+
});
80198026
}
80208027
function redraw(g) {
80218028
g.selectAll(".resize").attr("transform", function(d) {

0 commit comments

Comments
 (0)