Question

我正在使用Leafletjs从geoJSON文件生成地图。我想用一种模式填充一些区域。我找到了一个插件（Leaflet.pattern）并稍微调整一下以添加对位图图像的支持。它似乎工作正常，SVG <defs>部分似乎没问题

<pattern id="25" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse" patternContentUnits="userSpaceOnUse">
    <image stroke="none" fill="none" pointer-events="none" xlink:href="http://lorempixel.com/20/20/" x="0" y="0" width="20" height="20"></image>
</pattern>

<g>位如下所示：

<g>
    <path 
      stroke-linejoin="round" 
      stroke-linecap="round" 
      fill-rule="evenodd" 
      stroke="#000" 
      stroke-opacity="1" 
      stroke-width="0.5" 
      fill="url(#25)" 
      fill-opacity="0.9" 
      class="leaflet-clickable" 
      d="M-23 200L-27 200L-27 191L-29 188L-29 184L-24 179L-19 177L-1 187L1 180L5 194L19 194L19 201L17 204L13 205L7 202L5 205L-8 199L-10 202L-17 198z">
    </path>
</g>

问题在于模式不存在。

但是当我复制生成的SVG并自行打开时，模式就在那里。

我在俯瞰什么？

位图图像作为Leaflet.js图的模式

0 个答案: