From 2d251889d448c1d096a839bf640f7704fa283f34 Mon Sep 17 00:00:00 2001
From: Andrea Bogazzi <andreabogazzi79@gmail.com>
Date: Sat, 22 Apr 2017 22:46:45 +0200
Subject: [PATCH] fix toSVG polygons and other bugs (#3866)

---
 src/gradient.class.js        | 11 +++++++----
 src/shapes/polyline.class.js | 20 +++++++++++++-------
 2 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/src/gradient.class.js b/src/gradient.class.js
index 6d57d73e..d8f39d27 100644
--- a/src/gradient.class.js
+++ b/src/gradient.class.js
@@ -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;
           }
diff --git a/src/shapes/polyline.class.js b/src/shapes/polyline.class.js
index 86d48223..3fab26f3 100644
--- a/src/shapes/polyline.class.js
+++ b/src/shapes/polyline.class.js
@@ -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'
       );