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

fix toSVG polygons and other bugs (#3866)

Browse source
This commit is contained in:
Andrea Bogazzi 2017-04-22 22:46:45 +02:00 committed by Asturur
parent 0847697126
commit 2d251889d4
2 changed files with 20 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/gradient.class.js
View file

@ -71,6 +71,8 @@
}
/* _FROM_SVG_END_ */
var clone = fabric.util.object.clone;
/**
* Gradient class
* @class fabric.Gradient
@ -169,11 +171,11 @@
* @return {String} SVG representation of an gradient (linear/radial)
*/
toSVG: function(object) {
var coords = fabric.util.object.clone(this.coords),
markup, commonAttributes, colorStops = this.colorStops,
var coords = clone(this.coords, true),
markup, commonAttributes, colorStops = clone(this.colorStops, true),
needsSwap = coords.r1 > coords.r2;
// colorStops must be sorted ascending
this.colorStops.sort(function(a, b) {
colorStops.sort(function(a, b) {
return a.offset - b.offset;
});
@ -221,7 +223,8 @@
if (this.type === 'radial') {
if (needsSwap) {
// svg goes from internal to external radius. if radius are inverted, swap color stops.
colorStops = colorStops.concat().reverse();
colorStops = colorStops.concat();
colorStops.reverse();
for (var i = 0; i < colorStops.length; i++) {
colorStops[i].offset = 1 - colorStops[i].offset;
}

20
src/shapes/polyline.class.js
View file

@ -6,7 +6,8 @@
extend = fabric.util.object.extend,
min = fabric.util.array.min,
max = fabric.util.array.max,
toFixed = fabric.util.toFixed;
toFixed = fabric.util.toFixed,
NUM_FRACTION_DIGITS = fabric.Object.NUM_FRACTION_DIGITS;
if (fabric.Polyline) {
fabric.warn('fabric.Polyline is already defined');
@ -125,20 +126,25 @@
* @return {String} svg representation of an instance
*/
toSVG: function(reviver) {
var points = [], addTransform,
var points = [], diffX, diffY,
markup = this._createBaseSVGMarkup();
for (var i = 0, len = this.points.length; i < len; i++) {
points.push(toFixed(this.points[i].x, 2), ',', toFixed(this.points[i].y, 2), ' ');
}
if (!(this.group && this.group.type === 'path-group')) {
addTransform = ' translate(' + (-this.pathOffset.x) + ', ' + (-this.pathOffset.y) + ') ';
diffX = this.pathOffset.x;
diffY = this.pathOffset.y;
}
for (var i = 0, len = this.points.length; i < len; i++) {
points.push(
toFixed(this.points[i].x - diffX, NUM_FRACTION_DIGITS), ',',
toFixed(this.points[i].y - diffY, NUM_FRACTION_DIGITS), ' '
);
}
markup.push(
'<', this.type, ' ', this.getSvgId(),
'points="', points.join(''),
'" style="', this.getSvgStyles(),
'" transform="', this.getSvgTransform(), addTransform,
'" transform="', this.getSvgTransform(),
' ', this.getSvgTransformMatrix(),
'"/>\n'
);