mirror of
https://github.com/zen-browser/pdf.js.git
synced 2025-07-10 10:15:37 +02:00
Implements shading types 4-7
This commit is contained in:
Yury Delendik
parent
59526a7cf1
commit
a583c319a1
6 changed files with 3587 additions and 9 deletions
|
|
@ -15,7 +15,7 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
/* globals CanvasGraphics, CachedCanvases, ColorSpace, Util, error, info,
|
||||
isArray */
|
||||
isArray, makeCssRgb */
|
||||
|
||||
'use strict';
|
||||
|
||||
|
|
@ -49,6 +49,186 @@ ShadingIRs.RadialAxial = {
|
|||
}
|
||||
};
|
||||
|
||||
var createMeshCanvas = (function createMeshCanvasClosure() {
|
||||
function drawTriangle(data, context, p1, p2, p3, c1, c2, c3) {
|
||||
// Very basic Gouraud-shaded triangle rasterization algorithm.
|
||||
var coords = context.coords, colors = context.colors;
|
||||
var bytes = data.data, rowSize = data.width * 4;
|
||||
var tmp;
|
||||
if (coords[p1 * 2 + 1] > coords[p2 * 2 + 1]) {
|
||||
tmp = p1; p1 = p2; p2 = tmp; tmp = c1; c1 = c2; c2 = tmp;
|
||||
}
|
||||
if (coords[p2 * 2 + 1] > coords[p3 * 2 + 1]) {
|
||||
tmp = p2; p2 = p3; p3 = tmp; tmp = c2; c2 = c3; c3 = tmp;
|
||||
}
|
||||
if (coords[p1 * 2 + 1] > coords[p2 * 2 + 1]) {
|
||||
tmp = p1; p1 = p2; p2 = tmp; tmp = c1; c1 = c2; c2 = tmp;
|
||||
}
|
||||
var x1 = (coords[p1 * 2] + context.offsetX) * context.scaleX;
|
||||
var y1 = (coords[p1 * 2 + 1] + context.offsetY) * context.scaleY;
|
||||
var x2 = (coords[p2 * 2] + context.offsetX) * context.scaleX;
|
||||
var y2 = (coords[p2 * 2 + 1] + context.offsetY) * context.scaleY;
|
||||
var x3 = (coords[p3 * 2] + context.offsetX) * context.scaleX;
|
||||
var y3 = (coords[p3 * 2 + 1] + context.offsetY) * context.scaleY;
|
||||
if (y1 >= y3) {
|
||||
return;
|
||||
}
|
||||
var c1i = c1 * 3, c2i = c2 * 3, c3i = c3 * 3;
|
||||
var c1r = colors[c1i], c1g = colors[c1i + 1], c1b = colors[c1i + 2];
|
||||
var c2r = colors[c2i], c2g = colors[c2i + 1], c2b = colors[c2i + 2];
|
||||
var c3r = colors[c3i], c3g = colors[c3i + 1], c3b = colors[c3i + 2];
|
||||
|
||||
var minY = Math.round(y1), maxY = Math.round(y3);
|
||||
var xa, car, cag, cab;
|
||||
var xb, cbr, cbg, cbb;
|
||||
var k;
|
||||
for (var y = minY; y <= maxY; y++) {
|
||||
if (y < y2) {
|
||||
k = y < y1 ? 0 : y1 === y2 ? 1 : (y1 - y) / (y1 - y2);
|
||||
xa = x1 - (x1 - x2) * k;
|
||||
car = c1r - (c1r - c2r) * k;
|
||||
cag = c1g - (c1g - c2g) * k;
|
||||
cab = c1b - (c1b - c2b) * k;
|
||||
} else {
|
||||
k = y > y3 ? 1 : y2 === y3 ? 0 : (y2 - y) / (y2 - y3);
|
||||
xa = x2 - (x2 - x3) * k;
|
||||
car = c2r - (c2r - c3r) * k;
|
||||
cag = c2g - (c2g - c3g) * k;
|
||||
cab = c2b - (c2b - c3b) * k;
|
||||
}
|
||||
k = y < y1 ? 0 : y > y3 ? 1 : (y1 - y) / (y1 - y3);
|
||||
xb = x1 - (x1 - x3) * k;
|
||||
cbr = c1r - (c1r - c3r) * k;
|
||||
cbg = c1g - (c1g - c3g) * k;
|
||||
cbb = c1b - (c1b - c3b) * k;
|
||||
var x1_ = Math.round(Math.min(xa, xb));
|
||||
var x2_ = Math.round(Math.max(xa, xb));
|
||||
var j = rowSize * y + x1_ * 4;
|
||||
for (var x = x1_; x <= x2_; x++) {
|
||||
k = (xa - x) / (xa - xb);
|
||||
k = k < 0 ? 0 : k > 1 ? 1 : k;
|
||||
bytes[j++] = (car - (car - cbr) * k) | 0;
|
||||
bytes[j++] = (cag - (cag - cbg) * k) | 0;
|
||||
bytes[j++] = (cab - (cab - cbb) * k) | 0;
|
||||
bytes[j++] = 255;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function drawFigure(data, figure, context) {
|
||||
var ps = figure.coords;
|
||||
var cs = figure.colors;
|
||||
switch (figure.type) {
|
||||
case 'lattice':
|
||||
var verticesPerRow = figure.verticesPerRow;
|
||||
var rows = Math.floor(ps.length / verticesPerRow) - 1;
|
||||
var cols = verticesPerRow - 1;
|
||||
for (var i = 0; i < rows; i++) {
|
||||
var q = i * verticesPerRow;
|
||||
for (var j = 0; j < cols; j++, q++) {
|
||||
drawTriangle(data, context,
|
||||
ps[q], ps[q + 1], ps[q + verticesPerRow],
|
||||
cs[q], cs[q + 1], cs[q + verticesPerRow]);
|
||||
drawTriangle(data, context,
|
||||
ps[q + verticesPerRow + 1], ps[q + 1], ps[q + verticesPerRow],
|
||||
cs[q + verticesPerRow + 1], cs[q + 1], cs[q + verticesPerRow]);
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'triangles':
|
||||
for (var i = 0, ii = ps.length; i < ii; i += 3) {
|
||||
drawTriangle(data, context,
|
||||
ps[i], ps[i + 1], ps[i + 2],
|
||||
cs[i], cs[i + 1], cs[i + 2]);
|
||||
}
|
||||
break;
|
||||
default:
|
||||
error('illigal figure');
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function createMeshCanvas(owner, bounds, coords, colors, figures,
|
||||
backgroundColor) {
|
||||
// we will increase scale on some weird factor to let antialiasing take
|
||||
// care of "rough" edges
|
||||
var EXPECTED_SCALE = 1.5;
|
||||
// MAX_PATTERN_SIZE is used to avoid OOM situation.
|
||||
var MAX_PATTERN_SIZE = 3000; // 10in @ 300dpi shall be enough
|
||||
|
||||
var boundsWidth = bounds[2] - bounds[0];
|
||||
var boundsHeight = bounds[3] - bounds[1];
|
||||
|
||||
var width = Math.min(Math.ceil(Math.abs(boundsWidth * EXPECTED_SCALE)),
|
||||
MAX_PATTERN_SIZE);
|
||||
var height = Math.min(Math.ceil(Math.abs(boundsHeight * EXPECTED_SCALE)),
|
||||
MAX_PATTERN_SIZE);
|
||||
var scaleX = width / boundsWidth;
|
||||
var scaleY = height / boundsHeight;
|
||||
|
||||
var tmpCanvas = CachedCanvases.getCanvas('mesh', width, height, false);
|
||||
var tmpCtx = tmpCanvas.context;
|
||||
if (backgroundColor) {
|
||||
tmpCtx.fillStyle = makeCssRgb(backgroundColor);
|
||||
tmpCtx.fillRect(0, 0, width, height);
|
||||
}
|
||||
|
||||
var context = {
|
||||
coords: coords,
|
||||
colors: colors,
|
||||
offsetX: -bounds[0],
|
||||
offsetY: -bounds[1],
|
||||
scaleX: scaleX,
|
||||
scaleY: scaleY
|
||||
};
|
||||
|
||||
var data = tmpCtx.getImageData(0, 0, width, height);
|
||||
for (var i = 0; i < figures.length; i++) {
|
||||
drawFigure(data, figures[i], context);
|
||||
}
|
||||
tmpCtx.putImageData(data, 0, 0);
|
||||
|
||||
return {canvas: tmpCanvas.canvas, scaleX: 1 / scaleX, scaleY: 1 / scaleY};
|
||||
}
|
||||
return createMeshCanvas;
|
||||
})();
|
||||
|
||||
ShadingIRs.Mesh = {
|
||||
fromIR: function Mesh_fromIR(raw) {
|
||||
var type = raw[1];
|
||||
var coords = raw[2];
|
||||
var colors = raw[3];
|
||||
var figures = raw[4];
|
||||
var bounds = raw[5];
|
||||
var matrix = raw[6];
|
||||
var bbox = raw[7];
|
||||
var background = raw[8];
|
||||
return {
|
||||
type: 'Pattern',
|
||||
getPattern: function Mesh_getPattern(ctx, owner, shadingFill) {
|
||||
// Rasterizing on the main thread since sending/queue large canvases
|
||||
// might cause OOM.
|
||||
// TODO consider using WebGL or asm.js to perform rasterization
|
||||
var temporaryPatternCanvas = createMeshCanvas(owner, bounds,
|
||||
coords, colors, figures, shadingFill ? null : background);
|
||||
|
||||
if (!shadingFill) {
|
||||
ctx.setTransform.apply(ctx, owner.baseTransform);
|
||||
if (matrix) {
|
||||
ctx.transform.apply(ctx, matrix);
|
||||
}
|
||||
}
|
||||
|
||||
ctx.translate(bounds[0], bounds[1]);
|
||||
ctx.scale(temporaryPatternCanvas.scaleX,
|
||||
temporaryPatternCanvas.scaleY);
|
||||
|
||||
return ctx.createPattern(temporaryPatternCanvas.canvas, 'no-repeat');
|
||||
}
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
ShadingIRs.Dummy = {
|
||||
fromIR: function Dummy_fromIR() {
|
||||
return {
|
||||
|
|
@ -61,7 +241,11 @@ ShadingIRs.Dummy = {
|
|||
};
|
||||
|
||||
function getShadingPatternFromIR(raw) {
|
||||
return ShadingIRs[raw[0]].fromIR(raw);
|
||||
var shadingIR = ShadingIRs[raw[0]];
|
||||
if (!shadingIR) {
|
||||
error('Unknown IR type: ' + raw[0]);
|
||||
}
|
||||
return shadingIR.fromIR(raw);
|
||||
}
|
||||
|
||||
var TilingPattern = (function TilingPatternClosure() {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue