Hopiu/fabric.js
1
0
Fork 0
mirror of https://github.com/Hopiu/fabric.js.git synced 2026-05-28 23:08:17 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix pathGroup TransformMatrix

Browse source 
solves missing transformMatrix
This commit is contained in:
Andrea Bogazzi 2015-01-28 09:13:52 +01:00
parent 498913ff8c
commit 0523352dfa
3 changed files with 23 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/mixins/object.svg_export.js
View file

@ -91,7 +91,7 @@ fabric.util.object.extend(fabric.Object.prototype, /** @lends fabric.Object.prot
* @return {String}
*/
getSvgTransformMatrix: function() {
return this.transformMatrix ? ' matrix(' + this.transformMatrix.join(' ') + ')' : '';
return this.transformMatrix ? ' matrix(' + this.transformMatrix.join(' ') + ') ' : '';
},
/**

2
src/shapes/path_group.class.js
View file

@ -154,7 +154,7 @@
//jscs:disable validateIndentation
'<g ',
'style="', this.getSvgStyles(), '" ',
'transform="', translatePart, this.getSvgTransform(), '" ',
'transform="', this.getSvgTransformMatrix(), translatePart, this.getSvgTransform(), '" ',
'>\n'
//jscs:enable validateIndentation
];

21
test/unit/path_group.js
View file

@ -30,6 +30,16 @@
'paths': getPathObjects()
};
var REFERENCE_PATH_GROUP_SVG = '<g style="stroke: none; stroke-width: 1; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(0 0)" >\n' +
'<path d="M 100 100 L 300 100 L 200 300 z" style="stroke: blue; stroke-width: 3; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,0,0); fill-rule: nonzero; opacity: 1;" transform="" stroke-linecap="round" />\n' +
'<path d="M 200 200 L 100 200 L 400 50 z" style="stroke: blue; stroke-width: 3; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,0,0); fill-rule: nonzero; opacity: 1;" transform="" stroke-linecap="round" />\n' +
'</g>\n';
var REFERENCE_PATH_GROUP_SVG_WITH_MATRIX = '<g style="stroke: none; stroke-width: 1; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform=" matrix(1 2 3 4 5 6) translate(0 0)" >\n' +
'<path d="M 100 100 L 300 100 L 200 300 z" style="stroke: blue; stroke-width: 3; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,0,0); fill-rule: nonzero; opacity: 1;" transform="" stroke-linecap="round" />\n' +
'<path d="M 200 200 L 100 200 L 400 50 z" style="stroke: blue; stroke-width: 3; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,0,0); fill-rule: nonzero; opacity: 1;" transform="" stroke-linecap="round" />\n' +
'</g>\n';
function getPathElement(path) {
var el = fabric.document.createElement('path');
el.setAttribute('d', path);
@ -221,4 +231,15 @@
start();
});
});
asyncTest('toSVG', function() {
ok(fabric.PathGroup);
getPathGroupObject(function(pathGroup) {
ok(typeof pathGroup.toSVG == 'function');
equal(pathGroup.toSVG(), REFERENCE_PATH_GROUP_SVG);
pathGroup.transformMatrix = [1, 2, 3, 4, 5, 6];
equal(pathGroup.toSVG(), REFERENCE_PATH_GROUP_SVG_WITH_MATRIX);
start();
});
});
})();