如何提取svg图像的笛卡尔坐标（x，y）？

2024-06-08 05:23:46 发布

您现在位置：Python中文网/ 问答频道 /正文
2146 3

我有一个包含连续路径的svg图像，我希望将其笛卡尔坐标（x，y）提取到csv文件中

我这样做是为了用本轮重建3B1B的任意路径的动画。链接此处https://youtu.be/-qgreAUpPwM

是否有任何库或工具可供我使用


Tags： 文件工具csvhttpssvg图像路径链接
2条回答
网友
1楼 · 编辑于 2024-06-08 05:23:46

例如，我正在解析下面的ballons.svg文件

变体1。使用Python（另请参见使用JavaScript的变体2）

首先，我使用xml.dom模块查找文件中的path项。然后path项由svg.path库解析（需要由pip install svg.path安装）

有许多不同类型的对象可以位于path条目内，例如直线、圆弧、立方体贝塞尔、二次贝塞尔、闭合等

对于每个路径，我首先打印所有对象，因为它们位于Objects:节中。然后，如果您需要这些对象的坐标，那么在这些对象中有start/end属性可用。它们指向相应对象的起点/终点

路径内对象的起点（X，Y）为(obj.start.real, obj.start.imag)。对象的端点（X，Y）是(obj.end.real, obj.end.imag)。但这些只是终点，曲线的中间点不包含在SVG文件中，需要进行数学计算

Try it online!

from xml.dom import minidom
from svg.path import parse_path

doc = minidom.parse('ballons.svg')
for ipath, path in enumerate(doc.getElementsByTagName('path')):
    print('Path', ipath)
    d = path.getAttribute('d')
    parsed = parse_path(d)
    print('Objects:\n', parsed, '\n' + '-' * 20)
    for obj in parsed:
        print(type(obj).__name__, ', start/end coords:', ((round(obj.start.real, 3), round(obj.start.imag, 3)), (round(obj.end.real, 3), round(obj.end.imag, 3))))
    print('-' * 20)
doc.unlink()

输出：

Path 0
Objects:
 Path(Move(to=(144.042+167.583j)), CubicBezier(start=(144.042+167.583j), control1=(143.489+157.013j), control2=(148.337+146.4j), end=(157.00900000000001+139.192j)), Arc(start=(157.00900000000001+139.192j), radius=(35.8+35.8j), rotation=0.0, arc=False, sweep=True, end=(177.39800000000002+130.84300000000002j)), Arc(start=(177.39800000000002+130.84300000000002j), radius=(7.929+7.929j), rotation=0.0, arc=False, sweep=False, end=(178.22400000000002+130.74300000000002j)), CubicBezier(start=(178.22400000000002+130.74300000000002j), control1=(190.431+128.57700000000003j), control2=(206.53600000000003+128.52800000000002j), end=(224.794+130.60100000000003j)), Arc(start=(224.794+130.60100000000003j), radius=(8+8j), rotation=0.0, arc=False, sweep=False, end=(231.431+117.07400000000003j)), CubicBezier(start=(231.431+117.07400000000003j), control1=(221.173+106.52800000000002j), control2=(213.358+96.59500000000003j), end=(208.203+87.55000000000003j)), Arc(start=(208.203+87.55000000000003j), radius=(7.962+7.962j), rotation=0.0, arc=False, sweep=False, end=(207.756+86.85000000000002j)), Arc(start=(207.756+86.85000000000002j), radius=(35.82+35.82j), rotation=0.0, arc=False, sweep=True, end=(201.143+65.83200000000002j)), CubicBezier(start=(201.143+65.83200000000002j), control1=(201.143+47.13700000000002j), control2=(214.906+31.932000000000023j), end=(231.824+31.932000000000023j)), Arc(start=(231.824+31.932000000000023j), radius=(28.568+28.568j), rotation=0.0, arc=False, sweep=True, end=(250.75400000000002+39.16400000000002j)), Arc(start=(250.75400000000002+39.16400000000002j), radius=(8+8j), rotation=0.0, arc=False, sweep=False, end=(261.24600000000004+39.16400000000002j)), Arc(start=(261.24600000000004+39.16400000000002j), radius=(28.568+28.568j), rotation=0.0, arc=False, sweep=True, end=(280.17600000000004+31.932000000000023j)), CubicBezier(start=(280.17600000000004+31.932000000000023j), control1=(297.09400000000005+31.932000000000023j), control2=(310.857+47.142000000000024j), end=(310.857+65.83700000000002j)), Arc(start=(310.857+65.83700000000002j), radius=(35.82+35.82j), rotation=0.0, arc=False, sweep=True, end=(304.244+86.85500000000002j)), Arc(start=(304.244+86.85500000000002j), radius=(7.962+7.962j), rotation=0.0, arc=False, sweep=False, end=(303.797+87.55500000000002j)), CubicBezier(start=(303.797+87.55500000000002j), control1=(298.64200000000005+96.60000000000002j), control2=(290.827+106.53300000000002j), end=(280.569+117.07900000000002j)), Arc(start=(280.569+117.07900000000002j), radius=(8+8j), rotation=0.0, arc=False, sweep=False, end=(287.206+130.60600000000002j)), CubicBezier(start=(287.206+130.60600000000002j), control1=(305.464+128.53300000000002j), control2=(321.567+128.58300000000003j), end=(333.776+130.74800000000002j)), Arc(start=(333.776+130.74800000000002j), radius=(7.929+7.929j), rotation=0.0, arc=False, sweep=False, end=(334.60200000000003+130.848j)), Arc(start=(334.60200000000003+130.848j), radius=(35.8+35.8j), rotation=0.0, arc=False, sweep=True, end=(354.99+139.19600000000003j)), CubicBezier(start=(354.99+139.19600000000003j), control1=(355.923+139.97100000000003j), control2=(356.821+140.79600000000002j), end=(357.663+141.64100000000002j)), Line(start=(357.663+141.64100000000002j), end=(369.017+130.36800000000002j)), CubicBezier(start=(369.017+130.36800000000002j), control1=(367.817+129.16200000000003j), control2=(366.542+127.99300000000002j), end=(365.217+126.89300000000003j)), Arc(start=(365.217+126.89300000000003j), radius=(51.746+51.746j), rotation=0.0, arc=False, sweep=False, end=(336.168+114.92100000000003j)), Arc(start=(336.168+114.92100000000003j), radius=(151.429+151.429j), rotation=0.0, arc=False, sweep=False, end=(305.437+113.18500000000003j)), Arc(start=(305.437+113.18500000000003j), radius=(136.436+136.436j), rotation=0.0, arc=False, sweep=False, end=(317.5+95.82200000000003j)), Arc(start=(317.5+95.82200000000003j), radius=(51.744+51.744j), rotation=0.0, arc=False, sweep=False, end=(326.861+65.83000000000003j)), CubicBezier(start=(326.861+65.83000000000003j), control1=(326.861+38.312000000000026j), control2=(305.92+15.930000000000028j), end=(280.18+15.930000000000028j)), Arc(start=(280.18+15.930000000000028j), radius=(44.6+44.6j), rotation=0.0, arc=False, sweep=False, end=(256+23.13400000000003j)), Arc(start=(256+23.13400000000003j), radius=(44.6+44.6j), rotation=0.0, arc=False, sweep=False, end=(231.824+15.92500000000003j)), CubicBezier(start=(231.824+15.92500000000003j), control1=(206.084+15.92500000000003j), control2=(185.14300000000003+38.312000000000026j), end=(185.14300000000003+65.83000000000003j)), Arc(start=(185.14300000000003+65.83000000000003j), radius=(51.738+51.738j), rotation=0.0, arc=False, sweep=False, end=(194.50500000000002+95.82200000000003j)), Arc(start=(194.50500000000002+95.82200000000003j), radius=(136.32+136.32j), rotation=0.0, arc=False, sweep=False, end=(206.56000000000003+113.18000000000004j)), Arc(start=(206.56000000000003+113.18000000000004j), radius=(151.568+151.568j), rotation=0.0, arc=False, sweep=False, end=(175.83000000000004+114.91600000000004j)), Arc(start=(175.83000000000004+114.91600000000004j), radius=(51.746+51.746j), rotation=0.0, arc=False, sweep=False, end=(146.78000000000003+126.88800000000003j)), CubicBezier(start=(146.78000000000003+126.88800000000003j), control1=(134.24600000000004+137.30700000000004j), control2=(127.24900000000002+152.83200000000002j), end=(128.06300000000005+168.41700000000003j)), Close(start=(128.06300000000005+168.41700000000003j), end=(144.042+167.583j))) 
          
