- Build: Update
- npm: Update devDeps
This commit is contained in:
Brett Zamir
266
dist/jspdf.plugin.svgToPdf.js
vendored
266
dist/jspdf.plugin.svgToPdf.js
vendored
@@ -416,12 +416,13 @@
|
||||
circle: ['cx', 'cy', 'r', 'stroke', 'fill', 'stroke-width'],
|
||||
polygon: ['points', 'stroke', 'fill', 'stroke-width'],
|
||||
// polyline attributes are the same as those of polygon
|
||||
path: ['d', 'stroke', 'fill', 'stroke-width'],
|
||||
text: ['x', 'y', 'font-size', 'font-family', 'text-anchor', 'font-weight', 'font-style', 'fill']
|
||||
};
|
||||
|
||||
var attributeIsNotEmpty = function attributeIsNotEmpty(node, attr) {
|
||||
var attVal = attr ? node.getAttribute(attr) : node;
|
||||
return attVal !== '' && attVal !== null;
|
||||
return attVal !== '' && attVal !== null && attVal !== 'null';
|
||||
};
|
||||
|
||||
var nodeIs = function nodeIs(node, possible) {
|
||||
@@ -479,6 +480,226 @@
|
||||
};
|
||||
};
|
||||
|
||||
var getLinesOptionsOfPath = function getLinesOptionsOfPath(node) {
|
||||
var segList = node.pathSegList,
|
||||
n = segList.numberOfItems,
|
||||
opsList = [];
|
||||
var ops = {
|
||||
lines: []
|
||||
};
|
||||
var curr = {
|
||||
x: 0,
|
||||
y: 0
|
||||
};
|
||||
var reflectControl = {
|
||||
x: 0,
|
||||
y: 0
|
||||
};
|
||||
|
||||
var toRelative = function toRelative(nums, relativeTo) {
|
||||
var re = [];
|
||||
|
||||
for (var i = 0; i < nums.length - 1; i += 2) {
|
||||
re[i] = nums[i] - relativeTo.x;
|
||||
re[i + 1] = nums[i + 1] - relativeTo.y;
|
||||
}
|
||||
|
||||
return re;
|
||||
};
|
||||
|
||||
var curveQToC = function curveQToC(nums) {
|
||||
var a = 2 / 3;
|
||||
var re = [nums[0] * a, nums[1] * a, nums[2] + (nums[0] - nums[2]) * a, nums[3] + (nums[1] - nums[3]) * a, nums[2], nums[3]];
|
||||
return re;
|
||||
};
|
||||
|
||||
for (var i = 0, letterPrev; i < n; i++) {
|
||||
var seg = segList.getItem(i);
|
||||
var x1 = seg.x1,
|
||||
y1 = seg.y1,
|
||||
x2 = seg.x2,
|
||||
y2 = seg.y2,
|
||||
x = seg.x,
|
||||
y = seg.y,
|
||||
letter = seg.pathSegTypeAsLetter;
|
||||
var isRelative = letter >= 'a'; // lowercase letter
|
||||
|
||||
switch (letter) {
|
||||
case 'M':
|
||||
case 'm':
|
||||
{
|
||||
if (ops.lines.length && Object.prototype.hasOwnProperty.call(ops, 'x')) {
|
||||
opsList.push(ops);
|
||||
}
|
||||
|
||||
ops = {
|
||||
lines: [],
|
||||
x: isRelative ? x + curr.x : x,
|
||||
y: isRelative ? y + curr.y : y,
|
||||
closed: false
|
||||
};
|
||||
ops.closed = false;
|
||||
break;
|
||||
}
|
||||
|
||||
case 'L':
|
||||
{
|
||||
ops.lines.push(toRelative([x, y], curr));
|
||||
break;
|
||||
}
|
||||
|
||||
case 'l':
|
||||
{
|
||||
ops.lines.push([x, y]);
|
||||
break;
|
||||
}
|
||||
|
||||
case 'H':
|
||||
{
|
||||
ops.lines.push([x - curr.x, 0]);
|
||||
break;
|
||||
}
|
||||
|
||||
case 'h':
|
||||
{
|
||||
ops.lines.push([x, 0]);
|
||||
break;
|
||||
}
|
||||
|
||||
case 'V':
|
||||
{
|
||||
ops.lines.push([0, y - curr.y]);
|
||||
break;
|
||||
}
|
||||
|
||||
case 'v':
|
||||
{
|
||||
ops.lines.push([0, y]);
|
||||
break;
|
||||
}
|
||||
|
||||
case 'Q':
|
||||
{
|
||||
ops.lines.push(curveQToC(toRelative([x1, y1, x, y], curr)));
|
||||
reflectControl.x = x - x1;
|
||||
reflectControl.y = y - y1;
|
||||
break;
|
||||
}
|
||||
|
||||
case 'q':
|
||||
{
|
||||
ops.lines.push(curveQToC([x1, y1, x, y]));
|
||||
reflectControl.x = x - x1;
|
||||
reflectControl.y = y - y1;
|
||||
break;
|
||||
}
|
||||
|
||||
case 'T':
|
||||
{
|
||||
var p1 = letterPrev && 'QqTt'.includes(letterPrev) ? reflectControl : {
|
||||
x: 0,
|
||||
y: 0
|
||||
};
|
||||
ops.lines.push(curveQToC([p1.x, p1.y, x - curr.x, y - curr.y]));
|
||||
reflectControl.x = x - curr.x - p1.x;
|
||||
reflectControl.y = y - curr.y - p1.y;
|
||||
break;
|
||||
}
|
||||
|
||||
case 't':
|
||||
{
|
||||
var _p = letterPrev && 'QqTt'.includes(letterPrev) ? reflectControl : {
|
||||
x: 0,
|
||||
y: 0
|
||||
};
|
||||
|
||||
ops.lines.push([_p.x, _p.y, x, y]);
|
||||
reflectControl.x = x - _p.x;
|
||||
reflectControl.y = y - _p.y;
|
||||
break;
|
||||
}
|
||||
|
||||
case 'C':
|
||||
{
|
||||
ops.lines.push(toRelative([x1, y1, x2, y2, x, y], curr));
|
||||
break;
|
||||
}
|
||||
|
||||
case 'c':
|
||||
{
|
||||
ops.lines.push([x1, y1, x2, y2, x, y]);
|
||||
break;
|
||||
}
|
||||
|
||||
case 'S':
|
||||
case 's':
|
||||
{
|
||||
var _p2 = letterPrev && 'CcSs'.includes(letterPrev) ? reflectControl : {
|
||||
x: 0,
|
||||
y: 0
|
||||
};
|
||||
|
||||
if (isRelative) {
|
||||
ops.lines.push([_p2.x, _p2.y, x2, y2, x, y]);
|
||||
} else {
|
||||
ops.lines.push([_p2.x, _p2.y].concat(toRelative([x2, y2, x, y], curr)));
|
||||
}
|
||||
|
||||
reflectControl.x = x - x2;
|
||||
reflectControl.y = y - y2;
|
||||
break;
|
||||
}
|
||||
|
||||
case 'A':
|
||||
case 'a':
|
||||
{
|
||||
// Not support command 'A' and 'a' yet. Treat it as straight line instead.
|
||||
if (isRelative) {
|
||||
ops.lines.push([x, y]);
|
||||
} else {
|
||||
ops.lines.push(toRelative([x, y], curr));
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
case 'z':
|
||||
case 'Z':
|
||||
{
|
||||
ops.closed = true;
|
||||
break;
|
||||
}
|
||||
|
||||
default:
|
||||
{
|
||||
// throw new Error('Unknown path command ' + letter);
|
||||
return opsList;
|
||||
}
|
||||
}
|
||||
|
||||
if (letter === 'Z' || letter === 'z') {
|
||||
curr.x = ops.x;
|
||||
curr.y = ops.y;
|
||||
} else {
|
||||
if (letter !== 'V' && letter !== 'v') {
|
||||
curr.x = isRelative ? x + curr.x : x;
|
||||
}
|
||||
|
||||
if (letter !== 'H' && letter !== 'h') {
|
||||
curr.y = isRelative ? y + curr.y : y;
|
||||
}
|
||||
}
|
||||
|
||||
letterPrev = letter;
|
||||
}
|
||||
|
||||
if (ops.lines.length && Object.prototype.hasOwnProperty.call(ops, 'x')) {
|
||||
opsList.push(ops);
|
||||
}
|
||||
|
||||
return opsList;
|
||||
};
|
||||
|
||||
var svgElementToPdf = function svgElementToPdf(element, pdf, options) {
|
||||
// pdf is a jsPDF object
|
||||
// console.log('options =', options);
|
||||
@@ -490,11 +711,12 @@
|
||||
// let hasStrokeColor = false;
|
||||
var hasFillColor = false;
|
||||
var fillRGB;
|
||||
colorMode = null;
|
||||
|
||||
if (nodeIs(node, ['g', 'line', 'rect', 'ellipse', 'circle', 'polygon', 'polyline', 'text'])) {
|
||||
if (nodeIs(node, ['g', 'line', 'rect', 'ellipse', 'circle', 'polygon', 'polyline', 'path', 'text'])) {
|
||||
var fillColor = node.getAttribute('fill');
|
||||
|
||||
if (attributeIsNotEmpty(fillColor)) {
|
||||
if (attributeIsNotEmpty(fillColor) && node.getAttribute('fill-opacity') !== '0') {
|
||||
fillRGB = new RGBColor(fillColor);
|
||||
|
||||
if (fillRGB.ok) {
|
||||
@@ -506,7 +728,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
if (nodeIs(node, ['g', 'line', 'rect', 'ellipse', 'circle', 'polygon', 'polyline'])) {
|
||||
if (nodeIs(node, ['g', 'line', 'rect', 'ellipse', 'circle', 'polygon', 'polyline', 'path'])) {
|
||||
if (hasFillColor) {
|
||||
pdf.setFillColor(fillRGB.r, fillRGB.g, fillRGB.b);
|
||||
}
|
||||
@@ -517,14 +739,14 @@
|
||||
|
||||
var strokeColor = node.getAttribute('stroke');
|
||||
|
||||
if (attributeIsNotEmpty(strokeColor)) {
|
||||
if (attributeIsNotEmpty(strokeColor) && node.getAttribute('stroke-width') !== '0' && node.getAttribute('stroke-opacity') !== '0') {
|
||||
var strokeRGB = new RGBColor(strokeColor);
|
||||
|
||||
if (strokeRGB.ok) {
|
||||
// hasStrokeColor = true;
|
||||
pdf.setDrawColor(strokeRGB.r, strokeRGB.g, strokeRGB.b);
|
||||
|
||||
if (colorMode === 'F') {
|
||||
if (hasFillColor) {
|
||||
colorMode = 'FD';
|
||||
} else {
|
||||
colorMode = 'S';
|
||||
@@ -576,7 +798,37 @@
|
||||
}
|
||||
|
||||
removeAttributes(node, pdfSvgAttr.polygon);
|
||||
break; // TODO: path
|
||||
break;
|
||||
}
|
||||
|
||||
case 'path':
|
||||
{
|
||||
if (colorMode) {
|
||||
var linesOptionsList = getLinesOptionsOfPath(node);
|
||||
|
||||
if (linesOptionsList.length > 0) {
|
||||
linesOptionsList.forEach(function (linesOptions) {
|
||||
pdf.lines(linesOptions.lines, k * linesOptions.x, k * linesOptions.y, [k, k], null, linesOptions.closed);
|
||||
}); // svg fill rule default is nonzero
|
||||
|
||||
var fillRule = node.getAttribute('fill-rule');
|
||||
|
||||
if (fillRule === 'evenodd') {
|
||||
// f* : fill using even-odd rule
|
||||
// B* : stroke and fill using even-odd rule
|
||||
if (colorMode === 'F') {
|
||||
colorMode = 'f*';
|
||||
} else if (colorMode === 'FD') {
|
||||
colorMode = 'B*';
|
||||
}
|
||||
}
|
||||
|
||||
pdf.internal.write(pdf.internal.getStyle(colorMode));
|
||||
}
|
||||
}
|
||||
|
||||
removeAttributes(node, pdfSvgAttr.path);
|
||||
break;
|
||||
}
|
||||
|
||||
case 'text':
|
||||
|
||||
Reference in New Issue
Block a user