I’m a junior GIS developer and working on an Angular + OpenLayers based WebMAP Application and i am using GeoServer in order to show my geometry data on my map with WMS, WFS URLs. I’ve downloaded a sample shapefile(shp) data that shows all the cities on the world with Point(the_geom) data and stored it in the my GeoServer. I applied ” Stacking / Clustering Point ” on those Point geometries with OpenLayers Codes ( ol/clusters) without problem.

But i need same feature ( Stacking / Clustering Point Geometry Data ) on GeoServers SLD side without using any OpenLayers functions. I’ve tried many ways to do it but failed, faced other problems over and over again.

So let me give you my world_cities shapefile data and types;

the_geom – Point (Returns the coordinates like (-56.0930036752727 -15.6150000711535))
FID – Integer,
OBJECTID – Integer,
CITY_NAME – String,
GMI_ADMIN – String,
ADMIN_NAME – String,
FIPS_CNTRY – String,
CNTRY_NAME – String,
STATUS – String,
POP – Integer,
POP_RANK – Integer,
POP_CLASS – String,
PORT_ID – Integer,
LABEL_FLAG – Integer,
POP_SOURCE – String

I need to take that Point Data (Map Coordinates) and apply Stacking / Clustering Points based on zoom level only in the GeoServers SLD File.

I’m using GeoServer Version: 2.25.2

I tried many different SLD code to do this and faced many different problems;

<?xml version="1.0" encoding="UTF-8"?>
<StyledLayerDescriptor version="1.0.0"
                       xsi:schemaLocation="http://www.opengis.net/sld StyledLayerDescriptor.xsd"
                       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">
  <NamedLayer>
    <Name>World_Cities</Name>
    <UserStyle>
      <Title>Cluster</Title>
      <FeatureTypeStyle>
        <Transformation>
          <ogc:Function name="vec:PointStacker">
            <ogc:Function name="parameter">
              <ogc:Literal>data</ogc:Literal>
            </ogc:Function>
            <ogc:Function name="parameter">
              <ogc:Literal>cellSize</ogc:Literal>
              <ogc:Literal>128</ogc:Literal>
            </ogc:Function>
            <ogc:Function name="parameter">
              <ogc:Literal>outputBBOX</ogc:Literal>
              <ogc:Function name="env">
                <ogc:Literal>wms_bbox</ogc:Literal>
              </ogc:Function>
            </ogc:Function>
            <ogc:Function name="parameter">
              <ogc:Literal>outputWidth</ogc:Literal>
              <ogc:Literal>1024</ogc:Literal>
            </ogc:Function>
            <ogc:Function name="parameter">
              <ogc:Literal>outputHeight</ogc:Literal>
              <ogc:Literal>1024</ogc:Literal>
            </ogc:Function>
          </ogc:Function>
        </Transformation>
        <Rule>
          <Name>default</Name>
          <PointSymbolizer>
            <Graphic>
              <Mark>
                <WellKnownName>circle</WellKnownName>
                <Fill>
                  <CssParameter name="fill">#FF0000</CssParameter>
                </Fill>
                <Stroke>
                  <CssParameter name="stroke">#000000</CssParameter>
                  <CssParameter name="stroke-width">1</CssParameter>
                </Stroke>
              </Mark>
              <Size>
                <ogc:Function name="env">
                  <ogc:Literal>point_size</ogc:Literal>
                  <ogc:Literal>5</ogc:Literal>
                </ogc:Function>
              </Size>
            </Graphic>
          </PointSymbolizer>
        </Rule>
        <Rule>
          <Name>cluster</Name>
          <ogc:Filter>
            <ogc:PropertyIsGreaterThan>
              <ogc:PropertyName>FID</ogc:PropertyName>
              <ogc:Literal>1</ogc:Literal>
            </ogc:PropertyIsGreaterThan>
          </ogc:Filter>
          <PointSymbolizer>
            <Graphic>
              <Mark>
                <WellKnownName>circle</WellKnownName>
                <Fill>
                  <CssParameter name="fill">#00FF00</CssParameter>
                </Fill>
                <Stroke>
                  <CssParameter name="stroke">#000000</CssParameter>
                  <CssParameter name="stroke-width">1</CssParameter>
                </Stroke>
              </Mark>
              <Size>
                <ogc:PropertyName>FID</ogc:PropertyName>
              </Size>
            </Graphic>
          </PointSymbolizer>
          <TextSymbolizer>
            <Label>
              <ogc:PropertyName>FID</ogc:PropertyName>
            </Label>
            <Font>
              <CssParameter name="font-family">Arial</CssParameter>
              <CssParameter name="font-size">12</CssParameter>
              <CssParameter name="font-style">normal</CssParameter>
              <CssParameter name="font-weight">bold</CssParameter>
            </Font>
            <LabelPlacement>
              <PointPlacement>
                <AnchorPoint>
                  <AnchorPointX>0.5</AnchorPointX>
                  <AnchorPointY>0.5</AnchorPointY>
                </AnchorPoint>
                <Displacement>
                  <DisplacementX>0</DisplacementX>
                  <DisplacementY>0</DisplacementY>
                </Displacement>
              </PointPlacement>
            </LabelPlacement>
            <Fill>
              <CssParameter name="fill">#000000</CssParameter>
            </Fill>
          </TextSymbolizer>
        </Rule>
      </FeatureTypeStyle>
    </UserStyle>
  </NamedLayer>
</StyledLayerDescriptor>

This is my last SLD Code and this code throws error ” No Such Attribute: Integer ” when i’m trying to see my Layer with Layer Preview.