Question

背景：

我有一个包含外部网页链接的svg图形。如果我直接在Firefox或IE链接中打开它，请转到其他URL。

我想在xWiki页面中插入图形。琐碎的方式：在wisiwig编辑器中Image/Attached image...在xwiki 2.1源代码中生成[[image:foo.svg||height="..." width="..."]]，但......链接不再可点击。

问题：

如何插入svg文档，使svg中的链接仍处于活动状态？

最小例子：

＆＃13;

<svg  xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink">
    <rect x="0" y="0" height="130" width="120"
          style="stroke:#000000; fill: #ffffff"/>
    <rect x="10" y="10" height="50" width="100"
          style="stroke:#ff0000; fill: #0000ff"/>
    <a xlink:href="http://www.google.fr">
	<rect x="10" y="70" height="50" width="100"
	      style="stroke:#ff0000; fill: #00ff00"/>
    </a>
</svg>

＆＃13;

如您所见，底部的绿色矩形包含指向Google的链接。但是当我在xwiki页面中插入它时，该链接不活动。我查看了生成的HTML，并看到svg包含在<img>标记中，我认为这就是链接不活动的原因。但我找不到如何让它发挥作用

参考文献：

我使用6.4.4版本的xwiki和2.1 xwiki语法，但我会接受版本7的解决方案或xwiki页面的其他语法

Answer 1

问题不在于XWiki，而在于浏览器将SVG作为<img>标记的目标的方式。您可以尝试使用简单的HTML：

<html>
  <body>
    <image src="foo.svg"/>
  </body>
</html>

也不会点击。

您可以改为嵌入SVG：

<html>
  <body>
    <svg  xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink">
      <rect x="0" y="0" height="130" width="120"
          style="stroke:#000000; fill: #ffffff"/>
      <rect x="10" y="10" height="50" width="100"
          style="stroke:#ff0000; fill: #0000ff"/>
      <a xlink:href="http://www.google.fr">
        <rect x="10" y="70" height="50" width="100"
              style="stroke:#ff0000; fill: #00ff00"/>
      </a>
    </svg>
  </body>
</html>

如果您可以在wiki文档中复制SVG文件的内容，那么您可以使用{{html clean="false"}}包装器：

Some **wiki content**

{{html clean="false"}}
<svg ....>
</svg>
{{/html}}

Some __other wiki content__.

如果没有，那么你应该这样做：

Some **wiki content**

{{velocity}}
{{html clean="false"}}
$doc.getAttachment('foo.svg').getContentAsString('UTF-8')
{{/html}}
{{/velocity}}

Some __other wiki content__.

如何在xwiki页面中插入包含链接的svg？

1 个答案: