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

时间:2015-07-19 16:26:57

标签: svg xwiki

背景:

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

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

问题:

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

最小例子:



<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;
&#13;
&#13;

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

参考文献:

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

1 个答案:

答案 0 :(得分:0)

问题不在于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__.