Use Adobe Illustrator to create SVG Path using “move to” commands

一个人想着一个人 提交于 2019-12-07 02:18:24

问题


So when you export an Adobe Illustrator file to SVG format, paths are encoded using the SVG path syntax:

http://www.w3.org/TR/SVG/paths.html

If you look at the "path data" element, it's possible to have "move to" commands embedded into a path:

http://www.w3.org/TR/SVG/paths.html#PathData

In other words, you draw a few lines in the path, pick up the pen and move it somewhere else, and continue the same path.

I have been trying to figure out how to do this in Illustrator to no avail. You can add on to an existing path but it seems you can only do this by extending the path from one of the endpoints. I don't want to do this: I want to continue the path from somewhere else.

You can get something sort of like this by grouping two disjoint paths. However when Illustrator does the svg export it just creates two <path> tags and puts them inside a <g> tag which is not what I want. If I manually edit an svg file with a text editor, adding "move to" commands, and I import them, it looks like maybe what Illustrator is doing is creating a group, but I can't tell because I don't know how to select and object and figure out if it is a group or not.


回答1:


I think the only way would be to mak a compound path. Select both paths you want to use as a single path and go to Object > Compound Path > Make.

If this doesnt work then its probably not possible. This is the only way i can think of in which a non-contiguous path would even exists as far as AI sees it.




回答2:


  1. Create a file that has a path using move-to commands:

    <?xml version="1.0" encoding="UTF-8" standalone="no"?>
    <svg xmlns="http://www.w3.org/2000/svg" version="1.1"
         viewBox="-25 -25 100 100">
      <path d="M0,0 L50,0 M50,50 L0,50" stroke="black" />
    </svg>
    
  2. Open this file in Illustrator. Note that there is a single element named <Compound Path> in the Layers palette.

  3. Choose command Object > Compound Path > Release. Now there are two paths selected.

  4. Choose command Object > Compound Path > Make.

  5. Save as SVG file:

    <?xml version="1.0" encoding="utf-8"?>
    <!-- Generator: Adobe Illustrator 15.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
      "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" 
         xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
         width="612px" height="792px" viewBox="0 0 612 792"
         enable-background="new 0 0 612 792" xml:space="preserve">
      <path stroke="#000000" d="M128,218h306 M434,524H128"/>
    </svg>
    
  6. Cheer!



来源:https://stackoverflow.com/questions/7378742/use-adobe-illustrator-to-create-svg-path-using-move-to-commands

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!