1

我想在 svg 中创建一个可以重用的组件。这将绘制一个包含文本的矩形：

    <g id='TestComponent'>
        <rect x='200' y='235' width='100' height='30' rx='10' style='fill: white; stroke: lightgrey;'/>
        <text x='250' y='252' text-anchor='middle' alignment-baseline='middle' style='fill:black;font-family: Helvetica'>Test</text>
    </g>

如果我在容器“g”元素之间定义它：测试

然后我可以像这样使用它：

    <use xlink:href='#TestComponent' />

我还可以移动它并通过以下方式重用它：

    <use xlink:href='#TestComponent' x=100 y=100 />

这是我的问题，我希望能够更改文本。那可能吗？我想做的是：

    <use xlink:href='#TestComponent' text="Hello world 2"/>

有没有办法做到这一点？如果不是，那么构建这种东西的首选方法是什么，以便我可以重用并尽可能避免重复？

/汉斯

4

2 回答 2

0

是的，您可以在 SVG 中重用参数化结构。查看描述和示例：www.w3.org或www.schepers.cc。

于 2012-10-19T13:23:55.480 回答
0

您可以使用 XSLT 或 javascript。<use> 开箱即用的功能无法满足您的要求。

于 2012-10-19T13:40:40.090 回答