Use a canvas to measure the width of the text layer div instead of using the slow offsetWidth property
This commit is contained in:
parent
e2b0c76585
commit
12b799cd02
@ -1498,6 +1498,9 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv) {
|
||||
var renderInterval = 0;
|
||||
var resumeInterval = 500; // in ms
|
||||
|
||||
var canvas = document.createElement('canvas');
|
||||
var ctx = canvas.getContext('2d');
|
||||
|
||||
// Render the text layer, one div at a time
|
||||
function renderTextLayer() {
|
||||
if (textDivs.length === 0) {
|
||||
@ -1511,9 +1514,12 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv) {
|
||||
|
||||
if (textDiv.dataset.textLength > 1) { // avoid div by zero
|
||||
// Adjust div width to match canvas text
|
||||
// Due to the .offsetWidth calls, this is slow
|
||||
// This needs to come after appending to the DOM
|
||||
var textScale = textDiv.dataset.canvasWidth / textDiv.offsetWidth;
|
||||
|
||||
ctx.font = textDiv.style.fontSize + ' sans-serif';
|
||||
var width = ctx.measureText(textDiv.textContent).width;
|
||||
|
||||
var textScale = textDiv.dataset.canvasWidth / width;
|
||||
|
||||
CustomStyle.setProp('transform' , textDiv,
|
||||
'scale(' + textScale + ', 1)');
|
||||
CustomStyle.setProp('transformOrigin' , textDiv, '0% 0%');
|
||||
|
Loading…
Reference in New Issue
Block a user