形成闭合路径的UIBezierPath子路径无法在SVG中表示

时间:2015-04-09 15:29:40

标签: ios svg uiwebview uibezierpath

我需要将UIBezierPath转换为SVG。 我的UIBezierPath内部具有集合立方贝塞尔路径作为子路径。 这些子路径合在一起形成一条封闭的路径,这意味着,最后一个立方贝塞尔曲线的终点与第一个立方贝塞尔曲线的起点相同。

当我在带有一些填充颜色的CAShapeLayer上绘制此路径时,整个路径将正确填充给定颜色。

现在,我需要在SVG中模拟相同的行为(在webview中加载),问题是子路径在svg中是独立的,我不能将它们组合在一起(将它们组合成一条路径) ,所以我们失去了这个路径集合被关闭的上下文信息,因此无法填充。

我试图将这些svg cubic-beizer路径放在g元素中,这也没有用。如下所示

<g>
<path  d="M1013.3,1228.7 C1007.1,1238.4 991.4,1242.6 984.2,1242.6" />
<path  d="M984.2,1233.6 C995.1,1237.3 1008.3,1231.7 1013.2,1231.7" />
<path  d="M1013.2,1221.3 C1018.0,1210.9 1013.8,1197.1 1004.0,1197.1" />
</g>

我该如何解决这个问题?任何投入都表示赞赏。

谢谢,

1 个答案:

答案 0 :(得分:1)

我不确定,但您可以在同一曲线中使用尽可能多的贝塞尔曲线。这是一种方式:http://jsfiddle.net/74os2um3/

只需将其放在一个<path>中,然后添加Z即可关闭它。

<path  d="M1013.3,1228.7 C1007.1,1238.4 991.4,1242.6 984.2,1242.6 L984.2,1233.6 C995.1,1237.3 1008.3,1231.7 1013.2,1231.7 L1013.2,1221.3 C1018.0,1210.9 1013.8,1197.1 1004.0,1197.1 Z" />