Question

我试图在同一页面上渲染两个svg对象，但只渲染了第一个，第二个页面有文本＆＃34;这是第二个页面文本＆＃34;没有显示。

<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"   xml:space="preserve" viewBox="0 0 936 629" preserveAspectRatio="none">
<defs></defs>
<g transform="translate(304.89 84)">
<text font-family="arial" font-size="20" font-weight="normal" style="stroke: none; stroke-width: 1; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); opacity: 1;" transform="translate(-83.89 19)">
<tspan x="0" y="-13" fill="rgb(0,0,0)">click todsfsdfs edit!</tspan>
</text>
</g>
<g transform="translate(319.68 239)">
<text font-family="arial" font-size="20" font-weight="normal" style="stroke: none; stroke-width: 1; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); opacity: 1;" transform="translate(-81.68 19)">
<tspan x="0" y="-13" fill="rgb(0,0,0)">this is blocked text</tspan>
</text>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"   xml:space="preserve" viewBox="0 0 500 150" preserveAspectRatio="none">
<defs></defs>
<g transform="translate(255.46 254)">
<text font-family="arial" font-size="20" font-weight="normal" style="stroke: none; stroke-width: 1; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: #18bd18; opacity: 1;" transform="translate(-104.46 19)">
<tspan x="0" y="-13" fill="#18bd18">this is second page text</tspan>
</text>
</g>
</svg>

并且当服务器呈现它时显示问号字符，我不知道为什么它显示这个字符。当我保存为页面时它很好

http://screencast.com/t/zLQPhb3vB

感谢

Answer 1

此部分已将您的文字推离页面

<g transform=           "translate(255.46 254)"                >
<text font-family="arial" font-size="20" font-weight="normal" style="stroke: none; stroke-width: 1; stroke-dasharray: ; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: #18bd18; opacity: 1;" 
transform=              "translate(-104.46 19)"                >

http://jsfiddle.net/Vinodh/myTv4/1/

ERROR在定位（svg变换翻译部分）...... “translate（-104.46 19）”在负X轴方向推动线104.46px

建议您使用基于矢量的编辑器来创建诸如
的SVG Adobe Illustrator（付费），
Corel Draw（付费），
Inkscape（免费），
SVG edit（免费）

关于问号......！它应该是服务器的编码错误... 尝试查看服务器发送的编码！它应该改为UTF-8。

两个SVG在同一页面上

1 个答案: