Skip to content

Commit bc6a831

Browse files
Filmbostock
andauthored
clip supports band scales (#950)
* clip supports band scales closes #949 Co-authored-by: Mike Bostock <[email protected]>
1 parent 6a442e3 commit bc6a831

File tree

20 files changed

+160
-100
lines changed

20 files changed

+160
-100
lines changed

src/marks/area.js

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -36,14 +36,13 @@ export class Area extends Mark {
3636
filter(index) {
3737
return index;
3838
}
39-
render(I, {x, y}, channels, dimensions) {
39+
render(index, scales, channels, dimensions) {
4040
const {x1: X1, y1: Y1, x2: X2 = X1, y2: Y2 = Y1} = channels;
41-
const {dx, dy} = this;
4241
return create("svg:g")
43-
.call(applyIndirectStyles, this, dimensions)
44-
.call(applyTransform, x, y, dx, dy)
42+
.call(applyIndirectStyles, this, scales, dimensions)
43+
.call(applyTransform, this, scales, 0, 0)
4544
.call(g => g.selectAll()
46-
.data(groupIndex(I, [X1, Y1, X2, Y2], this, channels))
45+
.data(groupIndex(index, [X1, Y1, X2, Y2], this, channels))
4746
.enter()
4847
.append("path")
4948
.call(applyDirectStyles, this)

src/marks/arrow.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import {create} from "d3";
22
import {radians} from "../math.js";
33
import {Mark} from "../plot.js";
4-
import {applyChannelStyles, applyDirectStyles, applyIndirectStyles, applyTransform, offset} from "../style.js";
4+
import {applyChannelStyles, applyDirectStyles, applyIndirectStyles, applyTransform} from "../style.js";
55
import {maybeSameValue} from "./link.js";
66
import {constant} from "../options.js";
77

@@ -45,9 +45,9 @@ export class Arrow extends Mark {
4545
this.insetStart = +insetStart;
4646
this.insetEnd = +insetEnd;
4747
}
48-
render(index, {x, y}, channels, dimensions) {
48+
render(index, scales, channels, dimensions) {
4949
const {x1: X1, y1: Y1, x2: X2 = X1, y2: Y2 = Y1, SW} = channels;
50-
const {dx, dy, strokeWidth, bend, headAngle, headLength, insetStart, insetEnd} = this;
50+
const {strokeWidth, bend, headAngle, headLength, insetStart, insetEnd} = this;
5151
const sw = SW ? i => SW[i] : constant(strokeWidth === undefined ? 1 : strokeWidth);
5252

5353
// When bending, the offset between the straight line between the two points
@@ -66,8 +66,8 @@ export class Arrow extends Mark {
6666
const wingScale = headLength / 1.5;
6767

6868
return create("svg:g")
69-
.call(applyIndirectStyles, this, dimensions)
70-
.call(applyTransform, x, y, offset + dx, offset + dy)
69+
.call(applyIndirectStyles, this, scales, dimensions)
70+
.call(applyTransform, this, scales)
7171
.call(g => g.selectAll()
7272
.data(index)
7373
.enter()

src/marks/bar.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,10 @@ export class AbstractBar extends Mark {
1919
this.ry = impliedString(ry, "auto");
2020
}
2121
render(index, scales, channels, dimensions) {
22-
const {dx, dy, rx, ry} = this;
22+
const {rx, ry} = this;
2323
return create("svg:g")
24-
.call(applyIndirectStyles, this, dimensions)
25-
.call(this._transform, scales, dx, dy)
24+
.call(applyIndirectStyles, this, scales, dimensions)
25+
.call(this._transform, this, scales)
2626
.call(g => g.selectAll()
2727
.data(index)
2828
.enter()
@@ -75,8 +75,8 @@ export class BarX extends AbstractBar {
7575
defaults
7676
);
7777
}
78-
_transform(selection, {x}, dx, dy) {
79-
selection.call(applyTransform, x, null, dx, dy);
78+
_transform(selection, mark, {x}) {
79+
selection.call(applyTransform, mark, {x}, 0, 0);
8080
}
8181
_x({x}, {x1: X1, x2: X2}, {marginLeft}) {
8282
const {insetLeft} = this;
@@ -102,8 +102,8 @@ export class BarY extends AbstractBar {
102102
defaults
103103
);
104104
}
105-
_transform(selection, {y}, dx, dy) {
106-
selection.call(applyTransform, null, y, dx, dy);
105+
_transform(selection, mark, {y}) {
106+
selection.call(applyTransform, mark, {y}, 0, 0);
107107
}
108108
_y({y}, {y1: Y1, y2: Y2}, {marginTop}) {
109109
const {insetTop} = this;

src/marks/delaunay.js

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import {create, group, path, select, Delaunay} from "d3";
22
import {Curve} from "../curve.js";
33
import {constant, maybeTuple, maybeZ} from "../options.js";
44
import {Mark} from "../plot.js";
5-
import {applyChannelStyles, applyDirectStyles, applyFrameAnchor, applyIndirectStyles, applyTransform, offset} from "../style.js";
5+
import {applyChannelStyles, applyDirectStyles, applyFrameAnchor, applyIndirectStyles, applyTransform} from "../style.js";
66
import {markers, applyMarkers} from "./marker.js";
77

88
const delaunayLinkDefaults = {
@@ -57,9 +57,9 @@ class DelaunayLink extends Mark {
5757
this.curve = Curve(curve, tension);
5858
markers(this, options);
5959
}
60-
render(index, {x, y}, channels, dimensions) {
60+
render(index, scales, channels, dimensions) {
6161
const {x: X, y: Y, z: Z} = channels;
62-
const {dx, dy, curve} = this;
62+
const {curve} = this;
6363
const [cx, cy] = applyFrameAnchor(this, dimensions);
6464
const xi = X ? i => X[i] : constant(cx);
6565
const yi = Y ? i => Y[i] : constant(cy);
@@ -114,8 +114,8 @@ class DelaunayLink extends Mark {
114114
}
115115

116116
return create("svg:g")
117-
.call(applyIndirectStyles, this, dimensions)
118-
.call(applyTransform, x, y, offset + dx, offset + dy)
117+
.call(applyIndirectStyles, this, scales, dimensions)
118+
.call(applyTransform, this, scales)
119119
.call(Z
120120
? g => g.selectAll().data(group(index, i => Z[i]).values()).enter().append("g").each(links)
121121
: g => g.datum(index).each(links))
@@ -137,9 +137,8 @@ class AbstractDelaunayMark extends Mark {
137137
defaults
138138
);
139139
}
140-
render(index, {x, y}, channels, dimensions) {
140+
render(index, scales, channels, dimensions) {
141141
const {x: X, y: Y, z: Z} = channels;
142-
const {dx, dy} = this;
143142
const [cx, cy] = applyFrameAnchor(this, dimensions);
144143
const xi = X ? i => X[i] : constant(cx);
145144
const yi = Y ? i => Y[i] : constant(cy);
@@ -155,8 +154,8 @@ class AbstractDelaunayMark extends Mark {
155154
}
156155

157156
return create("svg:g")
158-
.call(applyIndirectStyles, this, dimensions)
159-
.call(applyTransform, x, y, offset + dx, offset + dy)
157+
.call(applyIndirectStyles, this, scales, dimensions)
158+
.call(applyTransform, this, scales)
160159
.call(Z
161160
? g => g.selectAll().data(group(index, i => Z[i]).values()).enter().append("g").each(mesh)
162161
: g => g.datum(index).each(mesh))
@@ -197,9 +196,8 @@ class Voronoi extends Mark {
197196
voronoiDefaults
198197
);
199198
}
200-
render(index, {x, y}, channels, dimensions) {
199+
render(index, scales, channels, dimensions) {
201200
const {x: X, y: Y, z: Z} = channels;
202-
const {dx, dy} = this;
203201
const [cx, cy] = applyFrameAnchor(this, dimensions);
204202
const xi = X ? i => X[i] : constant(cx);
205203
const yi = Y ? i => Y[i] : constant(cy);
@@ -218,8 +216,8 @@ class Voronoi extends Mark {
218216
}
219217

220218
return create("svg:g")
221-
.call(applyIndirectStyles, this, dimensions)
222-
.call(applyTransform, x, y, offset + dx, offset + dy)
219+
.call(applyIndirectStyles, this, scales, dimensions)
220+
.call(applyTransform, this, scales)
223221
.call(Z
224222
? g => g.selectAll().data(group(index, i => Z[i]).values()).enter().append("g").each(cells)
225223
: g => g.datum(index).each(cells))

src/marks/dot.js

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import {create, path, symbolCircle} from "d3";
22
import {positive} from "../defined.js";
33
import {identity, maybeFrameAnchor, maybeNumberChannel, maybeTuple} from "../options.js";
44
import {Mark} from "../plot.js";
5-
import {applyChannelStyles, applyDirectStyles, applyFrameAnchor, applyIndirectStyles, applyTransform, offset} from "../style.js";
5+
import {applyChannelStyles, applyDirectStyles, applyFrameAnchor, applyIndirectStyles, applyTransform} from "../style.js";
66
import {maybeSymbolChannel} from "../symbols.js";
77
import {sort} from "../transforms/basic.js";
88
import {maybeIntervalMidX, maybeIntervalMidY} from "../transforms/interval.js";
@@ -51,14 +51,13 @@ export class Dot extends Mark {
5151
};
5252
}
5353
}
54-
render(index, {x, y}, channels, dimensions) {
54+
render(index, scales, channels, dimensions) {
5555
const {x: X, y: Y, r: R, rotate: A, symbol: S} = channels;
56-
const {dx, dy} = this;
5756
const [cx, cy] = applyFrameAnchor(this, dimensions);
5857
const circle = this.symbol === symbolCircle;
5958
return create("svg:g")
60-
.call(applyIndirectStyles, this, dimensions)
61-
.call(applyTransform, x, y, offset + dx, offset + dy)
59+
.call(applyIndirectStyles, this, scales, dimensions)
60+
.call(applyTransform, this, scales)
6261
.call(g => g.selectAll()
6362
.data(index)
6463
.enter()

src/marks/frame.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import {create} from "d3";
22
import {Mark} from "../plot.js";
33
import {number} from "../options.js";
4-
import {applyDirectStyles, applyIndirectStyles, applyTransform, offset} from "../style.js";
4+
import {applyDirectStyles, applyIndirectStyles, applyTransform} from "../style.js";
55

66
const defaults = {
77
ariaLabel: "frame",
@@ -24,13 +24,13 @@ export class Frame extends Mark {
2424
this.insetBottom = number(insetBottom);
2525
this.insetLeft = number(insetLeft);
2626
}
27-
render(I, scales, channels, dimensions) {
27+
render(index, scales, channels, dimensions) {
2828
const {marginTop, marginRight, marginBottom, marginLeft, width, height} = dimensions;
29-
const {insetTop, insetRight, insetBottom, insetLeft, dx, dy} = this;
29+
const {insetTop, insetRight, insetBottom, insetLeft} = this;
3030
return create("svg:rect")
31-
.call(applyIndirectStyles, this, dimensions)
31+
.call(applyIndirectStyles, this, scales, dimensions)
3232
.call(applyDirectStyles, this)
33-
.call(applyTransform, null, null, offset + dx, offset + dy)
33+
.call(applyTransform, this, {})
3434
.attr("x", marginLeft + insetLeft)
3535
.attr("y", marginTop + insetTop)
3636
.attr("width", width - marginLeft - marginRight - insetLeft - insetRight)

src/marks/hexgrid.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ export class Hexgrid extends Mark {
2222
this.binWidth = number(binWidth);
2323
}
2424
render(index, scales, channels, dimensions) {
25-
const {dx, dy, binWidth} = this;
25+
const {binWidth} = this;
2626
const {marginTop, marginRight, marginBottom, marginLeft, width, height} = dimensions;
2727
const x0 = marginLeft - ox, x1 = width - marginRight - ox, y0 = marginTop - oy, y1 = height - marginBottom - oy;
2828
const rx = binWidth / 2, ry = rx * sqrt4_3, hy = ry / 2, wx = rx * 2, wy = ry * 1.5;
@@ -36,10 +36,10 @@ export class Hexgrid extends Mark {
3636
}
3737
}
3838
return create("svg:g")
39-
.call(applyIndirectStyles, this, dimensions)
39+
.call(applyIndirectStyles, this, scales, dimensions)
4040
.call(g => g.append("path")
4141
.call(applyDirectStyles, this)
42-
.call(applyTransform, null, null, offset + dx + ox, offset + dy + oy)
42+
.call(applyTransform, this, {}, offset + ox, offset + oy)
4343
.attr("d", m.join("")))
4444
.node();
4545
}

src/marks/image.js

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import {create} from "d3";
22
import {positive} from "../defined.js";
33
import {maybeFrameAnchor, maybeNumberChannel, maybeTuple, string} from "../options.js";
44
import {Mark} from "../plot.js";
5-
import {applyChannelStyles, applyDirectStyles, applyIndirectStyles, applyTransform, applyAttr, offset, impliedString, applyFrameAnchor} from "../style.js";
5+
import {applyChannelStyles, applyDirectStyles, applyIndirectStyles, applyTransform, applyAttr, impliedString, applyFrameAnchor} from "../style.js";
66

77
const defaults = {
88
ariaLabel: "image",
@@ -59,13 +59,12 @@ export class Image extends Mark {
5959
this.crossOrigin = string(crossOrigin);
6060
this.frameAnchor = maybeFrameAnchor(frameAnchor);
6161
}
62-
render(index, {x, y}, channels, dimensions) {
62+
render(index, scales, channels, dimensions) {
6363
const {x: X, y: Y, width: W, height: H, src: S} = channels;
64-
const {dx, dy} = this;
6564
const [cx, cy] = applyFrameAnchor(this, dimensions);
6665
return create("svg:g")
67-
.call(applyIndirectStyles, this, dimensions)
68-
.call(applyTransform, x, y, offset + dx, offset + dy)
66+
.call(applyIndirectStyles, this, scales, dimensions)
67+
.call(applyTransform, this, scales)
6968
.call(g => g.selectAll()
7069
.data(index)
7170
.enter()

src/marks/line.js

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import {create, line as shapeLine} from "d3";
22
import {Curve} from "../curve.js";
33
import {Mark} from "../plot.js";
44
import {indexOf, identity, maybeTuple, maybeZ} from "../options.js";
5-
import {applyDirectStyles, applyIndirectStyles, applyTransform, applyGroupedChannelStyles, offset, groupIndex} from "../style.js";
5+
import {applyDirectStyles, applyIndirectStyles, applyTransform, applyGroupedChannelStyles, groupIndex} from "../style.js";
66
import {maybeDenseIntervalX, maybeDenseIntervalY} from "../transforms/bin.js";
77
import {applyGroupedMarkers, markers} from "./marker.js";
88

@@ -36,14 +36,13 @@ export class Line extends Mark {
3636
filter(index) {
3737
return index;
3838
}
39-
render(I, {x, y}, channels, dimensions) {
39+
render(index, scales, channels, dimensions) {
4040
const {x: X, y: Y} = channels;
41-
const {dx, dy} = this;
4241
return create("svg:g")
43-
.call(applyIndirectStyles, this, dimensions)
44-
.call(applyTransform, x, y, offset + dx, offset + dy)
42+
.call(applyIndirectStyles, this, scales, dimensions)
43+
.call(applyTransform, this, scales)
4544
.call(g => g.selectAll()
46-
.data(groupIndex(I, [X, Y], this, channels))
45+
.data(groupIndex(index, [X, Y], this, channels))
4746
.enter()
4847
.append("path")
4948
.call(applyDirectStyles, this)

src/marks/linearRegression.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import {create, extent, range, sum, area as shapeArea, namespaces} from "d3";
22
import {identity, indexOf, isNone, isNoneish, maybeZ} from "../options.js";
33
import {Mark} from "../plot.js";
44
import {qt} from "../stats.js";
5-
import {applyDirectStyles, applyGroupedChannelStyles, applyIndirectStyles, applyTransform, groupZ, offset} from "../style.js";
5+
import {applyDirectStyles, applyGroupedChannelStyles, applyIndirectStyles, applyTransform, groupZ} from "../style.js";
66
import {maybeDenseIntervalX, maybeDenseIntervalY} from "../transforms/bin.js";
77

88
const defaults = {
@@ -35,14 +35,14 @@ class LinearRegression extends Mark {
3535
if (!(0 <= this.ci && this.ci < 1)) throw new Error(`invalid ci; not in [0, 1): ${ci}`);
3636
if (!(this.precision > 0)) throw new Error(`invalid precision: ${precision}`);
3737
}
38-
render(I, {x, y}, channels, dimensions) {
38+
render(index, scales, channels, dimensions) {
3939
const {x: X, y: Y, z: Z} = channels;
40-
const {dx, dy, ci} = this;
40+
const {ci} = this;
4141
return create("svg:g")
42-
.call(applyIndirectStyles, this, dimensions)
43-
.call(applyTransform, x, y, offset + dx, offset + dy)
42+
.call(applyIndirectStyles, this, scales, dimensions)
43+
.call(applyTransform, this, scales)
4444
.call(g => g.selectAll()
45-
.data(Z ? groupZ(I, Z, this.z) : [I])
45+
.data(Z ? groupZ(index, Z, this.z) : [index])
4646
.enter()
4747
.call(enter => enter.append("path")
4848
.attr("fill", "none")

0 commit comments

Comments
 (0)