13

是否可以在没有光栅化效果的情况下将一个 SVG 包含在另一个 SVG 中？我试过这个

<svg version="1.2" width="600.0pt" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 <image height="655.813953488" width="600.0" x="0" xlink:href="A.svg" y="0"/>
 <image height="740.540540541" width="600.0" x="0" xlink:href="B.svg" y="655.813953488"/>
</svg>

它渲染合成图像，A.svg但B.svg它们失去了矢量图形属性并变成位图（在chrome, inkscape, inkview和中测试eog）。生成的 svg 不会显示在网络浏览器中，因此不能选择外部 javascript 调用。如何在不复制、粘贴和保留矢量化的情况下将一个 svg “包含”到另一个中？

在 chrome 中放大合成图像的结果：

在此处输入图像描述

A.svg（单独的效果不存在）

编辑：这是我用来测试的确切图像：

.svg

<?xml version="1.0" encoding="UTF-8"?>
    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="129pt" height="141pt" viewBox="0 0 129 141" version="1.2">
      <defs>
        <g>
          <symbol overflow="visible" id="glyph0-0">
    	<path style="stroke:none;" d="M 133.296875 0 L 133.296875 -5.1875 C 122.734375 -5.1875 119.15625 -5.1875 116.5625 -12.546875 L 72.328125 -137.6875 C 71.328125 -140.265625 70.9375 -140.875 68.9375 -140.875 C 66.953125 -140.875 66.546875 -140.265625 65.546875 -137.6875 L 23.3125 -18.125 C 19.53125 -7.375 11.5625 -5.1875 4.578125 -5.1875 L 4.578125 0 C 8.171875 -0.40625 16.140625 -0.40625 19.921875 -0.40625 C 24.90625 -0.40625 32.875 -0.40625 37.65625 0 L 37.65625 -5.1875 C 28.296875 -5.578125 26.90625 -11.953125 26.90625 -14.34375 C 26.90625 -16.140625 27.296875 -17.140625 27.703125 -18.328125 L 38.25 -48.015625 L 90.453125 -48.015625 L 102.421875 -14.140625 C 103.40625 -11.75 103.40625 -11.359375 103.40625 -10.5625 C 103.40625 -5.1875 94.84375 -5.1875 91.0625 -5.1875 L 91.0625 0 C 96.828125 -0.40625 107.203125 -0.40625 113.375 -0.40625 C 118.546875 -0.40625 128.515625 -0.40625 133.296875 0 Z M 88.671875 -53.203125 L 40.046875 -53.203125 L 64.359375 -121.734375 Z M 88.671875 -53.203125 "/>
          </symbol>
        </g>
      </defs>
      <g id="surface1">
        <g style="fill:rgb(0%,0%,0%);fill-opacity:1;">
          <use xlink:href="#glyph0-0" x="-4.59" y="140.87"/>
        </g>
      </g>
    </svg>

B.svg

  <?xml version="1.0" encoding="UTF-8"?>
    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="111pt" height="137pt" viewBox="0 0 111 137" version="1.2">
      <defs>
        <g>
          <symbol overflow="visible" id="glyph0-0">
    	<path style="stroke:none;" d="M 120.9375 -36.265625 C 120.9375 -54.203125 104.609375 -69.53125 83.28125 -70.9375 C 102.421875 -74.71875 115.765625 -87.46875 115.765625 -102.609375 C 115.765625 -119.15625 99.421875 -136.09375 73.71875 -136.09375 L 10.359375 -136.09375 L 10.359375 -130.90625 C 24.109375 -130.90625 26.296875 -130.90625 26.296875 -121.9375 L 26.296875 -14.140625 C 26.296875 -5.1875 24.109375 -5.1875 10.359375 -5.1875 L 10.359375 0 L 78.90625 0 C 104.40625 0 120.9375 -18.125 120.9375 -36.265625 Z M 101.21875 -102.609375 C 101.21875 -87.46875 89.0625 -72.328125 67.546875 -72.328125 L 38.859375 -72.328125 L 38.859375 -123.140625 C 38.859375 -129.90625 39.25 -130.90625 47.21875 -130.90625 L 72.71875 -130.90625 C 92.453125 -130.90625 101.21875 -114.96875 101.21875 -102.609375 Z M 106.203125 -36.46875 C 106.203125 -21.921875 94.84375 -5.1875 73.125 -5.1875 L 47.21875 -5.1875 C 39.25 -5.1875 38.859375 -6.171875 38.859375 -12.953125 L 38.859375 -69.140625 L 75.71875 -69.140625 C 96.234375 -69.140625 106.203125 -51.015625 106.203125 -36.46875 Z M 106.203125 -36.46875 "/>
          </symbol>
        </g>
      </defs>
      <g id="surface1">
        <g style="fill:rgb(0%,0%,0%);fill-opacity:1;">
          <use xlink:href="#glyph0-0" x="-10.361" y="136.082"/>
        </g>
      </g>
    </svg>

4

0 回答 0