Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 8f9b75a

Browse files
committed
add _clips and _topclips <g> in makePlotFramework
- instead of having components making <g .clips> before appending their <clipPath>s - IMPORTANT: annotation put is clips in fulLayout._defs, even though annotation draw in `toppaper`. Now, annotations use fullLayout._topclips
1 parent 651399e commit 8f9b75a

File tree

8 files changed

+23
-34
lines changed

8 files changed

+23
-34
lines changed

src/components/annotations/draw.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -194,7 +194,7 @@ function drawRaw(gd, options, index, subplotId, xa, ya) {
194194

195195
var isSizeConstrained = options.width || options.height;
196196

197-
var annTextClip = fullLayout._defs.select('.clips')
197+
var annTextClip = fullLayout._topclips
198198
.selectAll('#' + annClipID)
199199
.data(isSizeConstrained ? [0] : []);
200200

src/plot_api/plot_api.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2748,8 +2748,8 @@ Plotly.purge = function purge(gd) {
27482748
// makePlotFramework: Create the plot container and axes
27492749
// -------------------------------------------------------
27502750
function makePlotFramework(gd) {
2751-
var gd3 = d3.select(gd),
2752-
fullLayout = gd._fullLayout;
2751+
var gd3 = d3.select(gd);
2752+
var fullLayout = gd._fullLayout;
27532753

27542754
// Plot container
27552755
fullLayout._container = gd3.selectAll('.plot-container').data([0]);
@@ -2795,9 +2795,15 @@ function makePlotFramework(gd) {
27952795
fullLayout._defs = fullLayout._paper.append('defs')
27962796
.attr('id', 'defs-' + fullLayout._uid);
27972797

2798+
fullLayout._clips = fullLayout._defs.append('g')
2799+
.classed('clips', true);
2800+
27982801
fullLayout._topdefs = fullLayout._toppaper.append('defs')
27992802
.attr('id', 'topdefs-' + fullLayout._uid);
28002803

2804+
fullLayout._topclips = fullLayout._topdefs.append('g')
2805+
.classed('clips', true);
2806+
28012807
fullLayout._bgLayer = fullLayout._paper.append('g')
28022808
.classed('bglayer', true);
28032809

src/plot_api/subroutines.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -151,8 +151,7 @@ exports.lsInner = function(gd) {
151151
// Clip so that data only shows up on the plot area.
152152
plotinfo.clipId = 'clip' + fullLayout._uid + subplot + 'plot';
153153

154-
var plotClip = fullLayout._defs.selectAll('g.clips')
155-
.selectAll('#' + plotinfo.clipId)
154+
var plotClip = fullLayout._clips.selectAll('#' + plotinfo.clipId)
156155
.data([0]);
157156

158157
plotClip.enter().append('clipPath')

src/plots/cartesian/axes.js

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1620,16 +1620,10 @@ axes.makeClipPaths = function(gd) {
16201620
}
16211621
}
16221622

1623-
var defGroup = defs.selectAll('g.clips')
1624-
.data([0]);
1625-
1626-
defGroup.enter().append('g')
1627-
.classed('clips', true);
1628-
16291623
// selectors don't work right with camelCase tags,
16301624
// have to use class instead
16311625
// https://groups.google.com/forum/#!topic/d3-js/6EpAzQ2gU9I
1632-
var axClips = defGroup.selectAll('.axesclip')
1626+
var axClips = fullLayout._clips.selectAll('.axesclip')
16331627
.data(clipList, function(d) { return d.x._id + d.y._id; });
16341628

16351629
axClips.enter().append('clipPath')

src/plots/geo/geo.js

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -454,15 +454,10 @@ proto.makeFramework = function() {
454454
var fullLayout = _this.graphDiv._fullLayout;
455455
var clipId = 'clip' + fullLayout._uid + _this.id;
456456

457-
var defGroup = fullLayout._defs.selectAll('g.clips')
458-
.data([0]);
459-
defGroup.enter().append('g')
460-
.classed('clips', true);
461-
462-
_this.clipDef = defGroup.append('clipPath')
457+
_this.clipDef = fullLayout._clips.append('clipPath')
463458
.attr('id', clipId);
464459

465-
_this.clipRect = this.clipDef.append('rect');
460+
_this.clipRect = _this.clipDef.append('rect');
466461

467462
_this.framework = d3.select(_this.container).append('g')
468463
.attr('class', 'geo ' + _this.id)

src/plots/ternary/ternary.js

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -70,22 +70,17 @@ proto.plot = function(ternaryCalcData, fullLayout) {
7070
proto.makeFramework = function(fullLayout) {
7171
var _this = this;
7272
var ternaryLayout = fullLayout[_this.id];
73-
74-
var defGroup = _this.defs.selectAll('g.clips')
75-
.data([0]);
76-
defGroup.enter().append('g')
77-
.classed('clips', true);
73+
var clipId = _this.clipId = 'clip' + _this.layoutId + _this.id;
7874

7975
// clippath for this ternary subplot
80-
var clipId = _this.clipId = 'clip' + _this.layoutId + _this.id;
81-
_this.clipDef = defGroup.selectAll('#' + clipId)
76+
_this.clipDef = fullLayout._clips.selectAll('#' + clipId)
8277
.data([0]);
8378
_this.clipDef.enter().append('clipPath').attr('id', clipId)
8479
.append('path').attr('d', 'M0,0Z');
8580

8681
// 'relative' clippath (i.e. no translation) for this ternary subplot
8782
var clipIdRelative = _this.clipIdRelative = 'clip-relative' + _this.layoutId + _this.id;
88-
_this.clipDefRelative = defGroup.selectAll('#' + clipIdRelative)
83+
_this.clipDefRelative = fullLayout._clips.selectAll('#' + clipIdRelative)
8984
.data([0]);
9085
_this.clipDefRelative.enter().append('clipPath').attr('id', clipIdRelative)
9186
.append('path').attr('d', 'M0,0Z');

src/traces/carpet/plot.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ function plotOne(gd, plotinfo, cd) {
3838
fullLayout = gd._fullLayout;
3939

4040
var gridLayer = plotinfo.plot.selectAll('.carpetlayer');
41-
var clipLayer = makeg(fullLayout._defs, 'g', 'clips');
41+
var clipLayer = fullLayout._clips;
4242

4343
var axisLayer = makeg(gridLayer, 'g', 'carpet' + trace.uid).classed('trace', true);
4444
var minorLayer = makeg(axisLayer, 'g', 'minorlayer');

src/traces/contour/plot.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@ function plotOne(gd, plotinfo, cd) {
8686
makeBackground(plotGroup, perimeter, contours);
8787
makeFills(plotGroup, pathinfo, perimeter, contours);
8888
makeLinesAndLabels(plotGroup, pathinfo, gd, cd[0], contours, perimeter);
89-
clipGaps(plotGroup, plotinfo, fullLayout._defs, cd[0], perimeter);
89+
clipGaps(plotGroup, plotinfo, fullLayout._clips, cd[0], perimeter);
9090
}
9191

9292
function emptyPathinfo(contours, plotinfo, cd0) {
@@ -281,7 +281,7 @@ function makeLinesAndLabels(plotgroup, pathinfo, gd, cd0, contours, perimeter) {
281281
var linegroup = exports.createLines(lineContainer, showLines || showLabels, pathinfo);
282282

283283
var lineClip = exports.createLineClip(lineContainer, clipLinesForLabels,
284-
gd._fullLayout._defs, cd0.trace.uid);
284+
gd._fullLayout._clips, cd0.trace.uid);
285285

286286
var labelGroup = plotgroup.selectAll('g.contourlabels')
287287
.data(showLabels ? [0] : []);
@@ -403,10 +403,10 @@ exports.createLines = function(lineContainer, makeLines, pathinfo) {
403403
return linegroup;
404404
};
405405

406-
exports.createLineClip = function(lineContainer, clipLinesForLabels, defs, uid) {
406+
exports.createLineClip = function(lineContainer, clipLinesForLabels, clips, uid) {
407407
var clipId = clipLinesForLabels ? ('clipline' + uid) : null;
408408

409-
var lineClip = defs.select('.clips').selectAll('#' + clipId)
409+
var lineClip = clips.selectAll('#' + clipId)
410410
.data(clipLinesForLabels ? [0] : []);
411411
lineClip.exit().remove();
412412

@@ -630,10 +630,10 @@ exports.drawLabels = function(labelGroup, labelData, gd, lineClip, labelClipPath
630630
}
631631
};
632632

633-
function clipGaps(plotGroup, plotinfo, defs, cd0, perimeter) {
633+
function clipGaps(plotGroup, plotinfo, clips, cd0, perimeter) {
634634
var clipId = 'clip' + cd0.trace.uid;
635635

636-
var clipPath = defs.select('.clips').selectAll('#' + clipId)
636+
var clipPath = clips.selectAll('#' + clipId)
637637
.data(cd0.trace.connectgaps ? [] : [0]);
638638
clipPath.enter().append('clipPath')
639639
.classed('contourclip', true)

0 commit comments

Comments
 (0)