使用SVG路径创建加号（+）

我试图为Google地图项目创建+号作为SVG路径。加号将使用图标路径属性沿多段线绘制。到目前为止，我已经设法靠近了，我的加号现在看起来像一条水平线，垂直线设置在一端“ - |”。我需要它出现在水平线的中间，使它看起来像一个加号。使用SVG路径创建加号（+）

path: 'M 0,-1 0,1 H -1,1 0,1'

我应该如何改变这种实现我的加号：

我现在的路径是使用以下路径命令来设置？我可以找到很多更复杂的形状，曲线，渐变填充等例子，但是我的知识有限，我正努力寻找正确的坐标来表达我的形状！

来源

2013-02-20 bUKaneer

您可以使用文本元素而不是路径，然后只是渲染一个加号字符？ – robwilliams 2013-02-20 12:59:56

我没有想到 - 任何语法的概念？ – bUKaneer 2013-02-20 13:04:31

如果你正在做'var x = {path：'M 0，-1 0,1 H -1,1 0,1'，strokeColor：'＃f00'}'，那么我们不知道，但采取了疯狂的猜测。 'var x = {text：'+'，strokeColor：'＃f00'}'？ – robwilliams 2013-02-20 13:16:12

我想你想要的是：

path: 'M0,-1 V1 M-1,0 H1'

其中在为启动转换（0，-1），画垂直1个单元，然后移动到（-1,0）和水平绘制1单元。

来源

2013-02-20 15:16:26

啊啊，谢谢你，现场更简洁！奇迹般有效。您能否推荐任何优秀的在线资源来测试路径等等，因为每次我进行改变时，我都需要生成和重新加载我的应用程序的一些小路径，这有点痛苦吗？非常感谢！ – bUKaneer 2013-02-20 15:23:19

我什么都不知道。我做了一些有点类似的事情，你可以拖动一些现有路径的点并查看代码：http://www.petercollingridge.co.uk/svg-tutorial/paths。也许我会尝试做一些你可以添加新路径和节点的地方。 – 2013-02-20 15:27:21

嗨，感谢您的提示和您的帖子，我肯定会阅读并使用它！ ; O） – bUKaneer 2013-02-20 16:25:27

虽然林相当肯定这是不是使用以下路径语句[更多通过反复试验和海龟的一些非常模糊的回忆]来形容这条道路的Ive设法构建一个加号的最简洁的方式：

path: 'M 0,0 H 0.5,0.5 1,1 M 0,0 V 0.5,0.5 1,1 M 0,0 H -0.5,-0.5 -1,-1 M 0,0 V -0.5,-0.5 -1,-1',

来源

2013-02-20 14:33:48 bUKaneer

使用SVG路径创建加号（+）

回答

相关问题