OpenLayers动态修改GeoServer发布的地图样式
giscoder 2019-11-26 10:33:19 403 收藏
分类专栏： OpenLayers GeoServer
版权
流程思路
1.改写GeoServer相应的SLD，使其支持动态修改样式；
2.修改前端请求WMS服务参数。
修改GeoServer的SLD
该部分在GeoServer官网上有说明，想了解更多请访问GeoServer官网：https://docs.geoserver.org/stable/en/user/styling/sld/extensions/substitution.html#sld-variable-substitution
GeoServer从2.0.2开始支持通过改变请求参数来动态改变WMS服务的SLD样式，如改变字体、大小、颜色等。
示例
本文以动态修改点状符号的类型、颜色和大小为例进行说明。
常规状态下SLD写法
常规状态下要渲染点的颜色和大小，其SLD如下：
<?xml version="1.0" encoding="ISO-8859-1"?>
<StyledLayerDescriptor version="1.0.0" xmlns="http://www.opengis.net/sld" xmlns:ogc="http://www.opengis.net/ogc"
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.opengis.net/sld http://schemas.opengis.net/sld/1.0.0/StyledLayerDescriptor.xsd">
<NamedLayer>
<UserStyle>
<Title>Default point</Title>
<Abstract>A sample style that just prints out a 6px wide red square</Abstract>
<FeatureTypeStyle>
<Rule>
<Title>Red square</Title>
<PointSymbolizer>
<Graphic>
<Mark>
<WellKnownName>square</WellKnownName>
<Fill>
<CssParameter name="fill">#FF0000</CssParameter>
</Fill>
</Mark>
<Size>6</Size>
</Graphic>
</PointSymbolizer>
</Rule>
</FeatureTypeStyle>
</UserStyle>
</NamedLayer>
</StyledLayerDescriptor>
该样式下渲染结果如下图：
需动态修改状态下的SLD
在需修改的关键点处已标明注释
<?xml version="1.0" encoding="ISO-8859-1"?>
<StyledLayerDescriptor version="1.0.0" xmlns="http://www.opengis.net/sld" xmlns:ogc="http://www.opengis.net/ogc"
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.opengis.net/sld http://schemas.opengis.net/sld/1.0.0/StyledLayerDescriptor.xsd">
<NamedLayer>
<UserStyle>
<Title>Default point</Title>
<Abstract>A sample style that just prints out a 6px wide red square</Abstract>
<FeatureTypeStyle>
<Rule>
<Title>Red square</Title>
<PointSymbolizer>
<Graphic>
<Mark>
<WellKnownName>
<!--此处将点符号类型改为函数类型的-->
<ogc:Function name="env">
<!--name为前端调用时符号类型的参数名-->
<ogc:Literal>name</ogc:Literal>
<!--默认符号类型-->
<ogc:Literal>square</ogc:Literal>
</ogc:Function>
</WellKnownName>
<Fill>
<CssParameter name="fill">
<!--此处将颜色值改为函数类型的-->
#<ogc:Function name="env">
<!--color为前端调用时颜色的参数名-->
<ogc:Literal>color</ogc:Literal>
<!--默认颜色值-->
<ogc:Literal>FF0000</ogc:Literal>
</ogc:Function>
</CssParameter>
</Fill>
</Mark>
<Size>
<!--此处将大小改为函数类型的-->
<ogc:Function name="env">
<!--size为前端调用时符号大小的参数名-->
<ogc:Literal>size</ogc:Literal>
<!--默认大小-->
<ogc:Literal>6</ogc:Literal>
</ogc:Function>
</Size>
</Graphic>
</PointSymbolizer>
</Rule>
</FeatureTypeStyle>
</UserStyle>
</NamedLayer>
</StyledLayerDescriptor>
OpenLayers调用核心代码
var raster = new ol.layer.Tile({
source: new ol.source.TileWMS({
url: 'geoserver 服务地址',
params: {
LAYERS: '图层名称',
VERSION: "1.1.1",
env:'color:00FF00;name:triangle;size:12' //重点处：修改点状符号为：绿色、三角形、大小为12
}
})
});
其渲染结果如图所示：
————————————————
版权声明：本文为CSDN博主「giscoder」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/giscoder/article/details/103251623
