GeoServer中使用Qgis发布的SLD样式进行图层美化

原创

夜郎King

发布于 2026-05-05 21:34:40

730

文章被收录于专栏：gisgis

一、前言

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能否直接使用，如果不能使用，您找到解决办法了吗？后续会进行一些常见问题的解决说明。

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

geoserver