Inkscape：坐标四舍五入

Question

在Inkscape中有没有一个命令可以将路径的坐标四舍五入为最接近的整数值。

例如，要替换此路径：

m 0,0 261.98828,-890.8828 -299.999999,-900 2593.486319,54.4063 -253.9941,850.09565 264.3594,870.83005 z

通过这个：

m 0,0 262,-891 -300,-900 2593,54 -254,850 264,871 z

- DevonDahon

Answer 1

是的，有一种方法可以设置坐标精度。

• 文件 -> 另存为...
• 保存为 "优化的SVG"
• 在第一个对话框中，将坐标“精度”设置为3或任何您想要的数值

- Rytis Guntulis

Answer 2

下面的示例显示3个圆点和连接它们的线条。这些点是四舍五入的整数，而该线条则具有带有小数后缀的值。

在转换所有路径（仅一个）并将其对齐到最接近的整数之前，javascript会等待2秒钟（以便您可以进行比较）。这可以通过路径角落与圆点的对齐来看出。

在浏览器中加载SVG，在浏览器控制台中运行JavaScript，然后通过右键单击节点并复制outerHTML来导出DOM。就是这样。

setTimeout(() => {
  document.querySelectorAll('path').forEach((p) => {
    p.setAttribute(
      'd',
      p.getAttribute('d')
      .split(/(\d*\.?\d*)/g)
      .map((e) => {
        return isNaN(parseFloat(e)) ?
          e :
          Math.round(parseFloat(e), 0)
      }).join(''))
  })
}, 2000)

html,
body {
  margin: 0;
  height: 100vh;
  overflow: hidden;
}

<svg viewBox="0 0 50 30" height="100%">
  <g fill="none">
    <circle cx="5" cy="21" r="1" stroke="green" stroke-width=".5" />
    <circle cx="43" cy="6" r="1" stroke="green" stroke-width=".5" />
    <circle cx="35" cy="24" r="1" stroke="green" stroke-width=".5" />
    <path
      stroke="red" 
      d="
       M 5.4131 20.555
       L 43.345 5.666
       L 34.822 24.22222
       Z"
     stroke-width=".5"
     />
  </g>
</svg>

它获取所有路径元素并编辑所有d属性，将任何数字四舍五入到最近的整数。

- ADJenks

Answer 3

选项1：在创建路径时，您需要使用捕捉功能或在创建路径后对节点进行捕捉。将网格设置为1像素乘1像素，并在绘制时进行捕捉。

选项2：或者您需要编写一个脚本，在SVG文件中查找所有'd'属性，并将其中的值四舍五入为整数。

有两种设置数值精度的方法（对于SVG本身和保存为优化的SVG时）- 但这些仅定义整个数字的长度 - 因此如果您将其设置为4，则可以获得200.1以及1200或12.48，因此在这种情况下无法帮助。

- Moini