如何在SVG模式中正确填充(或平铺)图像

时间:2017-06-20 21:35:50

标签: svg snap.svg svg-filters svg.js svg-path

我有一个svg,我正在创建一个带有转换的图层。 我正在尝试创建一个基于图像的图案来填充它作为背景,但背景很奇怪:

有人可以帮我看看这个svg发生了什么,我怎样才能让背景“正确拼贴并填满我想要填充的所有路径”?

Here is how it looks bad, the image should be filled with this "park background"

背景图像在614上是1000,所以它非常大。

这是我的svg:

  <div id="map_22" class="citysvg" style="background-color:gray;">
  <svg xmlns:dc="http://purl.org/dc/elements/1.1/"
       xmlns:cc="http://creativecommons.org/ns#"
       xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
       xmlns:svg="http://www.w3.org/2000/svg"
       xmlns="http://www.w3.org/2000/svg"
       version="1.1"
       viewBox="0 0 500 500" id="svg22">
    <defs>
      <pattern id="grass" patternUnits="objectBoundingBox" width="1" height="1">
        <image xlink:href="park.jpg" x="0" y="0" width="100" height="100" />
      </pattern>
    </defs>
    <metadata id="metadata7">
      <rdf:rdf>
        <cc:work rdf:about="">
          <dc:format>image/svg+xml</dc:format>
          <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"></dc:type>
          <dc:title></dc:title>
        </cc:work>
      </rdf:rdf>
    </metadata>
    <g transform="translate(0,-592.36218)" id="layer1">
  <path d="m319.4 1045.24c-0.56-0.22-3.46-2.24-6.44-4.49-6.78-5.1-6.83-5.33-2.06-8.55 2.66-1.79 3.75-2.27 5.19-2.27 1.39 0 1.97 0.24 2.46 1.01 0.77 1.22 4.8 12.99 4.8 14.02 0 0.82-2.19 0.97-3.95 0.27z" id="352" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5183">
      в.з.Бункера
    </title>
  </path>
  <path d="m278.11 1040.61c-1.65-1.54-4.37-4.83-6.05-7.3-1.68-2.48-3.21-4.68-3.4-4.89-0.44-0.5-2.12 0.39-3.88 2.05-1.65 1.56-2.43 1.31-4.25-1.33l-1.08-1.58-3.12 0.29c-2.01 0.19-3.57 0.61-4.38 1.18-1.86 1.32-2.41 1.16-2.04-0.57 0.69-3.25 0.78-5.88 0.23-6.89-0.76-1.42 0.16-7.6 1.62-10.9 1.03-2.33 1.15-2.44 2.42-2.16 1.45 0.32 3.65-0.77 3.65-1.79 0-0.31-0.74-2.57-1.65-5.02-1.45-3.91-2-4.8-4.52-7.38-2.15-2.21-2.87-3.26-2.87-4.22 0-0.75-0.58-2.01-1.42-3.06-1.07-1.35-1.29-1.91-0.89-2.31 0.4-0.4 0.74-0.39 1.43 0.04 1.21 0.75 1.92 0.29 1.31-0.84-0.62-1.16 0.16-2.66 1.25-2.4 0.46 0.11 1.54-0.44 2.55-1.3 1.57-1.34 1.7-1.6 1.22-2.49-0.29-0.55-0.41-1.2-0.26-1.44 0.41-0.66 8.03-0.55 8.96 0.13 0.72 0.53 0.66 0.8-0.8 3.72-1.34 2.68-1.53 3.42-1.25 4.95 0.29 1.63 0.58 1.94 3.03 3.25 2.2 1.18 3.23 1.45 5.49 1.46 2.67 0.01 2.83-0.06 4.11-1.64l1.33-1.66 1.96 1.83 1.96 1.83-0.85 1.29c-1.06 1.63-9.01 10.61-11.48 12.99-1.69 1.62-1.86 1.98-1.86 4.06 0 2.05 0.15 2.39 1.56 3.51 0.86 0.68 1.92 1.24 2.37 1.24 1.11 0 3.44 1.59 3.78 2.57 0.21 0.61 0.68 0.76 1.93 0.66 1.25-0.11 1.65 0.03 1.65 0.56 0 0.46-0.85 0.95-2.48 1.42-2.34 0.68-2.48 0.8-2.48 2.16 0 0.79-0.19 2.1-0.42 2.91-0.28 0.96-0.26 1.94 0.04 2.81 0.41 1.18 0.68 1.34 2.28 1.34 1.76 0 1.8 0.04 1.47 1.24-0.67 2.47-0.25 3.74 2.17 6.53 1.3 1.5 3.75 3.61 5.45 4.7 2.57 1.65 3 2.09 2.54 2.64-1.2 1.45-3.22 0.76-6.36-2.18z" id="441" fill="#DAC1A7" cursor="pointer">
    <title id="title6240">
      Area 1
    </title>
  </path>
  <path d="m301.64 1036.65c-0.64-1.2-1.21-0.6 11.37-12 5.68-5.15 10.33-9.51 10.33-9.68 0-0.18-0.86-1.13-1.92-2.13-2.27-2.14-3.52-2.29-6.57-0.76-1.47 0.74-3.18 1.13-5.54 1.28-2.75 0.17-3.96 0.5-6.25 1.72-2.35 1.25-2.91 1.4-3.25 0.86-1.17-1.8-0.94-2.54 2.27-7.07 3.83-5.42 4.1-6.82 1.61-8.28-1.84-1.08-1.89-1.4-0.68-4.22 0.5-1.16 0.9-2.61 0.9-3.24l0-1.14 3.5 0.27c1.93 0.15 13.06 0.7 24.73 1.22 18.56 0.83 22.73 1.19 21.88 1.91-0.11 0.09-1.64 1-3.4 2.01-3.72 2.15-3.79 2.21-5.12 5.58-0.86 2.16-1.92 3.42-6.68 8-4.58 4.4-5.92 5.43-6.97 5.43-0.82 0-3.85 1.45-8.06 3.86-5.62 3.21-7.17 4.34-9.27 6.72-1.38 1.57-3.83 3.71-5.43 4.75-2.61 1.7-2.92 2.05-2.92 3.38 0 1.25-0.22 1.56-1.42 1.97-2.01 0.7-2.54 0.62-3.12-0.44zM386.32 1035.45" id="847" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5179">
      Area 2
    </title>
  </path>
  <path d="m386.32 1035.45c-0.43-2.3-1.89-4.17-3.25-4.17-0.6 0-1.81 0.62-2.67 1.38-1.48 1.3-1.62 1.34-2.41 0.63-0.81-0.73-0.8-0.82 0.1-3.07 2.44-6.11 2.76-7.11 2.37-7.49-0.23-0.22-1.39-0.67-2.59-0.98l-2.18-0.58-2.02 2.13c-2.16 2.28-2.29 2.34-3.32 1.69-0.55-0.35-0.23-0.88 1.79-2.92l2.47-2.49-2.58-2.29c-2.5-2.22-3.24-3.57-1.95-3.57 0.35 0 0.75-0.31 0.9-0.7 0.21-0.55 0.46-0.59 1.18-0.21 0.63 0.34 1.18 0.34 1.78 0.02 0.59-0.31 2.22-0.33 5-0.04 2.53 0.26 4.55 0.27 5.23 0.01 1.46-0.55 3.39-0.12 4.91 1.08l1.24 0.98-2.08 4.69-2.08 4.69 0.48 3.51c0.27 1.93 0.88 4.66 1.37 6.07 1.12 3.24 1.11 3.32-0.23 3.32-0.92 0-1.16-0.28-1.43-1.69z" id="854" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5185">
      Area 4
    </title>
  </path>
  <path d="m319.81 1029.7c-0.4-0.88-0.85-1.13-2.03-1.13-2.05 0-2.24-0.32-1.1-1.86 0.89-1.21 13.99-8.95 15.14-8.95 0.26 0 1.01 0.9 1.65 2.01 0.65 1.1 1.62 2.32 2.17 2.7l0.99 0.69-1.39 1.47c-0.77 0.81-1.63 1.93-1.92 2.48-0.43 0.84-0.9 1.01-2.7 1.01-1.2 0-2.8-0.22-3.57-0.49-1.28-0.45-1.6-0.33-3.84 1.35-1.34 1.01-2.54 1.84-2.66 1.84-0.12 0-0.46-0.51-0.74-1.13z" id="848" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5181">
      Area 5
    </title>
  </path>
  <path d="m230.71 1020.28c-0.89-1.67-0.96-2.1-0.46-2.7 0.69-0.83 2.83-0.94 4.17-0.23 1.11 0.59 0.83 2.34-0.63 3.91-1.35 1.44-1.88 1.28-3.08-0.97z" id="850" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5175">
      Area 6
    </title>
  </path>
  <path d="m245.19 1017.7c-0.98-0.4-6.24-1.25-12.59-2.04-1.2-0.15-2.39-0.02-3.05 0.33-0.95 0.5-1.17 0.47-1.74-0.29-0.36-0.48-0.68-1.58-0.7-2.44-0.05-2.15-1.54-3.23-6.56-4.72-5.96-1.78-7.12-2.22-7.31-2.77-0.39-1.16 4.56-5.62 9.51-8.56 7.02-4.17 9.73-6.04 9.96-6.88 0.11-0.4 0.31-1.43 0.46-2.3 0.18-1.05 2.77-5.13 7.73-12.17 4.1-5.82 7.66-10.66 7.91-10.74 0.25-0.08 1.39 0.4 2.54 1.07l2.08 1.22-0.31 2.98c-0.17 1.66-0.62 3.32-1 3.75-0.6 0.66-0.61 1-0.1 2.4 0.77 2.13 0.16 3.16-1.9 3.19-1.33 0.02-1.61 0.25-2.34 1.91-0.45 1.04-1.02 1.89-1.25 1.89-0.23 0-0.72 0.58-1.09 1.28-0.63 1.22-0.6 1.36 0.65 2.82 0.79 0.92 1.32 2.06 1.33 2.87 0.01 1.02 0.69 2.03 2.89 4.28 2.43 2.49 3.09 3.53 4.29 6.79 1.81 4.9 1.83 5.59 0.18 5.2-0.68-0.16-1.54-0.34-1.9-0.39-1.09-0.16-3.55 5.65-4.3 10.15-0.3 1.83-1.1 2.11-3.4 1.18z" id="851" fill="#ADD6A8" cursor="pointer">
    <title id="title5173">
      Area 7
    </title>
  </path>
  <path d="m208.49 1003.05-2.59-2.01 1.01-1.36c0.97-1.31 1.11-1.35 3.5-1.08 2.86 0.33 4.97 1.05 4.97 1.71 0 0.48-2.97 3.96-3.81 4.46-0.27 0.16-1.65-0.61-3.08-1.71zM200.91 1002" id="849" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5171">
      Area 8
    </title>
  </path>
  <path d="m200.91 1002c-0.87-0.47-1.93-0.96-2.36-1.09-0.51-0.15-0.68-0.49-0.5-0.97 0.21-0.55 0.66-0.68 1.76-0.5 1.04 0.17 1.67 0.02 2.15-0.52 0.75-0.85 2.04-5.34 2.23-7.74 0.11-1.46 0.22-1.57 1.47-1.46 3.41 0.3 4.51 1.46 5.03 5.25l0.28 2.06-2.02 0c-1.93 0-2.1 0.11-3.9 2.53-1.04 1.39-1.88 2.71-1.88 2.93 0 0.57-0.48 0.46-2.26-0.51z" id="857" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5169">
      Area 10
    </title>
  </path>
  <path d="m214.39 998.11c-1.48-0.61-1.72-0.95-2.16-2.97-0.65-3.04-2.14-5.59-3.59-6.16-0.65-0.25-2.13-0.59-3.29-0.75-1.92-0.27-2.18-0.45-2.79-1.98-0.41-1.02-2.11-3.02-4.28-5.02-3.24-3-3.63-3.54-3.88-5.38-0.26-1.88-0.15-2.19 1.33-3.92 0.89-1.03 2.04-2.85 2.57-4.04 0.53-1.19 1.46-2.96 2.07-3.93 0.61-0.97 1.55-3.1 2.1-4.73 0.91-2.74 0.95-3.33 0.51-7.56-0.26-2.52-0.63-4.74-0.82-4.93-0.19-0.19-1.13 0.42-2.08 1.35l-1.73 1.69-2.89-1.37c-1.59-0.76-3.75-1.59-4.81-1.85-1.06-0.26-1.92-0.7-1.92-0.99 0-0.28 1.47-2.8 3.28-5.6 2.39-3.72 3.48-5.05 4.05-4.93 0.8 0.17 47.98 26.78 50.14 28.28l1.22 0.84-7.44 10.58c-7.55 10.73-8.32 12.02-8.32 13.96 0 0.78-0.65 1.56-2.37 2.82-3.2 2.34-11.76 7.31-12.57 7.28-0.36-0.01-1.4-0.33-2.31-0.71z" id="368" fill="#DAC1A7" cursor="pointer">
    <title id="title5093">
      Area 11
    </title>
  </path>
  <path d="m396.08 998.37c-1.86-0.19-5.01-0.87-7-1.53-1.99-0.66-5.22-1.48-7.18-1.84-1.96-0.35-3.66-0.74-3.78-0.86-0.12-0.12 0.24-2.06 0.8-4.31l1.01-4.09-1.27-4.78c-1.25-4.69-1.33-4.84-4.81-8.84-2.13-2.45-3.46-4.35-3.34-4.78 0.11-0.39 0.33-1.37 0.49-2.18 0.36-1.77 1.02-1.83 6.32-0.58 3.96 0.94 4.48 0.79 4.91-1.34 0.26-1.29 0.36-1.34 2.76-1.34 1.37 0 3.4 0.24 4.52 0.54 1.86 0.5 2.15 0.46 3.38-0.45 0.74-0.55 1.45-0.99 1.58-0.99 0.13 0 1.09 0.92 2.13 2.05 1.04 1.13 2.11 1.99 2.38 1.91 1.29-0.35 6.57-3.8 6.58-4.31 0.03-2.02-5.78-11.12-10.57-16.55-3.9-4.43-2.14-3.92 7.9 2.29 5.07 3.14 10.34 6.66 11.71 7.83 2.98 2.55 4.08 3.17 5.62 3.17 1.48 0 1.47 0.75-0.03 2.31-1.64 1.7-1.96 3.71-2.38 14.59l-0.37 9.46-1.94 3.83c-1.64 3.23-1.93 4.2-1.85 6.2l0.09 2.37-3.33 0c-3.11 0-3.41 0.09-4.63 1.35-1.44 1.49-2.54 1.59-9.71 0.88z" id="364" fill="#DAC1A7" fill="#DAC1A7">
    <title id="title5143">
      area 12
    </title>
  </path>
  <path d="m365.36 993.37c-2.61-0.21-5-0.48-5.31-0.6-0.31-0.12-0.56-0.8-0.56-1.52 0-2.19-5.72-13.49-8.2-16.22-1.28-1.4-2.19-2.83-2.19-3.43 0-0.9 0.29-1.07 2.21-1.32l2.21-0.29 0.31-2.03c0.27-1.81 0.49-2.11 1.97-2.7 1.1-0.44 1.97-1.23 2.57-2.35 0.62-1.16 1.26-1.73 2.04-1.82 1.67-0.19 3.76-4.01 3.36-6.14-0.22-1.19-0.6-1.66-1.6-2.01-1.33-0.46-1.68-1.12-0.86-1.63 0.79-0.49 0.5-7.62-0.47-11.79-0.96-4.1-0.85-6.46 0.31-6.46 0.87 0 10.68 2.76 11.11 3.13 0.18 0.16-0.06 2.71-0.54 5.67-1.11 6.85-1.98 14.93-1.69 15.7 0.15 0.4 2.04 0.77 5.8 1.15 3.07 0.31 5.63 0.61 5.7 0.68 0.19 0.19-0.68 3.88-0.98 4.18-0.14 0.14-2.44-0.18-5.1-0.71-2.66-0.53-4.98-0.82-5.15-0.63-0.17 0.19-0.53 1.63-0.8 3.22l-0.49 2.88 3.56 4.08c3.48 3.99 3.58 4.18 4.79 8.71l1.23 4.63-1.01 4.07-1.01 4.07-3.22-0.06c-1.77-0.03-5.36-0.24-7.97-0.45z" id="path3352" 
  fill="url(#grass)">
    <title id="title5213">
      area 883
    </title>
  </path>
  <path d="m336.67 992.23c-7.45-0.35-13.81-0.72-14.12-0.82-0.31-0.11-0.56-0.9-0.56-1.77 0-2.33 6.34-10.96 8.58-11.69l1.58-0.51 0-6.02 0-6.02-1.69-1.46c-0.93-0.8-1.69-1.59-1.69-1.75 0-0.16 2.97-0.29 6.59-0.29l6.59 0-0.15-2.59-0.15-2.59 3.53-0.13c2.94-0.11 4.33 0.11 8.24 1.31 2.84 0.87 4.71 1.68 4.71 2.03 0 1.72-1.56 3.73-3.45 4.45-1.68 0.64-1.97 0.93-1.97 2.03 0 2.34-0.37 2.7-2.76 2.7l-2.21 0 0 2.16c0 2 0.17 2.32 2.3 4.39 1.82 1.76 2.92 3.51 5.2 8.27 1.78 3.71 2.89 6.62 2.89 7.55l0 1.51-3.95-0.06c-2.17-0.04-10.05-0.35-17.51-0.7z" id="413" fill="#DAC1A7" fill="#DAC1A7">
    <title id="title5139">
      area 009343
    </title>
  </path>
  <path d="m315.78 991.31c-2.16-0.16-2.37-0.27-2.37-1.26 0-1.28 1.16-2.02 2.98-1.89 1.17 0.08 1.37-0.11 1.99-1.99 0.38-1.14 1.45-3 2.38-4.13 0.93-1.13 1.69-2.23 1.69-2.45 0-0.22-0.8-1.18-1.79-2.14-1.71-1.67-1.94-1.75-5.31-1.94l-3.52-0.2-4.39 4.12c-3.63 3.41-4.44 4.41-4.66 5.79-0.66 4.08-0.35 3.8-3.73 3.46-3.73-0.37-5.92-0.93-7.07-1.8-0.84-0.64-0.72-0.89 3.16-6.6 4.16-6.1 5.55-8.78 5.6-10.74 0.01-0.62-1.11-6.9-2.49-13.97l-2.52-12.84 2.26-2.03c2.12-1.91 2.29-2.22 2.77-5.18 0.45-2.81 0.73-3.39 2.54-5.29 1.12-1.18 2.23-2.14 2.47-2.14 0.24 0 2.64 0.71 5.33 1.58 4.29 1.38 6.33 1.85 6.41 1.46 0.01-0.06 0.37-2.04 0.79-4.39l0.77-4.28 1.81 0 1.81 0 0.13 2.82c0.12 2.5-0.08 3.29-1.76 6.98-1.7 3.74-1.9 4.56-2.01 8.11-0.1 3.4-0.27 4.16-1.22 5.41-0.76 1-1.21 2.33-1.42 4.27-0.31 2.78-0.3 2.82 0.8 2.82 1.66 0 2.54 0.45 2.54 1.31 0 0.42 0.79 1.53 1.76 2.48 1.71 1.66 1.82 1.7 3.41 1.18 2.5-0.82 2.83-0.5 2.61 2.54-0.19 2.63-0.18 2.64 1.66 4.12l1.85 1.49 0 5.15 0 5.15-1.51 0.63c-2.3 0.96-8.53 9.72-8.86 12.45-0.27 2.26-0.28 2.27-4.87 1.93z" id="path3348" fill="#2b8028">
    <title id="title5211">
      area 18    </title>
  </path>
  <path d="m198.66 990.09c-1.38-0.5-1.58-0.76-1.58-2.1 0-1.26-0.29-1.71-1.69-2.62-1.81-1.18-2.13-2.25-0.98-3.39 1.05-1.04 1.55-0.89 3.97 1.17 2.13 1.82 3.9 4.87 3.9 6.72 0 1.02-1.21 1.09-3.61 0.22zM303.76 990.38" id="845" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5167">
      area 14
    </title>
  </path>
  <path d="m303.76 990.38c-0.12-0.19-0.06-1.65 0.13-3.25l0.34-2.9 4.02-3.76 4.02-3.76 3.07 0.19c2.42 0.15 3.31 0.41 4.18 1.23 0.61 0.57 1.11 1.26 1.1 1.52 0 0.27-0.7 1.36-1.55 2.42-0.85 1.07-1.68 2.54-1.84 3.27-0.23 1.04-0.54 1.33-1.43 1.33-1.67 0-3.76 1.65-3.76 2.96 0 1.08-0.06 1.1-4.04 1.1-2.22 0-4.14-0.16-4.25-0.35z" id="841" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5177">
      area 225
    </title>
  </path>
  <path d="m179.26 985.13c-1.03-1.1-0.95-2.06 0.17-2.06 0.67 0 1.15-0.96 1.15-2.3 0-0.48 0.25-1.29 0.56-1.79 0.49-0.81 0.41-1.06-0.7-2.02-0.84-0.73-1.38-1.74-1.59-3.01-0.3-1.74-0.46-1.93-1.76-2.06-1.98-0.19-3.12 0.53-3.73 2.37-0.28 0.86-0.91 1.68-1.39 1.84-0.48 0.15-0.88 0.57-0.88 0.92 0 1.32-1.36 0.58-2.5-1.37-1.23-2.09-1.17-2.94 0.19-2.94 0.86 0 2.76-1.77 2.76-2.58 0-0.27-0.36-1.12-0.79-1.87-0.74-1.29-0.75-1.45-0.03-2.63 0.65-1.07 1.17-1.3 3.61-1.61 1.57-0.2 2.97-0.5 3.12-0.68 0.15-0.17 0.5-1.62 0.78-3.21 0.41-2.3 0.83-3.23 2.06-4.51 1.27-1.33 1.51-1.86 1.32-3.04l-0.23-1.43 2.78-0.55c2.35-0.46 2.88-0.75 3.46-1.86 0.6-1.16 0.86-1.29 2.13-1.05 0.79 0.15 3.02 1.02 4.95 1.93 3.5 1.65 3.51 1.65 4.89 0.84 0.76-0.45 1.49-0.7 1.63-0.56 0.14 0.14 0.35 1.64 0.48 3.34 0.24 3.36-0.68 7.5-2.13 9.55-0.44 0.63-1.46 2.45-2.27 4.07-0.81 1.61-2.18 3.81-3.06 4.89l-1.6 1.96 0.69 3.22c0.66 3.05 0.65 3.27-0.16 4.3-0.47 0.59-0.85 1.38-0.85 1.75 0 1.1-3.48 0.29-5.45-1.27-1.7-1.34-1.71-1.34-3.32-0.58-1.36 0.65-1.62 1-1.62 2.23 0 3.03-0.93 3.65-2.68 1.79zM272.62 976.13" id="383" fill="#ADD6A8" cursor="pointer">
    <title id="title5165">
      area 53
    </title>
  </path>
  <path d="m272.62 976.13c-9.14-5.02-16.83-9.34-17.08-9.59-0.31-0.31-0.13-4.44 0.56-12.72 1.12-13.56 0.95-13.03 4.3-13.23 1.52-0.09 1.69 0.02 2.05 1.36 0.38 1.43 0.45 1.47 2.98 1.5 6.26 0.09 7.21 0.41 13.82 4.6 3.41 2.16 6.5 3.93 6.86 3.93 1.06 0 3.04-4.83 3.33-8.11l0.26-2.93 1.93-0.4c1.06-0.22 2.04-0.3 2.17-0.17 0.13 0.13 1.48 6.67 3.01 14.54 2.49 12.86 2.72 14.5 2.25 16.24-0.55 2.05-8.57 14.18-9.35 14.13-0.25-0.02-7.93-4.14-17.07-9.16z" id="406" fill="#DAC1A7" cursor="pointer">
    <title id="title5099">
      area 051
    </title>
  </path>
  <path d="m272.34 306.5-3.75 1.06c-2.06 0.58-6.16 1.76-9.09 2.66-7.52 2.3-9.29 2.44-13.25 1-2.73-0.99-3.97-1.16-8.16-1.16l-4.94 0L231.25 318c-1.6 6.64-1.95 8.96-2.16 14.09-0.23 5.82-0.34 6.35-2.06 10.72-1.86 4.71-4.13 12.76-3.72 13.19 0.12 0.13 6.78 4.03 14.78 8.66 8 4.62 14.7 8.41 14.88 8.44 0.71 0.1 0.93-1.4 1.81-12.69 0.51-6.5 1.1-12.04 1.31-12.31 0.21-0.27 1.51-0.76 2.88-1.06 1.37-0.31 2.5-0.74 2.5-1 0-0.26-0.33-1.68-0.72-3.16l-0.69-2.72 1.31-2.31c1.16-2.07 1.32-2.89 1.56-7.5 0.25-4.83 0.39-5.47 2.06-9.03 1.57-3.33 2.22-4.16 5-6.47 2.93-2.43 3.19-2.8 3.19-4.37 0-0.94-0.17-2.22-0.41-2.84l-0.44-1.12zm-22 42.13c0.39 0.01 0.71 0.03 1.03 0.16 0.32 0.13 0.59 0.41 0.72 0.69 0.13 0.28 0.19 0.53 0.25 0.84 0.32 1.55 0.43 3.07 0.34 4.38-0.08 1.31-0.33 2.4-0.91 3.19-0.27 0.36-0.53 0.68-0.81 0.94-0.14 0.13-0.29 0.25-0.44 0.34-0.15 0.09-0.32 0.19-0.62 0.19-0.28-0.01-0.45-0.1-0.69-0.19-0.23-0.09-0.47-0.2-0.75-0.34-0.55-0.28-1.2-0.65-1.81-1.03-0.61-0.38-1.18-0.77-1.62-1.12-0.22-0.18-0.44-0.34-0.59-0.5-0.08-0.08-0.15-0.18-0.22-0.28-0.07-0.1-0.16-0.23-0.16-0.5 0-0.21 0.05-0.32 0.09-0.53 0.04-0.21 0.11-0.48 0.19-0.78 0.15-0.6 0.34-1.34 0.56-2.09l0.81-2.69 0.16-0.47 0.47 0 2.53-0.16c0.61-0.03 1.08-0.04 1.47-0.03z" transform="translate(0,592.36218)" id="354" fill="#DAC1A7" cursor="pointer">
    <title id="title3391">
      area 888
    </title>
  </path>
  <path d="m248.94 942.36-2.09 0.13-0.66 2.25c-0.22 0.73-0.42 1.46-0.56 2.03-0.07 0.29-0.12 0.53-0.16 0.72-0.02 0.08-0.02 0.07-0.03 0.13 0.09 0.09 0.23 0.2 0.41 0.34 0.39 0.31 0.95 0.7 1.53 1.06 0.58 0.37 1.19 0.72 1.69 0.97 0.25 0.13 0.49 0.22 0.66 0.28 0.12 0.05 0.13 0.05 0.16 0.06 0.05-0.03 0.11-0.08 0.19-0.16 0.19-0.17 0.44-0.43 0.66-0.72 0.3-0.41 0.55-1.34 0.63-2.5 0.07-1.16-0.02-2.56-0.31-4-0.06-0.3-0.13-0.5-0.16-0.56-0.08-0.03-0.72-0.1-1.94-0.03z" id="834" fill="#DAC1A7" fill="#DAC1A7">
    <title id="title3393">
      area 8883
    </title>
  </path>
  <path d="m166.38 964.45c-0.92-0.67-0.89-0.76 1.49-4.01 1.21-1.65 2.19-2.36 4.81-3.5 2.6-1.13 3.6-1.85 4.72-3.42 1.6-2.22 2.08-2.42 2.52-1.04 0.22 0.7-0.08 1.34-1.17 2.46-1.14 1.17-1.59 2.16-1.99 4.35l-0.51 2.83-2.56 0.13c-2.25 0.12-2.68 0.3-3.51 1.46-1.03 1.45-2.45 1.72-3.8 0.73zM157.51 960.66" id="843" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5163">
      area 32
    </title>
  </path>
  <path d="m157.51 960.66c-3.91-4.18-6.99-6.42-8.83-6.42-0.81 0-1.62-0.24-1.8-0.53-0.54-0.86-0.65-8.07-0.16-9.81 0.25-0.88 0.93-2.18 1.52-2.88l1.06-1.29 2.65 0.78c2.14 0.62 3.59 0.72 7.45 0.48 5.73-0.35 9.82 0.47 13.13 2.64 1.65 1.08 2.43 2.05 3.59 4.42l1.47 3.03-1.35 1.66c-0.88 1.09-2.35 2.09-4.24 2.89-2.28 0.97-3.33 1.76-4.94 3.75-1.93 2.38-4.66 4.32-6.06 4.32-0.35 0-1.91-1.37-3.47-3.04z" id="855" fill="#ADD6A8" fill="#ADD6A8">
    <title id="title5161">
      area 99
    </title>
  </path>
  <path d="m396.74 961.22c-0.92-1.12-1.93-2.03-2.25-2.03-0.32 0-1.21 0.52-1.96 1.15-1.24 1.04-1.54 1.11-3.08 0.68-0.94-0.26-2.76-0.48-4.05-0.48-2.22 0-2.35-0.07-2.48-1.24-0.16-1.35 0.05-1.3-8.64-2.14l-3.07-0.3 0.28-3.23c0.44-5.16 2.08-15.81 2.49-16.24 0.22-0.23 2.58 0.48 5.49 1.64 4.87 1.94 5.22 2.01 7.4 1.56l2.29-0.47 2.04 2.21c4.53 4.91 5.78 6.42 8.17 9.87 2.98 4.29 4.56 7.31 4.26 8.09-0.22 0.56-4.13 2.94-4.84 2.94-0.2 0-1.11-0.91-2.03-2.03z" id="860" fill="#EDDFD0" fill="#EDDFD0">
    <title id="title5141">
      area 8832
    </title>
  </path>
  <path d="m330.42 960.21-1.74-0.18 0.32-2.11c0.38-2.5 12.75-30.27 13.5-30.28 0.28 0 4.14 1.06 8.57 2.37l8.06 2.37-0.27 1.7c-0.17 1.07 0.07 3.02 0.64 5.26 1.11 4.34 1.22 10.29 0.23 12.2-0.68 1.31-0.68 1.32 1.13 2.24 2.04 1.04 2.34 2.23 1 3.96l-0.8 1.03-5.95-1.82c-5.29-1.62-6.46-1.82-10.55-1.82l-4.6 0 0.31 2.7 0.31 2.7-4.2-0.08c-2.31-0.04-4.98-0.16-5.94-0.26zM322.07 955.45" id="412" fill="#DAC1A7" fill="#DAC1A7">
    <title id="title5137">
      area 993
    </title>
  </path>
  <path d="m322.07 955.45c-0.54-0.57-0.98-1.58-0.98-2.23 0-1.04-0.2-1.2-1.69-1.32-1.68-0.14-1.69-0.16-1.61-2.02 0.05-1.17 0.53-2.56 1.29-3.7 1.04-1.57 1.22-2.36 1.33-5.78 0.11-3.48 0.33-4.4 1.8-7.57 1.27-2.72 1.74-4.41 1.93-6.87 0.29-3.75 0.11-3.66 4.95-2.58 5.21 1.16 11.07 3.06 11.29 3.65 0.12 0.31-2.6 6.86-6.03 14.56-6.17 13.82-6.27 14.01-7.83 14.44-2.41 0.68-3.36 0.55-4.44-0.59z" id="411" fill="#DAC1A7" fill="#DAC1A7">
    <title id="title5135">
      area 9923403
    </title>
  </path>



  </g>
  </svg>

1 个答案:

答案 0 :(得分:3)

只需将其添加到您的图片元素

即可
preserveAspectRatio="xMinYMin slice"

如果你指定模式必须是宽度/高度的100% - 你使用patternUnits =&#34; objectBoundingBox&#34;和x =&#34; 1&#34; Y =&#34; 1&#34;然后它会使图像居中并适应更大的宽度/长度。因为您的图像宽而短,所以它适合宽度并使图案的顶部和底部空白。您可以通过指定&#34; slice&#34;来覆盖默认行为。 - 适合较小的宽度/高度并覆盖整个空间,裁剪较长尺寸的边缘,而不改变纵横比。