我有一个SVG绘制一个折线，类似于：
<polyline points="500 10 500 20 500 30 500 40 500
50 500 60 500 70 500 80 500 90 500
101 500 111 500 121 500 131 500 141 500
151 500 161 500 171 500 181 500 191 500
202 500 212 500 222 500 232 500 242 500
252 500 262 500 272 500 282 500 292 500
303 500 313 500 323 500 33 ... "/>我想避免在属性中指定点，原因如下：
- 点数可能会变得非常大(1,000个数字)，而在属性中包含它们会使SVG难以阅读和处理。
- 这组点在相同的SVG中使用了几次，我希望避免对绘制的每一行重复它。
我知道，对于文本，您可以使用<tref>来引用其他地方定义的文本。这也能做到这一点吗？
回答 3
Stack Overflow用户
回答已采纳
发布于 2012-10-23 06:38:25
您可以利用 (规格说明)元素：
<defs>
<polyline points="..." id="foo" />
</defs>
<use xlink:href="#foo" x="100" y="100" stroke="#ff0000" />但是，在普通SVG中，无法将点数据从属性中移动。您必须使用其他一些技术，JavaScript、XSLT或其他预处理或后置处理。
编辑:孩子们，不要在家里尝试这种方法，但是您可以使用XML实体将这些点存储在另一个地方：
<!DOCTYPE svg [
<!ENTITY points "[your points go here]">
]>
<svg>
<polyline points="&points;" />
</svg>然而，我强烈反对这个解决方案，因为它是可以预见的，处理软件会因此而窒息。我想浏览器对此没有意见(只要没有HTML5上下文)，但其他浏览器，如Inkscape、、Batik等，可能不会很好地发挥这种功能。
Stack Overflow用户
发布于 2012-10-23 10:56:14
也许在你的例子中，a会更易读和更紧凑？h和v命令(以及它们的绝对对应方H和V)在看到您的示例时会出现在脑海中。
Stack Overflow用户
发布于 2012-10-23 06:40:44
我还没有听说过在SVG中有什么方法可以做到这一点。
我会考虑编写一个脚本来生成SVG代码，而不是手动执行这样的操作。这样，您就可以在SVG中添加更多的结构。SVG实际上是要生成的，而不是手工编码的。
在你的例子中，你应该只做两个循环。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13032872
复制相关文章
腾讯云开发者
