Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Commit 9becb7c

Browse filesBrowse files
etpinardetpinard
committed
hide points using display: 'none' instead of visibility attr
- `display: 'none'` completely removes the elements from the rendering pipeline as is likely faster is all browsers.
1 parent 091473b commit 9becb7c
Copy full SHA for 9becb7c

File tree

4 files changed

+25
-25
lines changed
Filter options

4 files changed

+25
-25
lines changed

‎src/components/drawing/index.js

Copy file name to clipboardExpand all lines: src/components/drawing/index.js
+2-2Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -95,8 +95,8 @@ drawing.translatePoints = function(s, xa, ya) {
9595

9696
drawing.hideOutsideRangePoint = function(d, sel, xa, ya) {
9797
sel.attr(
98-
'visibility',
99-
xa.isPtWithinRange(d) && ya.isPtWithinRange(d) ? null : 'hidden'
98+
'display',
99+
xa.isPtWithinRange(d) && ya.isPtWithinRange(d) ? null : 'none'
100100
);
101101
};
102102

‎test/jasmine/assets/custom_assertions.js

Copy file name to clipboardExpand all lines: test/jasmine/assets/custom_assertions.js
+4-4Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -64,12 +64,12 @@ exports.assertClip = function(sel, isClipped, size, msg) {
6464

6565
};
6666

67-
exports.assertNodeVisibility = function(sel, expectation, msg) {
67+
exports.assertNodeDisplay = function(sel, expectation, msg) {
6868
expect(sel.size())
69-
.toBe(expectation.length, msg + ' visibility (selection size)');
69+
.toBe(expectation.length, msg + ' display (selection size)');
7070

7171
sel.each(function(d, i) {
72-
expect(d3.select(this).attr('visibility'))
73-
.toBe(expectation[i], msg + ' visibility ' + '(item ' + i + ')');
72+
expect(d3.select(this).attr('display'))
73+
.toBe(expectation[i], msg + ' display ' + '(item ' + i + ')');
7474
});
7575
};

‎test/jasmine/tests/scatter_test.js

Copy file name to clipboardExpand all lines: test/jasmine/tests/scatter_test.js
+8-8Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ var customAssertions = require('../assets/custom_assertions');
1212
var fail = require('../assets/fail_test');
1313

1414
var assertClip = customAssertions.assertClip;
15-
var assertNodeVisibility = customAssertions.assertNodeVisibility;
15+
var assertNodeDisplay = customAssertions.assertNodeDisplay;
1616

1717
describe('Test scatter', function() {
1818
'use strict';
@@ -690,22 +690,22 @@ describe('Test scatter *clipnaxis*', function() {
690690
// add lines
691691
fig.data[0].mode = 'markers+lines+text';
692692

693-
function _assert(layerClips, nodeVisibilities, errorBarClips, lineClips) {
693+
function _assert(layerClips, nodeDisplays, errorBarClips, lineClips) {
694694
var subplotLayer = d3.select('.plot');
695695
var scatterLayer = subplotLayer.select('.scatterlayer');
696696

697697
assertClip(subplotLayer, layerClips[0], 1, 'subplot layer');
698698
assertClip(subplotLayer.select('.barlayer'), layerClips[1], 1, 'bar layer');
699699
assertClip(scatterLayer, layerClips[2], 1, 'scatter layer');
700700

701-
assertNodeVisibility(
701+
assertNodeDisplay(
702702
scatterLayer.selectAll('.point'),
703-
nodeVisibilities,
703+
nodeDisplays,
704704
'scatter points'
705705
);
706-
assertNodeVisibility(
706+
assertNodeDisplay(
707707
scatterLayer.selectAll('.textpoint'),
708-
nodeVisibilities,
708+
nodeDisplays,
709709
'scatter text points'
710710
);
711711

@@ -779,7 +779,7 @@ describe('Test scatter *clipnaxis*', function() {
779779
.then(function() {
780780
_assert(
781781
[false, true, false],
782-
[null, null, 'hidden', 'hidden', 'hidden', 'hidden'],
782+
[null, null, 'none', 'none', 'none', 'none'],
783783
[true, 6],
784784
[true, 1]
785785
);
@@ -788,7 +788,7 @@ describe('Test scatter *clipnaxis*', function() {
788788
.then(function() {
789789
_assert(
790790
[false, true, false],
791-
['hidden', null, 'hidden', 'hidden', 'hidden', 'hidden'],
791+
['none', null, 'none', 'none', 'none', 'none'],
792792
[true, 6],
793793
[true, 1]
794794
);

‎test/jasmine/tests/scatterternary_test.js

Copy file name to clipboardExpand all lines: test/jasmine/tests/scatterternary_test.js
+11-11Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ var customMatchers = require('../assets/custom_matchers');
1111
var customAssertions = require('../assets/custom_assertions');
1212

1313
var assertClip = customAssertions.assertClip;
14-
var assertNodeVisibility = customAssertions.assertNodeVisibility;
14+
var assertNodeDisplay = customAssertions.assertNodeDisplay;
1515

1616
describe('scatterternary defaults', function() {
1717
'use strict';
@@ -386,21 +386,21 @@ describe('Test scatterternary *cliponaxis*', function() {
386386
var gd = createGraphDiv();
387387
var fig = Lib.extendDeep({}, require('@mocks/ternary_markers.json'));
388388

389-
function _assert(layerClips, nodeVisibilities, lineClips) {
389+
function _assert(layerClips, nodeDisplays, lineClips) {
390390
var frontLayer = d3.select('.frontplot');
391391
var scatterLayer = d3.select('.scatterlayer');
392392

393393
assertClip(frontLayer, layerClips[0], 1, 'front layer');
394394
assertClip(scatterLayer, layerClips[1], 1, 'scatter layer');
395395

396-
assertNodeVisibility(
396+
assertNodeDisplay(
397397
scatterLayer.selectAll('.point'),
398-
nodeVisibilities,
398+
nodeDisplays,
399399
'scatter points'
400400
);
401-
assertNodeVisibility(
401+
assertNodeDisplay(
402402
scatterLayer.selectAll('.textpoint'),
403-
nodeVisibilities,
403+
nodeDisplays,
404404
'scatter text points'
405405
);
406406

@@ -415,7 +415,7 @@ describe('Test scatterternary *cliponaxis*', function() {
415415
.then(function() {
416416
_assert(
417417
[false, false],
418-
[null, 'hidden', null, null, null, null, null, null, 'hidden', 'hidden', 'hidden'],
418+
[null, 'none', null, null, null, null, null, null, 'none', 'none', 'none'],
419419
[true, 1]
420420
);
421421
return Plotly.restyle(gd, 'visible', 'legendonly');
@@ -439,31 +439,31 @@ describe('Test scatterternary *cliponaxis*', function() {
439439
.then(function() {
440440
_assert(
441441
[false, false],
442-
[null, 'hidden', null, null, null, null, null, null, 'hidden', 'hidden', 'hidden'],
442+
[null, 'none', null, null, null, null, null, null, 'none', 'none', 'none'],
443443
[true, 1]
444444
);
445445
return Plotly.relayout(gd, 'ternary.aaxis.min', 20);
446446
})
447447
.then(function() {
448448
_assert(
449449
[false, false],
450-
[null, 'hidden', null, 'hidden', 'hidden', 'hidden', null, 'hidden', 'hidden', 'hidden', 'hidden'],
450+
[null, 'none', null, 'none', 'none', 'none', null, 'none', 'none', 'none', 'none'],
451451
[true, 1]
452452
);
453453
return Plotly.relayout(gd, 'ternary.baxis.min', 40);
454454
})
455455
.then(function() {
456456
_assert(
457457
[false, false],
458-
['hidden', 'hidden', 'hidden', 'hidden', 'hidden', 'hidden', null, 'hidden', 'hidden', 'hidden', 'hidden'],
458+
['none', 'none', 'none', 'none', 'none', 'none', null, 'none', 'none', 'none', 'none'],
459459
[true, 1]
460460
);
461461
return Plotly.relayout(gd, 'ternary.caxis.min', 30);
462462
})
463463
.then(function() {
464464
_assert(
465465
[false, false],
466-
['hidden', 'hidden', 'hidden', 'hidden', 'hidden', 'hidden', 'hidden', 'hidden', 'hidden', 'hidden', 'hidden'],
466+
['none', 'none', 'none', 'none', 'none', 'none', 'none', 'none', 'none', 'none', 'none'],
467467
[true, 1]
468468
);
469469
return Plotly.relayout(gd, {

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.