Sakurai/pdf.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Optimize TextLayerBuilder_renderLayer() for text heavy documents.

Browse Source 
This change improves the text layer creation of "normal" text heavy documents.
It changes 2 things:
 * If the text element is not rotated, it will neither calculate nor apply a
   textTransform: rotate(0deg) to the text layer element.
 * For scaling the text layer div, the context will measure the width of the
   text in the given font. For many text documents the font changes seldom.
   If the font stays the same, the context does not need to be set to a new font
   especially avoiding the temporary creation of the same font string over and
   over again.
This commit is contained in:
Fabian Lange 2014-08-05 23:47:16 +02:00
parent 12b50486de
commit 39129fc441
1 changed files with 38 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
web/text_layer_builder.js
View File

@ -56,20 +56,34 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
return;
}
var lastFontSize;
var lastFontFamily;
for (var i = 0; i < textDivsLength; i++) {
var textDiv = textDivs[i];
if (textDiv.dataset.isWhitespace !== undefined) {
continue;
}
ctx.font = textDiv.style.fontSize + ' ' + textDiv.style.fontFamily;
var fontSize = textDiv.style.fontSize;
var fontFamily = textDiv.style.fontFamily;
// Only build font string and set to context if different from last.
if (fontSize !== lastFontSize || fontFamily !== lastFontFamily) {
ctx.font = fontSize + ' ' + fontFamily;
lastFontSize = fontSize;
lastFontFamily = fontFamily;
}
var width = ctx.measureText(textDiv.textContent).width;
if (width > 0) {
textLayerFrag.appendChild(textDiv);
// Dataset values come of type string.
var textScale = textDiv.dataset.canvasWidth / width;
var rotation = textDiv.dataset.angle;
var transform = 'scale(' + textScale + ', 1)';
transform = 'rotate(' + rotation + 'deg) ' + transform;
if (rotation) {
transform = 'rotate(' + rotation + 'deg) ' + transform;
}
CustomStyle.setProp('transform' , textDiv, transform);
CustomStyle.setProp('transformOrigin' , textDiv, '0% 0%');
}
@ -114,18 +128,34 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
angle += Math.PI / 2;
}
var fontHeight = Math.sqrt((tx[2] * tx[2]) + (tx[3] * tx[3]));
var fontAscent = (style.ascent ? style.ascent * fontHeight :
(style.descent ? (1 + style.descent) * fontHeight : fontHeight));
var fontAscent = fontHeight;
if (style.ascent) {
fontAscent = style.ascent * fontAscent;
} else if (style.descent) {
fontAscent = (1 + style.descent) * fontAscent;
}
var left;
var top;
if (angle === 0) {
left = tx[4];
top = tx[5] - fontAscent;
} else {
left = tx[4] + (fontAscent * Math.sin(angle));
top = tx[5] - (fontAscent * Math.cos(angle));
}
textDiv.style.position = 'absolute';
textDiv.style.left = (tx[4] + (fontAscent * Math.sin(angle))) + 'px';
textDiv.style.top = (tx[5] - (fontAscent * Math.cos(angle))) + 'px';
textDiv.style.left = left + 'px';
textDiv.style.top = top + 'px';
textDiv.style.fontSize = fontHeight + 'px';
textDiv.style.fontFamily = style.fontFamily;
textDiv.textContent = geom.str;
textDiv.dataset.fontName = geom.fontName;
textDiv.dataset.angle = angle * (180 / Math.PI);
// Storing into dataset will convert number into string.
if (angle !== 0) {
textDiv.dataset.angle = angle * (180 / Math.PI);
}
if (style.vertical) {
textDiv.dataset.canvasWidth = geom.height * this.viewport.scale;
} else {
@ -249,7 +279,7 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
var end = match.end;
var isSelected = (isSelectedPage && i === selectedMatchIdx);
var highlightSuffix = (isSelected ? ' selected' : '');
if (isSelected && !this.isViewerInPresentationMode) {
scrollIntoView(textDivs[begin.divIdx],
{ top: FIND_SCROLL_OFFSET_TOP,
@ -324,4 +354,3 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
};
return TextLayerBuilder;
})();