Move , start/end coords: ((144.042, 167.583), (144.042, 167.583))
CubicBezier , start/end coords: ((144.042, 167.583), (157.009, 139.192))
Arc , start/end coords: ((157.009, 139.192), (177.398, 130.843))
Arc , start/end coords: ((177.398, 130.843), (178.224, 130.743))
CubicBezier , start/end coords: ((178.224, 130.743), (224.794, 130.601))
Arc , start/end coords: ((224.794, 130.601), (231.431, 117.074))
CubicBezier , start/end coords: ((231.431, 117.074), (208.203, 87.55))
Arc , start/end coords: ((208.203, 87.55), (207.756, 86.85))
Arc , start/end coords: ((207.756, 86.85), (201.143, 65.832))
CubicBezier , start/end coords: ((201.143, 65.832), (231.824, 31.932))
Arc , start/end coords: ((231.824, 31.932), (250.754, 39.164))
Arc , start/end coords: ((250.754, 39.164), (261.246, 39.164))
Arc , start/end coords: ((261.246, 39.164), (280.176, 31.932))
CubicBezier , start/end coords: ((280.176, 31.932), (310.857, 65.837))
Arc , start/end coords: ((310.857, 65.837), (304.244, 86.855))
Arc , start/end coords: ((304.244, 86.855), (303.797, 87.555))
CubicBezier , start/end coords: ((303.797, 87.555), (280.569, 117.079))
Arc , start/end coords: ((280.569, 117.079), (287.206, 130.606))
CubicBezier , start/end coords: ((287.206, 130.606), (333.776, 130.748))
Arc , start/end coords: ((333.776, 130.748), (334.602, 130.848))
Arc , start/end coords: ((334.602, 130.848), (354.99, 139.196))
CubicBezier , start/end coords: ((354.99, 139.196), (357.663, 141.641))
Line , start/end coords: ((357.663, 141.641), (369.017, 130.368))
CubicBezier , start/end coords: ((369.017, 130.368), (365.217, 126.893))
Arc , start/end coords: ((365.217, 126.893), (336.168, 114.921))
Arc , start/end coords: ((336.168, 114.921), (305.437, 113.185))
Arc , start/end coords: ((305.437, 113.185), (317.5, 95.822))
Arc , start/end coords: ((317.5, 95.822), (326.861, 65.83))
CubicBezier , start/end coords: ((326.861, 65.83), (280.18, 15.93))
Arc , start/end coords: ((280.18, 15.93), (256.0, 23.134))
Arc , start/end coords: ((256.0, 23.134), (231.824, 15.925))
CubicBezier , start/end coords: ((231.824, 15.925), (185.143, 65.83))
Arc , start/end coords: ((185.143, 65.83), (194.505, 95.822))
Arc , start/end coords: ((194.505, 95.822), (206.56, 113.18))
Arc , start/end coords: ((206.56, 113.18), (175.83, 114.916))
Arc , start/end coords: ((175.83, 114.916), (146.78, 126.888))
CubicBezier , start/end coords: ((146.78, 126.888), (128.063, 168.417))
Close , start/end coords: ((128.063, 168.417), (144.042, 167.583))
          
Path 1
Objects:
 Path(Move(to=(272.924+205.044j)), Arc(start=(272.924+205.044j), radius=(7.852+7.852j), rotation=0.0, arc=False, sweep=False, end=(272.67199999999997+204.251j)), CubicBezier(start=(272.67199999999997+204.251j), control1=(271.53+201.213j), control2=(270.472+197.863j), end=(269.525+194.293j)), Arc(start=(269.525+194.293j), radius=(13.993+13.993j), rotation=0.0, arc=False, sweep=False, end=(242.47499999999997+194.293j)), CubicBezier(start=(242.47499999999997+194.293j), control1=(241.52799999999996+197.862j), control2=(240.47499999999997+201.21200000000002j), end=(239.32799999999997+204.25j)), Arc(start=(239.32799999999997+204.25j), radius=(7.852+7.852j), rotation=0.0, arc=False, sweep=False, end=(239.07599999999996+205.043j)), Arc(start=(239.07599999999996+205.043j), radius=(36.468+36.468j), rotation=0.0, arc=False, sweep=True, end=(200.85499999999996+231.812j)), Line(start=(200.85499999999996+231.812j), end=(199.14499999999995+247.721j)), Arc(start=(199.14499999999995+247.721j), radius=(48.387+48.387j), rotation=0.0, arc=False, sweep=False, end=(204.30699999999996+247.997j)), Arc(start=(204.30699999999996+247.997j), radius=(52.047+52.047j), rotation=0.0, arc=False, sweep=False, end=(237.36699999999996+235.86800000000002j)), Arc(start=(237.36699999999996+235.86800000000002j), radius=(53.056+53.056j), rotation=0.0, arc=False, sweep=False, end=(247.99999999999997+223.94600000000003j)), Line(start=(247.99999999999997+223.94600000000003j), end=(247.99999999999997+296j)), Line(start=(247.99999999999997+296j), end=(264+296j)), Line(start=(264+296j), end=(264+223.946j)), Arc(start=(264+223.946j), radius=(53.741+53.741j), rotation=0.0, arc=False, sweep=False, end=(284.343+242.3j)), Line(start=(284.343+242.3j), end=(291.65700000000004+228.07100000000003j)), Arc(start=(291.65700000000004+228.07100000000003j), radius=(37.536+37.536j), rotation=0.0, arc=False, sweep=True, end=(284.857+223.57100000000003j)), Arc(start=(284.857+223.57100000000003j), radius=(35.815+35.815j), rotation=0.0, arc=False, sweep=True, end=(272.92400000000004+205.04400000000004j)), Close(start=(272.92400000000004+205.04400000000004j), end=(272.924+205.044j))) 
          
