From a85c3eb3678d9581e9bb1881030200c6bb113188 Mon Sep 17 00:00:00 2001 From: Shane Steele-Pardue Date: Tue, 9 May 2023 13:41:59 -0500 Subject: [PATCH 1/5] Initialize Symbolic Frameworks fork of svgcanvas to hotfix Context.prototype.translate receiving NaN, NaN --- context.js | 16 ++++++++-------- package-lock.json | 4 ++-- package.json | 11 +++-------- 3 files changed, 13 insertions(+), 18 deletions(-) diff --git a/context.js b/context.js index 8b22aca..5323161 100644 --- a/context.js +++ b/context.js @@ -1088,11 +1088,11 @@ export default (function () { this.__addPathCommand(format("A {rx} {ry} {xAxisRotation} {largeArcFlag} {sweepFlag} {endX} {endY}", { - rx:radiusX, - ry:radiusY, - xAxisRotation:rotation*(180/Math.PI), - largeArcFlag:largeArcFlag, - sweepFlag:sweepFlag, + rx:radiusX, + ry:radiusY, + xAxisRotation:rotation*(180/Math.PI), + largeArcFlag:largeArcFlag, + sweepFlag:sweepFlag, endX:endX, endY:endY })); @@ -1326,7 +1326,7 @@ export default (function () { * @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/translate */ Context.prototype.translate = function (x, y) { - const matrix = this.getTransform().translate(x, y); + const matrix = this.getTransform().translate(x || 0, y || 0); this.setTransform(matrix); }; @@ -1346,7 +1346,7 @@ export default (function () { } /** - * + * * @returns The scale component of the transform matrix as {x,y}. */ Context.prototype.__getTransformScale = function() { @@ -1357,7 +1357,7 @@ export default (function () { } /** - * + * * @returns The rotation component of the transform matrix in radians. */ Context.prototype.__getTransformRotation = function() { diff --git a/package-lock.json b/package-lock.json index 1097049..ef0a3ad 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "svgcanvas", - "version": "2.2.2", + "version": "2.5.0", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "svgcanvas", - "version": "2.2.2", + "version": "2.5.0", "license": "MIT", "devDependencies": { "@rollup/plugin-commonjs": "^21.0.2", diff --git a/package.json b/package.json index c045ca2..24bdf72 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { - "name": "svgcanvas", + "name": "@symbolic/svgcanvas", "version": "2.5.0", - "description": "svgcanvas", + "description": "@symbolic/svgcanvas", "main": "dist/svgcanvas.js", "scripts": { "watch": "rollup -c -w", @@ -9,16 +9,11 @@ "prepublishOnly": "npm run build", "test": "karma start" }, - "repository": { - "type": "git", - "url": "https://github.com/zenozeng/svgcanvas.git" - }, "keywords": [ "canvas", "svg", "canvas2svg" ], - "author": "Zeno Zeng", "license": "MIT", "devDependencies": { "@rollup/plugin-commonjs": "^21.0.2", @@ -34,4 +29,4 @@ "puppeteer": "^13.5.0", "rollup": "^2.67.0" } -} +} \ No newline at end of file From 7c5ce2d7808768fa4a7befcfa72bf5401d1fcace Mon Sep 17 00:00:00 2001 From: Shane Steele-Pardue Date: Tue, 9 May 2023 13:53:03 -0500 Subject: [PATCH 2/5] Adds Context.prototype.arc truthy zeros for parameters --- context.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/context.js b/context.js index 5323161..593cd4b 100644 --- a/context.js +++ b/context.js @@ -989,6 +989,13 @@ export default (function () { * Arc command! */ Context.prototype.arc = function (x, y, radius, startAngle, endAngle, counterClockwise) { + x = x || 0; + y = y || 0; + radius = radius || 0; + startAngle = startAngle || 0; + endAngle = endAngle || 0; + counterClockwise = counterClockwise || 0; + // in canvas no circle is drawn if no angle is provided. if (startAngle === endAngle) { return; @@ -1021,7 +1028,7 @@ export default (function () { var scaleX = Math.hypot(this.__transformMatrix.a, this.__transformMatrix.b); var scaleY = Math.hypot(this.__transformMatrix.c, this.__transformMatrix.d); - this.lineTo(startX, startY); + this.lineTo(startX || 0, startY || 0); this.__addPathCommand(format("A {rx} {ry} {xAxisRotation} {largeArcFlag} {sweepFlag} {endX} {endY}", { rx:radius * scaleX, From 9f58548cca2e894f6f8228dcd9212f81e262db64 Mon Sep 17 00:00:00 2001 From: Shane Steele-Pardue Date: Tue, 9 May 2023 13:53:27 -0500 Subject: [PATCH 3/5] 2.5.1 --- package-lock.json | 4 ++-- package.json | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index ef0a3ad..b8baa5f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "svgcanvas", - "version": "2.5.0", + "version": "2.5.1", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "svgcanvas", - "version": "2.5.0", + "version": "2.5.1", "license": "MIT", "devDependencies": { "@rollup/plugin-commonjs": "^21.0.2", diff --git a/package.json b/package.json index 24bdf72..918a414 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@symbolic/svgcanvas", - "version": "2.5.0", + "version": "2.5.1", "description": "@symbolic/svgcanvas", "main": "dist/svgcanvas.js", "scripts": { @@ -29,4 +29,4 @@ "puppeteer": "^13.5.0", "rollup": "^2.67.0" } -} \ No newline at end of file +} From 604be9e54c706b6a078a232a51e1464d38ce59c2 Mon Sep 17 00:00:00 2001 From: Shane Steele-Pardue Date: Thu, 25 May 2023 14:24:58 -0500 Subject: [PATCH 4/5] Adds patch to support CanvasPattern with Konva --- context.js | 23 +++++++++++++---------- 1 file changed, 13 insertions(+), 10 deletions(-) diff --git a/context.js b/context.js index 593cd4b..4841c72 100644 --- a/context.js +++ b/context.js @@ -396,18 +396,21 @@ export default (function () { value = this[keys[i]]; if (style.apply) { //is this a gradient or pattern? - if (value instanceof CanvasPattern) { - //pattern - if (value.__ctx) { - //copy over defs - for(nodeIndex = 0; nodeIndex < value.__ctx.__defs.childNodes.length; nodeIndex++){ - node = value.__ctx.__defs.childNodes[nodeIndex]; - id = node.getAttribute("id"); - this.__ids[id] = id; - this.__defs.appendChild(node); + if (value instanceof CanvasPattern || value.constructor.name === 'CanvasPattern') { + if (value.image) { //MODIFIED + value = this.createPattern(value.image, null); //HINT pulls in original image ref from Konva + //pattern + if (value.__ctx) { + //copy over defs + for(nodeIndex = 0; nodeIndex < value.__ctx.__defs.childNodes.length; nodeIndex++){ + node = value.__ctx.__defs.childNodes[nodeIndex]; + id = node.getAttribute("id"); + this.__ids[id] = id; + this.__defs.appendChild(node); + } } + currentElement.setAttribute(style.apply, format("url(#{id})", {id:value.__root.getAttribute("id")})); } - currentElement.setAttribute(style.apply, format("url(#{id})", {id:value.__root.getAttribute("id")})); } else if (value instanceof CanvasGradient) { //gradient From 5909111fe4a5ad1e26c55405fc474974ca46bd57 Mon Sep 17 00:00:00 2001 From: maxhudson Date: Thu, 12 Oct 2023 10:45:31 -0700 Subject: [PATCH 5/5] gradient --- context.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/context.js b/context.js index 4841c72..f2bcdbd 100644 --- a/context.js +++ b/context.js @@ -412,7 +412,8 @@ export default (function () { currentElement.setAttribute(style.apply, format("url(#{id})", {id:value.__root.getAttribute("id")})); } } - else if (value instanceof CanvasGradient) { + else if (value instanceof CanvasGradient || value.constructor.name === 'CanvasGradient') { + console.log(value); //gradient currentElement.setAttribute(style.apply, format("url(#{id})", {id:value.__root.getAttribute("id")})); } else if (style.apply.indexOf(type)!==-1 && style.svg !== value) {