我有一个用Leaflet构建的chloropleth地图,由于插件leaflet-polygon.fillPattern.js显示填充了阴影的多边形,并且它工作正常。
function myStyle (feature) {
return {
fill: 'url(assets/img/image.png)',
fillColor: '#6677cd',
weight: 7,
opacity: 1,
fillOpacity: 1
}
}
var layer = new L.geoJson(data,{
style:myStyle
});
我可以使用Geoserver打印和leaflet.print插件打印我的地图,但问题是我打印的地图只显示我的多边形填充颜色而不是我的图案。
我查看了Json我发送给Geoserver打印的规格,它显示填写功能的选项设置得很好:
fill:"url(assets/img/image.png)"
我尝试了png和svg图像,但都没有显示。
我知道为什么我的打印地图没有在我的多边形中渲染阴影?
当我尝试在Geoserver
中发送多边形的样式时,这是SLD代码<?xml version="1.0" encoding="UTF-8"?>
<StyledLayerDescriptor xmlns="http://www.opengis.net/sld"
xmlns:ogc="http://www.opengis.net/ogc"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="1.1.0"
xmlns:xlink="http://www.w3.org/1999/xlink"
xsi:schemaLocation="http://www.opengis.net/sld
http://schemas.opengis.net/sld/1.1.0/StyledLayerDescriptor.xsd"
xmlns:se="http://www.opengis.net/se">
<NamedLayer>
<se:Name>PSC_Surf</se:Name>
<UserStyle>
<se:Name>PSC_Surf</se:Name>
<se:FeatureTypeStyle>
<se:Rule>
<se:Name>Single symbol</se:Name>
<se:PolygonSymbolizer>
<se:Fill>
<se:SvgParameter name="fill">#ffff00</se:SvgParameter>
</se:Fill>
<se:Stroke>
<se:SvgParameter name="stroke">#000001</se:SvgParameter>
<se:SvgParameter name="stroke-width">1</se:SvgParameter>
<se:SvgParameter name="stroke-linejoin">bevel
</se:SvgParameter>
</se:Stroke>
</se:PolygonSymbolizer>
<se:PolygonSymbolizer>
<se:Fill>
<se:GraphicFill>
<se:Graphic>
<se:Mark>
<se:WellKnownName>horline</se:WellKnownName>
<se:Stroke>
<se:SvgParameter name="stroke">#5c00b8</se:SvgParameter>
<se:SvgParameter name="stroke-width">3</se:SvgParameter>
</se:Stroke>
</se:Mark>
<se:Size>11</se:Size>
<se:Rotation>
<ogc:Literal>45</ogc:Literal>
</se:Rotation>
</se:Graphic>
</se:GraphicFill>
</se:Fill>
</se:PolygonSymbolizer>
</se:Rule>
</se:FeatureTypeStyle>
</UserStyle>
</NamedLayer>
</StyledLayerDescriptor>
更确切地说,我的问题是为什么Geoserver打印模块没有呈现我在传单中调用的填充样式,这要归功于带有样式选项的leaflet-polygon.fillPattern.js fill:'url(assets / img / image.png)',
对于标记图层,我可以调用我的图标并将它们发送到规范JSON中的Geoserver打印模块:
var iconUrl = icon.options.iconUrl;
style = {externalGraphic: this._getAbsoluteUrl(iconUrl)};
所以,我尝试用我的多边形: style = {graphicFill:url(assets / img / image.png)};
但它不起作用