Move , start/end coords: ((272.924, 205.044), (272.924, 205.044))
Arc , start/end coords: ((272.924, 205.044), (272.672, 204.251))
CubicBezier , start/end coords: ((272.672, 204.251), (269.525, 194.293))
Arc , start/end coords: ((269.525, 194.293), (242.475, 194.293))
CubicBezier , start/end coords: ((242.475, 194.293), (239.328, 204.25))
Arc , start/end coords: ((239.328, 204.25), (239.076, 205.043))
Arc , start/end coords: ((239.076, 205.043), (200.855, 231.812))
Line , start/end coords: ((200.855, 231.812), (199.145, 247.721))
Arc , start/end coords: ((199.145, 247.721), (204.307, 247.997))
Arc , start/end coords: ((204.307, 247.997), (237.367, 235.868))
Arc , start/end coords: ((237.367, 235.868), (248.0, 223.946))
Line , start/end coords: ((248.0, 223.946), (248.0, 296.0))
Line , start/end coords: ((248.0, 296.0), (264.0, 296.0))
Line , start/end coords: ((264.0, 296.0), (264.0, 223.946))
Arc , start/end coords: ((264.0, 223.946), (284.343, 242.3))
Line , start/end coords: ((284.343, 242.3), (291.657, 228.071))
Arc , start/end coords: ((291.657, 228.071), (284.857, 223.571))
Arc , start/end coords: ((284.857, 223.571), (272.924, 205.044))
Close , start/end coords: ((272.924, 205.044), (272.924, 205.044))
          
Path 2
Objects:
 Path(Move(to=(248+312j)), Line(start=(248+312j), end=(264+312j)), Line(start=(264+312j), end=(264+496j)), Line(start=(264+496j), end=(248+496j)), Close(start=(248+496j), end=(248+312j))) 
          
Move , start/end coords: ((248.0, 312.0), (248.0, 312.0))
Line , start/end coords: ((248.0, 312.0), (264.0, 312.0))
Line , start/end coords: ((264.0, 312.0), (264.0, 496.0))
Line , start/end coords: ((264.0, 496.0), (248.0, 496.0))
Close , start/end coords: ((248.0, 496.0), (248.0, 312.0))
          
Path 3
Objects:
 Path(Move(to=(272+56j)), Line(start=(272+56j), end=(288+56j)), Line(start=(288+56j), end=(288+72j)), Line(start=(288+72j), end=(272+72j)), Close(start=(272+72j), end=(272+56j))) 
          
Move , start/end coords: ((272.0, 56.0), (272.0, 56.0))
Line , start/end coords: ((272.0, 56.0), (288.0, 56.0))
Line , start/end coords: ((288.0, 56.0), (288.0, 72.0))
Line , start/end coords: ((288.0, 72.0), (272.0, 72.0))
Close , start/end coords: ((272.0, 72.0), (272.0, 56.0))
          
