有没有可以从SVG文件创建SVG路径的工具? [英] is there a tool to create SVG paths from an SVG file?

问题描述

是否有人知道可以获取SVG文件并将其转换为HTML 5 SVG路径的工具?您知道d="M 0 0 L 20 134 L 233 24 Z" fill="#99dd79"部分吗?

does anyone know of a tool that can take an SVG file, and convert it into an HTML 5 SVG path? you know, the d="M 0 0 L 20 134 L 233 24 Z" fill="#99dd79" part?

我在这里:使用Adobe Illustrator使用移动到"路径创建SVG路径命令

但不确定.这是否意味着Illustrator可以删除任何行并将其另存为SVG路径?

But not sure. Does this mean Illustrator can take any line drwaing and save it as an SVG path?

注意: 是的，有inkscape，但是如果可能的话，我正在寻找渐变和遮罩支持.我希望能够利用.ai文件并使用illustrator或Acrobat或其他工具将其导出...那里有东西吗?还是将它作为输出格式内置到Illustrator或Acrobat中?

Note: Yes there is inkscape, but I'm looking for gradient and masking support, if that's possible. I'd like to be able to utilize .ai files and export them using illustrator or Acrobat or something... is there something out there? Or is it built in to Illustrator or Acrobat as an output format?

推荐答案

Gimp可用于将具有基本元素(例如，矩形，圆形等)的SVG转换为可在HTML5中使用的单个路径.

Gimp can be used to convert SVGs with primitives (e.g. rects, circles, etc.) into a single path which can be used within HTML5.

1. 首先下载Gimp: https://www.gimp.org/downloads/
2. 使用任何选择的工具将SVG导出为.svg文件.插画家.暂时不要担心SVG输出是否混乱，Gimp会清理它
3. 使用文件->打开将SVG文件导入Gimp，然后将显示以下(或类似的)对话框:

1. First download Gimp: https://www.gimp.org/downloads/
2. Export your SVG as a .svg file with any tool of choice e.g. Illustrator. Don't worry if the SVG output is messy for now, Gimp will clean it up
3. Import the SVG file into Gimp with File -> Open, and the following (or similar) dialog should show up:

同时选中导入路径和合并导入的路径选项

1. 然后转到 Windows-> Dockable Dialogues->路径
2. 右键单击显示 Imported Path 的单个路径，您将看到以下对话框:

1. Then go to Windows->Dockable Dialogues->Paths
2. Right-click on the single path which says Imported Path and you should see the following dialog:

1. 点击导出路径... ，然后将此文本文件保存到您选择的位置
2. 使用您选择的文本编辑器(例如记事本，TextEdit)查找并打开此文件
3. 在<path d="copy this text here" />
中复制文本
4. 由于Gimp用很多空格格式化文本，因此您可能需要重新格式化，方法是删除一些空格以将其粘贴到HTML中

1. Click Export Path... and save this text file to a location of your choice
2. Locate and open up this file with a text editor of your choice e.g Notepad, TextEdit
3. Copy the text within the <path d="copy this text here" />
4. Since Gimp formats the text with lots of spaces, you may need to re-format it, by removing some of the spaces to paste it into your HTML in a single line

这篇关于有没有可以从SVG文件创建SVG路径的工具?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！