首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >提取合并 svg 文件中的 path

提取合并 svg 文件中的 path

作者头像
jgrass
发布2024-12-25 17:00:38
发布2024-12-25 17:00:38
1.2K0
举报
文章被收录于专栏:蔻丁杂记蔻丁杂记

需求背景

有一个 svg 文件,但只需要里面的 path 数据,并且最好是合并的 path。

工具

GIMP GIMP - Downloads

除了可以提取 path 之外,还可以辅助修改图片的尺寸。

Step 1 打开 svg 文件

Step 2 调整大小,选择导入路径

在打开 svg 文件的弹窗中,完成大小的调整,并选择导入路径。

2.1 调整大小

将宽度和高度的较大者,调整成符合需求的大小。如需要的是 32*32 的图片,这里将宽度调整为 32,按 Enter 或者失去焦点确认。高度会自动变化。

2.2 导入路径

选择 “导入路径” 和 “合并导入的路径”

Step 3 导出 path

在窗口中,打开路径操作窗口

选中导入的路径,鼠标右键,选择导出路径

导出的也是一个 svg 文件

Step 4 提取 path

使用文本编辑器打开导出的文件,即可得到合并之后的 path 数据。

上图属性 d 中的数据,M 13.79,8.79 C ... ... 就是 path 数据了。

参考

html - is there a tool to create SVG paths from an SVG file? - Stack Overflow

其它工具:

dotnet-campus/dotnetCampus.SvgPathCombiner: A tool to convert svg to xaml and combine all the paths into a single one. 将 SVG 转换成 XAML 的工具,也可以将 SVG 中所有的路径合并成一个路径。

原文链接: https://cloud.tencent.com/developer/article/2481533

本作品采用 「署名 4.0 国际」 许可协议进行许可,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022年3月16日 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 需求背景
  • 工具
    • Step 1 打开 svg 文件
    • Step 2 调整大小,选择导入路径
    • Step 3 导出 path
    • Step 4 提取 path
  • 参考
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档