Path 4
Objects:
 Path(Move(to=(496+288j)), Line(start=(496+288j), end=(496+284j)), Arc(start=(496+284j), radius=(28.032+28.032j), rotation=0.0, arc=False, sweep=False, end=(468+256j)), Line(start=(468+256j), end=(450.4+256j)), Arc(start=(450.4+256j), radius=(182.459+182.459j), rotation=0.0, arc=False, sweep=False, end=(436.52099999999996+217.525j)), Arc(start=(436.52099999999996+217.525j), radius=(28.012+28.012j), rotation=0.0, arc=False, sweep=False, end=(412.68399999999997+176.008j)), Arc(start=(412.68399999999997+176.008j), radius=(40.037+40.037j), rotation=0.0, arc=False, sweep=False, end=(339.308+176.008j)), Arc(start=(339.308+176.008j), radius=(28.012+28.012j), rotation=0.0, arc=False, sweep=False, end=(315.471+217.525j)), CubicBezier(start=(315.471+217.525j), control1=(302.719+243.207j), control2=(296+272.96500000000003j), end=(296+304j)), CubicBezier(start=(296+304j), control1=(296+337.20799999999997j), control2=(303.692+368.956j), end=(318.244+395.812j)), Arc(start=(318.244+395.812j), radius=(8+8j), rotation=0.0, arc=False, sweep=False, end=(325.278+400j)), Line(start=(325.278+400j), end=(368+400j)), Line(start=(368+400j), end=(368+496j)), Line(start=(368+496j), end=(384+496j)), Line(start=(384+496j), end=(384+400j)), Line(start=(384+400j), end=(426.722+400j)), Arc(start=(426.722+400j), radius=(8+8j), rotation=0.0, arc=False, sweep=False, end=(433.756+395.812j)), Arc(start=(433.756+395.812j), radius=(180.656+180.656j), rotation=0.0, arc=False, sweep=False, end=(450.4+352j)), Line(start=(450.4+352j), end=(458+352j)), Arc(start=(458+352j), radius=(38.043+38.043j), rotation=0.0, arc=False, sweep=False, end=(496+314j)), Line(start=(496+314j), end=(496+304j)), Line(start=(496+304j), end=(480+304j)), Line(start=(480+304j), end=(480+314j)), Arc(start=(480+314j), radius=(22.025+22.025j), rotation=0.0, arc=False, sweep=True, end=(458+336j)), Line(start=(458+336j), end=(453.56+336j)), Arc(start=(453.56+336j), radius=(211.056+211.056j), rotation=0.0, arc=False, sweep=False, end=(453.56+272j)), Line(start=(453.56+272j), end=(468+272j)), Arc(start=(468+272j), radius=(12.013+12.013j), rotation=0.0, arc=False, sweep=True, end=(480+284j)), Line(start=(480+284j), end=(480+288j)), Close(start=(480+288j), end=(496+288j)), Move(to=(433.907+352j)), Line(start=(433.907+352j), end=(318.09299999999996+352j)), Arc(start=(318.09299999999996+352j), radius=(192.116+192.116j), rotation=0.0, arc=False, sweep=True, end=(318.09299999999996+256j)), Line(start=(318.09299999999996+256j), end=(391.99999999999994+256j)), Line(start=(391.99999999999994+256j), end=(391.99999999999994+240j)), Line(start=(391.99999999999994+240j), end=(323.17699999999996+240j)), Arc(start=(323.17699999999996+240j), radius=(159.556+159.556j), rotation=0.0, arc=False, sweep=True, end=(330.128+224j)), Line(start=(330.128+224j), end=(421.87199999999996+224j)), Arc(start=(421.87199999999996+224j), radius=(159.556+159.556j), rotation=0.0, arc=False, sweep=True, end=(428.823+240j)), Line(start=(428.823+240j), end=(408+240j)), Line(start=(408+240j), end=(408+256j)), Line(start=(408+256j), end=(433.907+256j)), Arc(start=(433.907+256j), radius=(192.116+192.116j), rotation=0.0, arc=False, sweep=True, end=(433.907+352j)), Close(start=(433.907+352j), end=(433.907+352j)), Move(to=(340+192j)), Arc(start=(340+192j), radius=(12.077+12.077j), rotation=0.0, arc=False, sweep=True, end=(342.923+192.357j)), Arc(start=(342.923+192.357j), radius=(8+8j), rotation=0.0, arc=False, sweep=False, end=(352.646+186.44j)), Arc(start=(352.646+186.44j), radius=(24.009+24.009j), rotation=0.0, arc=False, sweep=True, end=(399.35400000000004+186.44j)), Arc(start=(399.35400000000004+186.44j), radius=(8+8j), rotation=0.0, arc=False, sweep=False, end=(409.07700000000006+192.357j)), Arc(start=(409.07700000000006+192.357j), radius=(12.016+12.016j), rotation=0.0, arc=False, sweep=True, end=(424.00000000000006+204j)), Arc(start=(424.00000000000006+204j), radius=(11.949+11.949j), rotation=0.0, arc=False, sweep=True, end=(423.32000000000005+208j)), Line(start=(423.32000000000005+208j), end=(328.68000000000006+208j)), Arc(start=(328.68000000000006+208j), radius=(12.015+12.015j), rotation=0.0, arc=False, sweep=True, end=(340.00000000000006+192j)), Close(start=(340.00000000000006+192j), end=(340+192j)), Move(to=(330.128+384j)), Arc(start=(330.128+384j), radius=(159.556+159.556j), rotation=0.0, arc=False, sweep=True, end=(323.17699999999996+368j)), Line(start=(323.17699999999996+368j), end=(428.823+368j)), Arc(start=(428.823+368j), radius=(159.556+159.556j), rotation=0.0, arc=False, sweep=True, end=(421.87199999999996+384j)), Close(start=(421.87199999999996+384j), end=(330.128+384j))) 
          
Move , start/end coords: ((496.0, 288.0), (496.0, 288.0))
Line , start/end coords: ((496.0, 288.0), (496.0, 284.0))
Arc , start/end coords: ((496.0, 284.0), (468.0, 256.0))
Line , start/end coords: ((468.0, 256.0), (450.4, 256.0))
Arc , start/end coords: ((450.4, 256.0), (436.521, 217.525))
Arc , start/end coords: ((436.521, 217.525), (412.684, 176.008))
Arc , start/end coords: ((412.684, 176.008), (339.308, 176.008))
Arc , start/end coords: ((339.308, 176.008), (315.471, 217.525))
CubicBezier , start/end coords: ((315.471, 217.525), (296.0, 304.0))
CubicBezier , start/end coords: ((296.0, 304.0), (318.244, 395.812))
Arc , start/end coords: ((318.244, 395.812), (325.278, 400.0))
Line , start/end coords: ((325.278, 400.0), (368.0, 400.0))
Line , start/end coords: ((368.0, 400.0), (368.0, 496.0))
Line , start/end coords: ((368.0, 496.0), (384.0, 496.0))
Line , start/end coords: ((384.0, 496.0), (384.0, 400.0))
Line , start/end coords: ((384.0, 400.0), (426.722, 400.0))
Arc , start/end coords: ((426.722, 400.0), (433.756, 395.812))
Arc , start/end coords: ((433.756, 395.812), (450.4, 352.0))
Line , start/end coords: ((450.4, 352.0), (458.0, 352.0))
Arc , start/end coords: ((458.0, 352.0), (496.0, 314.0))
Line , start/end coords: ((496.0, 314.0), (496.0, 304.0))
Line , start/end coords: ((496.0, 304.0), (480.0, 304.0))
Line , start/end coords: ((480.0, 304.0), (480.0, 314.0))
Arc , start/end coords: ((480.0, 314.0), (458.0, 336.0))
Line , start/end coords: ((458.0, 336.0), (453.56, 336.0))
Arc , start/end coords: ((453.56, 336.0), (453.56, 272.0))
Line , start/end coords: ((453.56, 272.0), (468.0, 272.0))
Arc , start/end coords: ((468.0, 272.0), (480.0, 284.0))
Line , start/end coords: ((480.0, 284.0), (480.0, 288.0))
Close , start/end coords: ((480.0, 288.0), (496.0, 288.0))
Move , start/end coords: ((433.907, 352.0), (433.907, 352.0))
Line , start/end coords: ((433.907, 352.0), (318.093, 352.0))
Arc , start/end coords: ((318.093, 352.0), (318.093, 256.0))
Line , start/end coords: ((318.093, 256.0), (392.0, 256.0))
Line , start/end coords: ((392.0, 256.0), (392.0, 240.0))
Line , start/end coords: ((392.0, 240.0), (323.177, 240.0))
Arc , start/end coords: ((323.177, 240.0), (330.128, 224.0))
Line , start/end coords: ((330.128, 224.0), (421.872, 224.0))
Arc , start/end coords: ((421.872, 224.0), (428.823, 240.0))
Line , start/end coords: ((428.823, 240.0), (408.0, 240.0))
Line , start/end coords: ((408.0, 240.0), (408.0, 256.0))
Line , start/end coords: ((408.0, 256.0), (433.907, 256.0))
Arc , start/end coords: ((433.907, 256.0), (433.907, 352.0))
Close , start/end coords: ((433.907, 352.0), (433.907, 352.0))
Move , start/end coords: ((340.0, 192.0), (340.0, 192.0))
Arc , start/end coords: ((340.0, 192.0), (342.923, 192.357))
Arc , start/end coords: ((342.923, 192.357), (352.646, 186.44))
Arc , start/end coords: ((352.646, 186.44), (399.354, 186.44))
Arc , start/end coords: ((399.354, 186.44), (409.077, 192.357))
Arc , start/end coords: ((409.077, 192.357), (424.0, 204.0))
Arc , start/end coords: ((424.0, 204.0), (423.32, 208.0))
Line , start/end coords: ((423.32, 208.0), (328.68, 208.0))
Arc , start/end coords: ((328.68, 208.0), (340.0, 192.0))
Close , start/end coords: ((340.0, 192.0), (340.0, 192.0))
Move , start/end coords: ((330.128, 384.0), (330.128, 384.0))
Arc , start/end coords: ((330.128, 384.0), (323.177, 368.0))
Line , start/end coords: ((323.177, 368.0), (428.823, 368.0))
Arc , start/end coords: ((428.823, 368.0), (421.872, 384.0))
Close , start/end coords: ((421.872, 384.0), (330.128, 384.0))
          
