目录
知识地图
一、前言
WebGIS是一种基于互联网的地理信息系统，它可以在Web浏览器上实现地理信息数据的可视化、分析、查询和管理等功能。WebGIS的核心技术是利用Web服务器和Web浏览器来发布和显示地理信息数据和功能，它可以让用户通过浏览器访问地理信息数据和功能，并且可以通过互联网实现空间信息的共享和交互。
WebGIS的应用范围非常广泛，包括地图服务、城市规划与管理、商业分析与决策支持、土地利用与覆盖变化监测、环境监测与保护、灾害预警与应急管理等领域。WebGIS的应用可以为用户提供丰富的地理信息数据和服务，帮助用户更好地了解和分析空间信息，提高决策的准确性和效率。
在之前的博客中，我们讲解了基于桌面端gis软件Qgis进行gis空间可视化的一些博客，博客地址见上面的知识地球索引。从空间数据到能在互联网上进行公开发布，让用户看到精美的地图，那一定会需要用到webgis技术。因此采用GeoServer进行地图服务的发布，使用Qgis辅助SLD样式制作，最后发布成WMS服务供前端LeafLet进行展示。本文将内容贯穿于整个Webgis地图样式制作及可视化配置全过程，详细讲解了如何把Qgis制作的SLD文件发布到Geoserver中，让大家熟悉Webgis的简单制作流程。
二、Qgis符号化转变成SLD
1、Qis中符号化生成
还是以2022年百强县一般公共预算收入数据和省份数据为例，前文说到，已经完成了在Qgis中的符号化制图。制图的效果如下图所示：
图中，我们对两个不同的矢量图层都进行了标注和符号化设置。在Qgis中，我们是可以直接导出SLD文件的，通常来说，可以将SLD文件直接在GeoServer中进行发布。这里，我们先进行SLD样式文件导出。
2、SLD样式导出
SLD样式导出有两种方式（这里演示一种方式），以全国百强县公共预算收入图层为例。第一种方式为，使用鼠标点击目标图层，右键导出，再选择另存为Qgis图层样式文件。
点击菜单后，弹出以下的窗口。
点击保存可以得到当前图层的SLD文件，用文本编辑器打开可以看到如下内容：
<?xml version="1.0" encoding="UTF-8"?>
<StyledLayerDescriptor xmlns="http://www.opengis.net/sld" xsi:schemaLocation="http://www.opengis.net/sld http://schemas.opengis.net/sld/1.1.0/StyledLayerDescriptor.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:se="http://www.opengis.net/se" xmlns:ogc="http://www.opengis.net/ogc" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1.0">
<NamedLayer>
<se:Name>2022年全国百强县一般公共预算收入榜</se:Name>
<UserStyle>
<se:Name>2022年全国百强县一般公共预算收入榜</se:Name>
<se:FeatureTypeStyle>
<se:Rule>
<se:Name>45 - 100</se:Name>
<se:Description>
<se:Title>45 - 100</se:Title>
</se:Description>
<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc">
<ogc:And>
<ogc:PropertyIsGreaterThanOrEqualTo>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>44.79999999999999716</ogc:Literal>
</ogc:PropertyIsGreaterThanOrEqualTo>
<ogc:PropertyIsLessThanOrEqualTo>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>100</ogc:Literal>
</ogc:PropertyIsLessThanOrEqualTo>
</ogc:And>
</ogc:Filter>
<se:PolygonSymbolizer>
<se:Fill>
<se:SvgParameter name="fill">#f7fcf5</se:SvgParameter>
</se:Fill>
<se:Stroke>
<se:SvgParameter name="stroke">#232323</se:SvgParameter>
<se:SvgParameter name="stroke-width">1</se:SvgParameter>
<se:SvgParameter name="stroke-linejoin">bevel</se:SvgParameter>
</se:Stroke>
</se:PolygonSymbolizer>
</se:Rule>
<se:Rule>
<se:Name>100 - 200</se:Name>
<se:Description>
<se:Title>100 - 200</se:Title>
</se:Description>
<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc">
<ogc:And>
<ogc:PropertyIsGreaterThan>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>100</ogc:Literal>
</ogc:PropertyIsGreaterThan>
<ogc:PropertyIsLessThanOrEqualTo>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>200</ogc:Literal>
</ogc:PropertyIsLessThanOrEqualTo>
</ogc:And>
</ogc:Filter>
<se:PolygonSymbolizer>
<se:Fill>
<se:SvgParameter name="fill">#caeac3</se:SvgParameter>
</se:Fill>
<se:Stroke>
<se:SvgParameter name="stroke">#232323</se:SvgParameter>
<se:SvgParameter name="stroke-width">1</se:SvgParameter>
<se:SvgParameter name="stroke-linejoin">bevel</se:SvgParameter>
</se:Stroke>
</se:PolygonSymbolizer>
</se:Rule>
<se:Rule>
<se:Name>200 - 300</se:Name>
<se:Description>
<se:Title>200 - 300</se:Title>
</se:Description>
<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc">
<ogc:And>
<ogc:PropertyIsGreaterThan>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>200</ogc:Literal>
</ogc:PropertyIsGreaterThan>
<ogc:PropertyIsLessThanOrEqualTo>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>300</ogc:Literal>
</ogc:PropertyIsLessThanOrEqualTo>
</ogc:And>
</ogc:Filter>
<se:PolygonSymbolizer>
<se:Fill>
<se:SvgParameter name="fill">#7bc87c</se:SvgParameter>
</se:Fill>
<se:Stroke>
<se:SvgParameter name="stroke">#232323</se:SvgParameter>
<se:SvgParameter name="stroke-width">1</se:SvgParameter>
<se:SvgParameter name="stroke-linejoin">bevel</se:SvgParameter>
</se:Stroke>
</se:PolygonSymbolizer>
</se:Rule>
<se:Rule>
<se:Name>300 - 400</se:Name>
<se:Description>
<se:Title>300 - 400</se:Title>
</se:Description>
<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc">
<ogc:And>
<ogc:PropertyIsGreaterThan>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>300</ogc:Literal>
</ogc:PropertyIsGreaterThan>
<ogc:PropertyIsLessThanOrEqualTo>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>400</ogc:Literal>
</ogc:PropertyIsLessThanOrEqualTo>
</ogc:And>
</ogc:Filter>
<se:PolygonSymbolizer>
<se:Fill>
<se:SvgParameter name="fill">#2a924a</se:SvgParameter>
</se:Fill>
<se:Stroke>
<se:SvgParameter name="stroke">#232323</se:SvgParameter>
<se:SvgParameter name="stroke-width">1</se:SvgParameter>
<se:SvgParameter name="stroke-linejoin">bevel</se:SvgParameter>
</se:Stroke>
</se:PolygonSymbolizer>
</se:Rule>
<se:Rule>
<se:Name>400 - 430</se:Name>
<se:Description>
<se:Title>400 - 430</se:Title>
</se:Description>
<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc">
<ogc:And>
<ogc:PropertyIsGreaterThan>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>400</ogc:Literal>
</ogc:PropertyIsGreaterThan>
<ogc:PropertyIsLessThanOrEqualTo>
<ogc:PropertyName> abs("ggys")</ogc:PropertyName>
<ogc:Literal>430.18000000000000682</ogc:Literal>
</ogc:PropertyIsLessThanOrEqualTo>
</ogc:And>
</ogc:Filter>
<se:PolygonSymbolizer>
<se:Fill>
<se:SvgParameter name="fill">#00441b</se:SvgParameter>
</se:Fill>
<se:Stroke>
<se:SvgParameter name="stroke">#232323</se:SvgParameter>
<se:SvgParameter name="stroke-width">1</se:SvgParameter>
<se:SvgParameter name="stroke-linejoin">bevel</se:SvgParameter>
</se:Stroke>
</se:PolygonSymbolizer>
</se:Rule>
<se:Rule>
<se:TextSymbolizer>
<se:Label>
<!--SE Export for NAME + '\n' + ' 预算收入' + ggys + '(亿元)' not implemented yet-->Placeholder</se:Label>
<se:Font>
<se:SvgParameter name="font-family">SimSun</se:SvgParameter>
<se:SvgParameter name="font-size">13</se:SvgParameter>
</se:Font>
<se:LabelPlacement>
<se:PointPlacement>
<se:AnchorPoint>
<se:AnchorPointX>0</se:AnchorPointX>
<se:AnchorPointY>0.5</se:AnchorPointY>
</se:AnchorPoint>
</se:PointPlacement>
</se:LabelPlacement>
<se:Fill>
<se:SvgParameter name="fill">#000000</se:SvgParameter>
</se:Fill>
<se:VendorOption name="maxDisplacement">1</se:VendorOption>
</se:TextSymbolizer>
</se:Rule>
</se:FeatureTypeStyle>
</UserStyle>
</NamedLayer>
</StyledLayerDescriptor>同样的，将省份信息的SLD样式导出来。
三、GeoServer数据发布
1、矢量图层发布
在GeoServer管理器中新建数据源，详细操作如下：
这里根据数据源选择Shapefile，点击继续，新建矢量数据源，选择源文件，添加到GeoServer管理器中。
这里需要注意的是DBF的字符集的设置很重要，最好跟Qgis中的数据集一致就不会出现中文乱码问题。注意，这里只是将图层使用默认样式发布出来，在图层预览时可以看到如下的页面，以公共预算收入为例。
可以看到，服务发布后，并不是按照设想的方式进行展示的。
2、在GeoServer中发布样式
在GeoServer中可以进行图层样式的集中管理。详细操作步骤如下：
在GeoServer左侧菜单中点击样式超链接，在右边的列表中点击新增样式按钮进行样式的添加。将从Qgis中导出的SLD文件导入到当前页面中。
样式文件上传后，点击validate按钮进行格式验证，提示没有错误点击保存。
将当前样式应用在指定的图层数据中，在样式页面的发布页面勾选需要设置的图层复选框。
最后使用GeoServer默认的地图浏览器进行预览，可以看到如下的效果：
能看到以上效果，说明样式导入成功。
总结
以上就是本文的主要内容，本文将内容贯穿于整个Webgis地图样式制作及可视化配置全过程，详细讲解了如何把Qgis制作的SLD文件发布到Geoserver中，让大家熟悉Webgis的简单制作流程。有兴趣的朋友可以自己尝试进行相应的地图服务发布，同时设置图层样式，在发布的过程中测试一下Qgis生成的SLD能否直接使用，如果不能使用，您找到解决办法了吗？后续会进行一些常见问题的解决说明。