From 7d94ef1eb4874d1abd428ed5380600cc2f395a4e Mon Sep 17 00:00:00 2001 From: archmoj Date: Fri, 8 Oct 2021 21:59:51 -0400 Subject: [PATCH 1/4] cast x to number --- src/lib/svg_text_utils.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/svg_text_utils.js b/src/lib/svg_text_utils.js index 7e4c50c1182..841bb71f11d 100644 --- a/src/lib/svg_text_utils.js +++ b/src/lib/svg_text_utils.js @@ -124,7 +124,7 @@ exports.convertToTspans = function(_context, gd, _callback) { }); newSvg.attr({x: +_context.attr('x'), y: +_context.attr('y')}); } else if(svgClass[0] === 'l') { - newSvg.attr({x: _context.attr('x'), y: dy - (newSvgH / 2)}); + newSvg.attr({x: +_context.attr('x'), y: dy - (newSvgH / 2)}); } else if(svgClass[0] === 'a' && svgClass.indexOf('atitle') !== 0) { newSvg.attr({x: 0, y: dy}); } else { From 13b0212847b506fd3fcb3ad08121c16a7d892fdf Mon Sep 17 00:00:00 2001 From: archmoj Date: Fri, 8 Oct 2021 22:01:18 -0400 Subject: [PATCH 2/4] store and reuse x and y --- src/lib/svg_text_utils.js | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/src/lib/svg_text_utils.js b/src/lib/svg_text_utils.js index 841bb71f11d..e42160b6285 100644 --- a/src/lib/svg_text_utils.js +++ b/src/lib/svg_text_utils.js @@ -111,7 +111,11 @@ exports.convertToTspans = function(_context, gd, _callback) { var newSvgW = getSize(g, 'width'); var newSvgH = getSize(g, 'height'); - var newX = +_context.attr('x') - newSvgW * + + var x = +_context.attr('x'); + var y = +_context.attr('y'); + + var newX = x - newSvgW * {start: 0, middle: 0.5, end: 1}[_context.attr('text-anchor') || 'start']; // font baseline is about 1/4 fontSize below centerline var textHeight = fontSize || getSize(_context, 'height'); @@ -119,16 +123,16 @@ exports.convertToTspans = function(_context, gd, _callback) { if(svgClass[0] === 'y') { mathjaxGroup.attr({ - transform: 'rotate(' + [-90, +_context.attr('x'), +_context.attr('y')] + + transform: 'rotate(' + [-90, x, y] + ')' + strTranslate(-newSvgW / 2, dy - newSvgH / 2) }); - newSvg.attr({x: +_context.attr('x'), y: +_context.attr('y')}); + newSvg.attr({x: x, y: y}); } else if(svgClass[0] === 'l') { - newSvg.attr({x: +_context.attr('x'), y: dy - (newSvgH / 2)}); + newSvg.attr({x: x, y: dy - (newSvgH / 2)}); } else if(svgClass[0] === 'a' && svgClass.indexOf('atitle') !== 0) { newSvg.attr({x: 0, y: dy}); } else { - newSvg.attr({x: newX, y: (+_context.attr('y') + dy - newSvgH / 2)}); + newSvg.attr({x: newX, y: (y + dy - newSvgH / 2)}); } if(_callback) _callback.call(_context, mathjaxGroup); From 35538d63f4c0b52138435746c622ddba036014a5 Mon Sep 17 00:00:00 2001 From: archmoj Date: Fri, 8 Oct 2021 22:05:24 -0400 Subject: [PATCH 3/4] reduce the number of calls to compute newSvg width & height --- src/lib/svg_text_utils.js | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/src/lib/svg_text_utils.js b/src/lib/svg_text_utils.js index e42160b6285..d19492d0eb4 100644 --- a/src/lib/svg_text_utils.js +++ b/src/lib/svg_text_utils.js @@ -11,10 +11,6 @@ var LINE_SPACING = require('../constants/alignment').LINE_SPACING; // text converter -function getSize(_selection, _dimension) { - return _selection.node().getBoundingClientRect()[_dimension]; -} - var FIND_TEX = /([^$]*)([$]+[^$]*[$]+)([^$]*)/; exports.convertToTspans = function(_context, gd, _callback) { @@ -109,8 +105,9 @@ exports.convertToTspans = function(_context, gd, _callback) { var g = newSvg.select('g'); g.attr({fill: fill, stroke: fill}); - var newSvgW = getSize(g, 'width'); - var newSvgH = getSize(g, 'height'); + var gBB = g.node().getBoundingClientRect(); + var newSvgW = gBB.width; + var newSvgH = gBB.height; var x = +_context.attr('x'); var y = +_context.attr('y'); @@ -118,7 +115,7 @@ exports.convertToTspans = function(_context, gd, _callback) { var newX = x - newSvgW * {start: 0, middle: 0.5, end: 1}[_context.attr('text-anchor') || 'start']; // font baseline is about 1/4 fontSize below centerline - var textHeight = fontSize || getSize(_context, 'height'); + var textHeight = fontSize || _context.node().getBoundingClientRect().height; var dy = -textHeight / 4; if(svgClass[0] === 'y') { From 06048c79c0c48a32ed6805da9ee2ae80ca970621 Mon Sep 17 00:00:00 2001 From: archmoj Date: Mon, 18 Oct 2021 11:15:23 -0400 Subject: [PATCH 4/4] draft log for PR 5976 --- draftlogs/5976_fix.md | 1 + 1 file changed, 1 insertion(+) create mode 100644 draftlogs/5976_fix.md diff --git a/draftlogs/5976_fix.md b/draftlogs/5976_fix.md new file mode 100644 index 00000000000..8f7756e4fb0 --- /dev/null +++ b/draftlogs/5976_fix.md @@ -0,0 +1 @@ + - Reduce calls to `getBoundingClientRect` in `convertToTspans` [[#5976](https://github.com/plotly/plotly.js/pull/5976)]