Path 5
Objects:
 Path(Move(to=(336+280j)), Line(start=(336+280j), end=(352+280j)), Line(start=(352+280j), end=(352+296j)), Line(start=(352+296j), end=(336+296j)), Close(start=(336+296j), end=(336+280j))) 
          
Move , start/end coords: ((336.0, 280.0), (336.0, 280.0))
Line , start/end coords: ((336.0, 280.0), (352.0, 280.0))
Line , start/end coords: ((352.0, 280.0), (352.0, 296.0))
Line , start/end coords: ((352.0, 296.0), (336.0, 296.0))
Close , start/end coords: ((336.0, 296.0), (336.0, 280.0))
          
Path 6
Objects:
 Path(Move(to=(392+312j)), Line(start=(392+312j), end=(408+312j)), Line(start=(408+312j), end=(408+328j)), Line(start=(408+328j), end=(392+328j)), Close(start=(392+328j), end=(392+312j))) 
          
Move , start/end coords: ((392.0, 312.0), (392.0, 312.0))
Line , start/end coords: ((392.0, 312.0), (408.0, 312.0))
Line , start/end coords: ((408.0, 312.0), (408.0, 328.0))
Line , start/end coords: ((408.0, 328.0), (392.0, 328.0))
Close , start/end coords: ((392.0, 328.0), (392.0, 312.0))
          

................................

变体2。使用JavaScript

有一个svg-path-interpolator图书馆

安装它npm install -g svg-path-interpolator

写config.json的内容，例如

{
  "joinPathData": false,
  "minDistance": 0.5,
  "roundToNearest": 0.25,
  "sampleFrequency": 0.001,
  "pretty": false,
  "prettyIndent": 0
}

运行它svgpi config.json ballons.svg ballons.json，输出ballons.json将包含所有路径/直线/曲线的渲染（X，Y）点

在代码中，您可以使用如下库：

import SVGPathInterpolator from 'SVGPathInterpolator';
const svgString = `
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
width="792px" height="612px" viewBox="0 0 792 612" enable-background="new 0 0 792 612" xml:space="preserve">
    <g>
        <path id="path3789" d="M287.168,442.411
        c-8.65,0-15.652,7.003-15.652,15.653
        c0,8.65,7.003,15.69,15.652,15.69
        s15.653-7.04,15.653-15.69
        "/>
    </g>
</svg>
`;
const config = {
    joinPathData: false,
    minDistance: 0.5,
    roundToNearest: 0.25,
    sampleFrequency: 0.001
};
const interpolator = new SVGPathInterpolator(config);
const pathData = interpolator.processSvg(svgString);
网友
2楼 · 编辑于 2024-06-08 05:23:46

在彻底搜索了互联网之后，我找到了这个了不起的网站，它满足了我的需求

https://spotify.github.io/coordinator

相关问题 更多 >

    编程相关推荐

    热门问题