From ac3894eaa968d42a074bce8212de240ef4a0c0a3 Mon Sep 17 00:00:00 2001
From: Joost De Cock <joost@joost.at>
Date: Sun, 11 Apr 2021 16:28:38 +0200
Subject: [PATCH] chore: Round coordinates when outputting SVG

---
 packages/core/src/path.js | 11 +++++++----
 packages/core/src/svg.js  | 18 +++++++++---------
 2 files changed, 16 insertions(+), 13 deletions(-)

diff --git a/packages/core/src/path.js b/packages/core/src/path.js
index 10a9a4f4ea8..03e829eed66 100644
--- a/packages/core/src/path.js
+++ b/packages/core/src/path.js
@@ -7,7 +7,8 @@ import {
   curvesIntersect,
   pointOnLine,
   pointOnCurve,
-  curveEdge
+  curveEdge,
+  round
 } from './utils'
 
 function Path(debug = false) {
@@ -159,13 +160,15 @@ Path.prototype.asPathstring = function () {
   for (let op of this.ops) {
     switch (op.type) {
       case 'move':
-        d += `M ${op.to.x},${op.to.y}`
+        d += `M ${round(op.to.x)},${round(op.to.y)}`
         break
       case 'line':
-        d += ` L ${op.to.x},${op.to.y}`
+        d += ` L ${round(op.to.x)},${round(op.to.y)}`
         break
       case 'curve':
-        d += ` C ${op.cp1.x},${op.cp1.y} ${op.cp2.x},${op.cp2.y} ${op.to.x},${op.to.y}`
+        d += ` C ${round(op.cp1.x)},${round(op.cp1.y)} ${round(op.cp2.x)},${round(
+          op.cp2.y
+        )} ${round(op.to.x)},${round(op.to.y)}`
         break
       case 'close':
         d += ' z'
diff --git a/packages/core/src/svg.js b/packages/core/src/svg.js
index d52ff5e5b58..3e27dfd5f46 100644
--- a/packages/core/src/svg.js
+++ b/packages/core/src/svg.js
@@ -1,5 +1,5 @@
 import Attributes from './attributes'
-
+import { round } from './utils'
 import { version } from '../package.json'
 
 function Svg(pattern) {
@@ -46,8 +46,8 @@ Svg.prototype.render = function (pattern) {
   this.idPrefix = pattern.settings.idPrefix
   this.runHooks('preRender')
   if (!pattern.settings.embed) {
-    this.attributes.add('width', pattern.width + 'mm')
-    this.attributes.add('height', pattern.height + 'mm')
+    this.attributes.add('width', round(pattern.width) + 'mm')
+    this.attributes.add('height', round(pattern.height) + 'mm')
   }
   this.attributes.add('viewBox', `0 0 ${pattern.width} ${pattern.height}`)
   this.head = this.renderHead()
@@ -197,8 +197,8 @@ Svg.prototype.renderText = function (point) {
     }
     this.text = this.insertText(joint)
   }
-  point.attributes.set('data-text-x', point.x)
-  point.attributes.set('data-text-y', point.y)
+  point.attributes.set('data-text-x', round(point.x))
+  point.attributes.set('data-text-y', round(point.y))
   let lineHeight = point.attributes.get('data-text-lineheight') || 12
   point.attributes.remove('data-text-lineheight')
   let svg = `${this.nl()}<text ${point.attributes.renderIfPrefixIs('data-text-')}>`
@@ -208,7 +208,7 @@ Svg.prototype.renderText = function (point) {
     let lines = this.text.split('\n')
     svg += `<tspan>${lines.shift()}</tspan>`
     for (let line of lines) {
-      svg += `<tspan x="${point.x}" dy="${lineHeight}">${line}</tspan>`
+      svg += `<tspan x="${round(point.x)}" dy="${lineHeight}">${line}</tspan>`
     }
   } else {
     svg += `<tspan>${this.escapeText(this.text)}</tspan>`
@@ -224,15 +224,15 @@ Svg.prototype.escapeText = function (text) {
 }
 
 Svg.prototype.renderCircle = function (point) {
-  return `<circle cx="${point.x}" cy="${point.y}" r="${point.attributes.get(
+  return `<circle cx="${round(point.x)}" cy="${round(point.y)}" r="${point.attributes.get(
     'data-circle'
   )}" ${point.attributes.renderIfPrefixIs('data-circle-')}></circle>`
 }
 
 /** Returns SVG code for a snippet */
 Svg.prototype.renderSnippet = function (snippet, part) {
-  let x = snippet.anchor.x
-  let y = snippet.anchor.y
+  let x = round(snippet.anchor.x)
+  let y = round(snippet.anchor.y)
   let scale = snippet.attributes.get('data-scale')
   if (scale) {
     snippet.attributes.add('transform', `translate(${x}, ${y})`)