evert/svgcanvas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #20 from zenozeng/master

Browse Source 
use currentDefaultPath instead of <path>'s d attribute, fixes stroke's different behavior in SVG and canvas.
This commit is contained in:
clintjd 2015-05-29 10:24:43 -07:00
commit bc53ac50ef
1 changed files with 26 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
canvas2svg.js
View File

@ -260,7 +260,6 @@
//also add a group child. the svg element can't use the transform attribute //also add a group child. the svg element can't use the transform attribute
this.__currentElement = document.createElementNS("http://www.w3.org/2000/svg", "g"); this.__currentElement = document.createElementNS("http://www.w3.org/2000/svg", "g");
this.__root.appendChild(this.__currentElement); this.__root.appendChild(this.__currentElement);
}; };
/** /**
@ -504,29 +503,37 @@
*/ */
ctx.prototype.beginPath = function(){ ctx.prototype.beginPath = function(){
var path, parent; var path, parent;
// Note that there is only one current default path, it is not part of the drawing state.
// See also: https://html.spec.whatwg.org/multipage/scripting.html#current-default-path
this.__currentDefaultPath = "";
path = this.__createElement("path", {}, true); path = this.__createElement("path", {}, true);
parent = this.__closestGroupOrSvg(); parent = this.__closestGroupOrSvg();
parent.appendChild(path); parent.appendChild(path);
this.__currentElement = path; this.__currentElement = path;
}; };
/**
* Helper function to apply currentDefaultPath to current path element
* @private
*/
ctx.prototype.__applyCurrentDefaultPath = function() {
if(this.__currentElement.nodeName === "path") {
var d = this.__currentDefaultPath;
this.__currentElement.setAttribute("d", d);
} else {
throw new Error("Attempted to apply path command to node " + this.__currentElement.nodeName);
}
};
/** /**
* Helper function to add path command * Helper function to add path command
* @private * @private
*/ */
ctx.prototype.__addPathCommand = function(command){ ctx.prototype.__addPathCommand = function(command){
if(this.__currentElement.nodeName === "path") { this.__currentDefaultPath += " ";
var d = this.__currentElement.getAttribute("d"); this.__currentDefaultPath += command;
if(d) {
d += " ";
} else {
d = "";
}
d += command;
this.__currentElement.setAttribute("d", d);
} else {
throw new Error("Attempted to add path command to node " + this.__currentElement.nodeName);
}
}; };
/** /**
@ -573,6 +580,7 @@
* Sets the stroke property on the current element * Sets the stroke property on the current element
*/ */
ctx.prototype.stroke = function(){ ctx.prototype.stroke = function(){
this.__applyCurrentDefaultPath();
this.__applyStyleToCurrentElement("stroke"); this.__applyStyleToCurrentElement("stroke");
}; };
@ -580,6 +588,7 @@
* Sets fill properties on the current element * Sets fill properties on the current element
*/ */
ctx.prototype.fill = function(){ ctx.prototype.fill = function(){
this.__applyCurrentDefaultPath();
this.__applyStyleToCurrentElement("fill"); this.__applyStyleToCurrentElement("fill");
}; };