我该如何绘制这种SVG

时间:2016-11-29 00:23:13

标签: svg

我正在处理别人的代码,而且无法与他们联系,这就是我的问题:

{ "name":"Jonny", "id":"a*3.!H-",", "town":"Boston"}

这是SVG标签中的一些代码,它围绕它绘制一个带圆圈的箭头,我的问题是,假设我想绘制一个解释标记,我该怎么做?

我确定<g ng-attr-transform="translate({{node.width-18}}, 0) scale(0.6)" ng-mouseover="showArrowMenuTooltip($event, node);" ng-click="showArrowMenuTooltip($event, node);" ng-mouseleave="hideArrowMenuTooltip($event);" ng-attr-class="{{'flowchart-arrow-show-'+node.activity.act_task +' flowchart-arrow-set'}}"> <!--Circle--> <path class="flowchart-arrow-circle" d="M16,1.466C7.973,1.466,1.466,7.973,1.466,16c0,8.027,6.507,14.534,14.534,14.534c8.027,0,14.534-6.507,14.534-14.534C30.534,7.973,24.027,1.466,16,1.466z" ></path> <!--Arrow--> <path class="flowchart-arrow" d="M13.665,25.725l-3.536-3.539l6.187-6.187l-6.187-6.187l3.536-3.536l9.724,9.723L13.665,25.725z" ></path> </g> 部分不是手动编写的,但我无法在线查找任何有用的文档或工具。

1 个答案:

答案 0 :(得分:0)

你所追求的是一个'Path'元素。

请查看此文档:

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

  

通过包含包含a的'path'元素来定义路径   d =“(路径数据)”属性,其中'd'属性包含   moveto,line,curve(包括立方和二次Béziers),弧和   近路指示。

     

示例triangle01指定三角形形状的路径。 (M   表示移动,Ls表示行,z表示a   closepath)。