Inkscape:圆坐标

时间:2018-04-30 09:07:04

标签: inkscape

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

3 个答案:

答案 0 :(得分:2)

选项1:创建路径时需要使用捕捉,或者在创建路径后捕捉节点。将网格设置为1px乘1px,并在绘制时捕捉。

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

设置数字精度有两种方法(对于SVG本身和保存到优化SVG时) - 但这些只定义整数的长度 - 所以如果你设置为4,你也可以获得200.1如此为1200或12.48,因此在这种情况下无法提供帮助。

答案 1 :(得分:1)

下面的示例显示3个圆/点和一条连接它们的线。这些点是四舍五入的整数,而该行具有尾随的十进制值。

javascript等待2秒钟(以便您可以比较),然后转换所有路径(仅一个)并将它们对齐到最接近的整数。通过路径角与圆的对齐可以看出这一点。

在浏览器中加载SVG,在浏览器控制台中运行JavaScript,然后通过右键单击节点并复制externalHTML来导出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)
<svg viewBox="0 0 50 50">
  <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属性,将任何数字四舍五入到最接近的整数。

答案 2 :(得分:1)

,有一种方法可以设置坐标精度。

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