0

您好我正在尝试在由 Django 模板呈现的文档中提供 svg 内联,其中 svg(2D 线条图)和文档上下文是动态生成的。svg_string 被放入我的 django 上下文并由模板呈现。

{{ svg_string|safe }}

我使用的 django 版本是 1.4.2,Python 版本是 2.7.3 .rdkit 我所有的代码在永久 IP 上都运行良好。svg 完美呈现。

现在,当我尝试使用 django (1.4.2) 开发服务器测试包含视图的 SVG 时http://127.0.0.1:8000

我只得到在 Chrome、Firefox 和 Safari 中呈现的 svg 中的文本标签。

然而,这两个 svg 之间有一个区别。它们由不同版本的 rdkit Cheminformatics 库生成,该库在后端使用 cairo。

生产服务器提供的 svg 在 html 页面的视图源中具有 svg:

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="300pt" height="300pt" viewBox="0 0 300 300" version="1.1">
<defs>
<g>
<symbol overflow="visible" id="glyph0-0">
<path style="stroke:none;" d="M 0.40625 1.421875 L 0.40625 -5.640625 L 4.40625 -5.640625 L 4.40625 1.421875 Z M 0.84375 0.96875 L 3.953125 0.96875 L 3.953125 -5.1875 L 0.84375 -5.1875 Z "/>
</symbol>
<symbol overflow="visible" id="glyph0-1">
<path style="stroke:none;" d="M 0.78125 -5.828125 L 1.84375 -5.828125 L 4.4375 -0.953125 L 4.4375 -5.828125 L 5.203125 -5.828125 L 5.203125 0 L 4.140625 0 L 1.546875 -4.875 L 1.546875 0 L 0.78125 0 Z "/>
</symbol>
<symbol overflow="visible" id="glyph0-2">
<path style="stroke:none;" d="M 0.78125 -5.828125 L 1.578125 -5.828125 L 1.578125 -3.4375 L 4.4375 -3.4375 L 4.4375 -5.828125 L 5.234375 -5.828125 L 5.234375 0 L 4.4375 0 L  
....

开发服务器 svg 以文本形式查看时具有不同的结构,并显示以下行为:将其保存到文件后在浏览器中呈现:有效。将内容类型强制为 xhtml+xml 后在浏览器中呈现:有效。

不与默认 content-type 内联呈现。仅显示字体。

svg 看起来像

<svg:svg version="1.1" baseProfile="full"
        xmlns:svg="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink"
        xml:space="preserve" width="300px" height="300px" >
<svg:line x1="114.41" y1="132.42" x2="130.03" y2="146.44" stroke="rgb(0,0,0)" stroke-width="1"></svg:line>
<svg:line x1="113.56" y1="136.50" x2="126.06" y2="147.72" stroke="rgb(0,0,0)" stroke-width="1"></svg:line>

<svg:line x1="87.26" y1="137.68" x2="96.45" y2="142.94" stroke="rgb(0,0,255)" stroke-width="1"><

可悲的是,使用 xhmtl+xml 会破坏我所有的 css 和 javascript(引导程序),因此不可行。

我已经尝试了其他建议的解决方法以在开发过程中正确呈现此 svg 对我不起作用

有没有办法让上面显示的 rdkit 库提供的内联 svg 在开发服务器中呈现而不使用 xhtml+xml 内容类型?

4

1 回答 1

2

我相信浏览器不会在text/html文档中绘制这个 SVG,因为它不能识别svgXML 命名空间。您需要将 SVG 放在默认命名空间中。尝试这个:

svg_string = svg_string.replace(u'svg:', u'').replace(u'xmlns:svg', u'xmlns')

这是一个足以满足您的开发需求的 hack,但是如果您想在生产中执行此操作,您应该使用 ElementTree 或任何其他 XML 库更正确地执行此操作。

于 2013-11-16T15:54:01.850 回答