Interoperability for web portrayal services : a use case with deegree3

Interoperability for web portrayal services : a use case with deegree3

Setting up a deegree3 workspace

creation of a FeatureStore connected to a shapefile : <ShapeFeatureStore>
- let's say the shapefiles are in the DEEGREE_WORKSPACE_ROOT/data directory
- we create the meteocities.xml file in a DEEGREE_WORKSPACE_ROOT/datasources/feature directory
- the FeatureStore is now identified by its filename meteocities

<ShapeFeatureStore xmlns="http://www.deegree.org/datasource/feature/shape"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" configVersion="3.1.0"
  xsi:schemaLocation="http://www.deegree.org/datasource/feature/shape http://schemas.deegree.org/datasource/feature/shape/3.1.0/shape.xsd">
  
  <StorageCRS>EPSG:21781</StorageCRS>
  <File>../../data/meteo/meteocities</File>

</ShapeFeatureStore>

creation of a FeatureLayers linked to our meteocities FeatureStore
- we create the meteocitiesLyr.xml file in DEEGREE_WORKSPACE_ROOT/layers directory
- the FeatureLayers is now identified by its filename meteocitiesLyr
- it binds meteocities FeatureStore to a layer named meteocities
- other options here : FeatureType, Filter

<FeatureLayers xmlns="http://www.deegree.org/layers/feature"
  xmlns:d="http://www.deegree.org/metadata/description" xmlns:l="http://www.deegree.org/layers/base"
  xmlns:s="http://www.deegree.org/metadata/spatial"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://www.deegree.org/layers/feature http://schemas.deegree.org/layers/feature/3.2.0/feature.xsd"
  configVersion="3.2.0">
  
  <FeatureStoreId>meteocities</FeatureStoreId>
  <FeatureLayer>
    <l:Name>meteocities</l:Name>
    <d:Title>Cities from switzerland with weather information</d:Title>
  </FeatureLayer>
</FeatureLayers>

creation of themes defining a tree of layers
- we create the meteosuisse.xml file in DEEGREE_WORKSPACE_ROOT/themes directory
- the tree is linked to one or many FeatureLayers by FeatureStoreId (filename above)
- each theme has an identifier that identifies the layer name displayed by the GetCapabilities operation
- these themes are identified by the filename meteosuisse

<Themes xmlns="http://www.deegree.org/themes/standard"
  xmlns:d="http://www.deegree.org/metadata/description"
  xmlns:s="http://www.deegree.org/metadata/spatial"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" configVersion="3.2.0"
  xsi:schemaLocation="http://www.deegree.org/themes/standard http://schemas.deegree.org/themes/3.2.0/themes.xsd">

  <LayerStoreId>meteocitiesLyr</LayerStoreId>
  <Theme>
    <d:Title>Meteosuisse theme</d:Title>
    <Theme>
      <Identifier>meteocities</Identifier>
      <d:Title>Meteosuisse cities</d:Title>
      <Layer>meteocities</Layer>
    </Theme> 
  </Theme>
</Themes>

creation of a deegreeWMS configuration
- we create the mywms.xml file in DEEGREE_WORKSPACE_ROOT/services directory
- it is linked to one themes file

<wms:deegreeWMS xmlns:wms="http://www.deegree.org/services/wms"
  xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:dgws="http://www.deegree.org/webservices"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" configVersion="3.2.0"
  xsi:schemaLocation="http://www.deegree.org/services/wms http://schemas.deegree.org/services/wms/3.2.0/wms_configuration.xsd">

  <wms:ServiceConfiguration>
    <wms:ThemeId>meteosuisse</wms:ThemeId>
  </wms:ServiceConfiguration>

</wms:deegreeWMS>

let's test the WMS service …
- may be you have to reload your active workspace from the deegree console
- test a GetCapabilites operation : http://localhost:8080/services/mywms?service=WMS&request=GetCapabilities
- the response shows the root Layer titled Meteosuisse theme and its concrete child Layer named meteocities on which we can now request a GetMap
- test a GetMap operation on meteocities : http://localhost:8080/services?SERVICE=WMS&VERSION=1.1.1&REQUEST=GetMap&LAYERS=meteocities&SRS=EPSG:21781&BBOX=449413,47606,899958,311321&STYLES=&WIDTH=1000&HEIGHT=585&FORMAT=image/png
- we can use the deegree WMS Viewer to explore all configured layers : http://localhost:8080/console/wms/wms.html
- or use our own “hands-on” WMS GetMapper to clearly see the WMS parameters :
  - SERVICE=WMS
  - VERSION=1.1.1
  - REQUEST=GetMap
  - SRS=EPSG:21781
  - BBOX=449413,47606,899958,311321 (notice: we get parameter values from the capabilities description)
  - LAYERS=meteocities
  - STYLES=
  - WIDTH=1000
  - HEIGHT=585
  - FORMAT=image/png

creation of a style …
- behind the scene, deegree3 has a rendering engine that we can manipulate through a language
- we can “program” styles with this cartographic language which is based on OGC Symbology Encoding
- each of these behind the scene styles is also called a NamedStyle
- we create the pointSimple.xml file in DEEGREE_WORKSPACE_ROOT/styles directory

<FeatureTypeStyle xmlns="http://www.opengis.net/se" xmlns:xlink="http://www.w3.org/1999/xlink"
  xmlns:app="http://www.deegree.org/app" xmlns:deegreeogc="http://www.deegree.org/ogc"
  xmlns:ogc="http://www.opengis.net/ogc" xmlns:sed="http://www.deegree.org/se"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://www.opengis.net/se http://schemas.opengis.net/se/1.1.0/FeatureStyle.xsd http://www.deegree.org/se http://schemas.deegree.org/se/1.1.0/Symbolizer-deegree.xsd">

  <Name>pointSimple</Name>
  <Description>
    <Title>Discover PointSymbolizer - a really simple circle point</Title>
  </Description>

  <Rule>
    <PointSymbolizer>
      <Graphic>
        <Mark>
          <WellKnownName>circle</WellKnownName>
          <Fill>
            <SvgParameter name="fill">#FFFFFF</SvgParameter>
          </Fill>
          <Stroke>
            <SvgParameter name="stroke">#000000</SvgParameter>
            <SvgParameter name="stroke-width">2</SvgParameter>
          </Stroke>
        </Mark>
        <Size>6</Size>
      </Graphic>
    </PointSymbolizer>
  </Rule>
</FeatureTypeStyle>

change the defaut style of a layer …
- each style has to be linked to a layer within the FeatureLayers file configuration
- we modify meteocitiesLyr.xml and the new elements StyleRef and StyleStoreId
- the StyleStoreId is the filename of the style in the DEEGREE_WORKSPACE_ROOT/styles directory
- a layer can be linked from 0 to N StyleRef (when no explicit style is defined, deegree3 uses a default style)
- as soon as at least one NamedStyle is explicitly defined it becomes the default style
- test the change : reload deegree3 from the console and then recall the above WMS request with our WMS GetMapper

  ...
  <FeatureLayer>
    <l:Name>meteocities</l:Name>
    <d:Title>Cities from switzerland with weather information</d:Title>
    <l:StyleRef>
      <l:StyleStoreId>pointSimple</l:StyleStoreId>
    </l:StyleRef>
  </FeatureLayer>
  ...

important to notice …
- we have know a first NamedStyle “pointSimple”
- it is also the default style (because it is the first declared style for the above FeatureLayer)
- thus, invoking a WMS request with STYLES=<empty> or with STYLES=pointSimple produce the same result
- the naming of the NamedStyle is given by the <Name> element defined within the <FeatureTypeStyle>
- usually we set the same name for both the <Name> element and the filename
- be careful when you copy/paste style files to be sure you adapt these names (that's a classic trap to forget !)

Discovering Symbology Encoging 1.1 further with NamedStyles

creation of another style dedicated to meteocities layer …
- we create the pointCities.xml file in DEEGREE_WORKSPACE_ROOT/styles directory
- within the cartographic rule we introduce a TextSymbolizer which offers feature labeling capacities
- for each feature, the rule applies the PointSymbolizer + the TextSymbolizer
- the style is dedicated to meteocities layer because it references specifically the attribute property named NAME that belongs to the underlying data
- this PropertyName is used to represent dynamically the text of the label
- see the commented part using a Literal, it will uses the text for all labels (not much useful alone)
- the LabelPlacement can be controlled : in this case we do not want the text to overlap circle symbol
- the Displacement is to consider relative to an anchor point within the label box (default anchor point is at the center of the label box)
- you may take control on other parameters with the Halo element (see commented part) or the Font element to specify SvgParameter elements among “font-family”, “font-style”, “font-weight”, and “font-size” (see deegree3 documentation to know which font-family are available)

<FeatureTypeStyle xmlns="http://www.opengis.net/se" xmlns:xlink="http://www.w3.org/1999/xlink"
  xmlns:app="http://www.deegree.org/app" xmlns:deegreeogc="http://www.deegree.org/ogc"
  xmlns:ogc="http://www.opengis.net/ogc" xmlns:sed="http://www.deegree.org/se"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://www.opengis.net/se http://schemas.opengis.net/se/1.1.0/FeatureStyle.xsd http://www.deegree.org/se http://schemas.deegree.org/se/1.1.0/Symbolizer-deegree.xsd">

  <Name>pointCities</Name>
  <Description>
    <Title>Discover PointSymbolizer - a simple point with a dynamic label</Title>
  </Description>

  <Rule>
    <PointSymbolizer>
      <Graphic>
        <Mark>
          <WellKnownName>circle</WellKnownName>
          <Fill>
            <SvgParameter name="fill">#FFFFFF</SvgParameter>
          </Fill>
          <Stroke>
            <SvgParameter name="stroke">#000000</SvgParameter>
            <SvgParameter name="stroke-width">2</SvgParameter>
          </Stroke>
        </Mark>
        <Size>6</Size>
      </Graphic>
    </PointSymbolizer>
    <TextSymbolizer>
      <Label>
        <!--<ogc:Literal>A static text !</ogc:Literal>-->
        <ogc:PropertyName>NAME</ogc:PropertyName>
      </Label>
      <LabelPlacement>
        <PointPlacement>
          <Displacement>
            <DisplacementX>0</DisplacementX>
            <DisplacementY>-10</DisplacementY>
          </Displacement>
        </PointPlacement>
      </LabelPlacement>
      <Fill>
        <SvgParameter name="fill">#000000</SvgParameter>        
      </Fill>  
      <!--
      <Halo>
        <Radius>
          <ogc:Literal>2</ogc:Literal>
        </Radius>
        <Fill>
          <SvgParameter name="fill">#FFFFFF</SvgParameter>
        </Fill>
      </Halo>
      -->
    </TextSymbolizer>
  </Rule>
</FeatureTypeStyle>

linking pointCities NamedStyle to meteocities layer …
- we add to meteocitiesLyr XML file a StyleRef with the StyleStoreId pointCities
- test it : reload deegree3 and recall the above WMS request with our WMS GetMapper by setting STYLE to the NamedStyle “pointCities”

  ...
  <FeatureLayer>
    <l:Name>meteocities</l:Name>
    <d:Title>Cities from switzerland with weather information</d:Title>
    <l:StyleRef>
      <l:StyleStoreId>pointSimple</l:StyleStoreId>
    </l:StyleRef>   
    <l:StyleRef>
      <l:StyleStoreId>pointCities</l:StyleStoreId>
    </l:StyleRef>     
  </FeatureLayer>
  ...

creation of one more FeatureStore …
- we create the g4cantons98 <ShapeFeatureStore> connected to the shapefile ../../data/base/g4cantons98 (EPSG:21781)

creation of one more Style …
- we create the NamedStyle “polygonSimple”
- we introduce the PolygonSymbolizer offering capacities to style polygon featuretype
- at first, we set the outline with the Stroke element associated to its relevant SvgParameter elements like “stroke” (for the color), “stroke-opacity”, “stroke-width”, …
- with have no Fill element which means polygons are just transparent

<FeatureTypeStyle xmlns="http://www.opengis.net/se" xmlns:xlink="http://www.w3.org/1999/xlink"
  xmlns:app="http://www.deegree.org/app" xmlns:deegreeogc="http://www.deegree.org/ogc"
  xmlns:ogc="http://www.opengis.net/ogc" xmlns:sed="http://www.deegree.org/se"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://www.opengis.net/se http://schemas.opengis.net/se/1.1.0/FeatureStyle.xsd http://www.deegree.org/se http://schemas.deegree.org/se/1.1.0/Symbolizer-deegree.xsd">

  <Name>polygonSimple</Name>
  <Description>
    <Title>Transparent polygons only outlined</Title>
  </Description>

  <Rule>
    
    <PolygonSymbolizer>
      <Stroke>
        <SvgParameter name="stroke">#777777</SvgParameter>
      </Stroke>
    </PolygonSymbolizer>
    
  </Rule>
</FeatureTypeStyle>

creation of a FeatureLayer linking above FeatureStore and Style …
- we create the g4cantons98Lyr.xml <FeatureLayers> file connecting the g4cantons98 <ShapeFeatureStore>
- we declare the g4cantons98 <FeatureLayer> in link with polygonSimple <FeatureTypeStyle>

addition of a Theme within meteosuisse.xml file of Themes …
- link the g4cantons98Lyr <LayerStoreId>
- declare the g4cantons98 <Theme>

<Themes>

  <LayerStoreId>meteocitiesLyr</LayerStoreId>
  <LayerStoreId>g4cantons98Lyr</LayerStoreId>
  <Theme>
    <d:Title>Meteosuisse theme</d:Title>
    <Theme>
      <Identifier>meteocities</Identifier>
      <d:Title>Meteosuisse cities</d:Title>
      <Layer>meteocities</Layer>
    </Theme>
    <Theme>
      <Identifier>g4cantons98</Identifier>
      <d:Title>Cantons units</d:Title>
      <Layer>g4cantons98</Layer>
    </Theme>     
  </Theme>
</Themes>

test the new layer with its default style …
- we reload deegree3 from the console and go to our WMS Getmapper
- we ask for LAYERS=g4cantons98 and STYLE=<empty> (or STYLE=polygonSimple which represents the same default style)

creation of one more polygon style …
- we create the NamedStyle “polygonBig” with a PolygonSymbolizer configured with the same color #DFE4E7 for both fill and stroke color (so as to hide cantons boundaries and simulate one big polygon for whole Switzerland)
- we link this new “polygonBig” NamedStyle to the FeatureLayer “g4cantons98”
- we test it by asking for LAYERS=g4cantons98 and STYLES=polygonBig

creation of one more FeatureStore, one more Style and one more FeatureLayer …
- we create the g4see98 <ShapeFeatureStore> connected to the shapefile ../../data/base/g4see98 (EPSG:21781)
- we create the NamedStyle “polygonLightblue” with a PolygonSymbolizer configured with a fill and stroke color #B8DCEA
- we create the g4see98Lyr.xml <FeatureLayers> file connecting the g4see98 <ShapeFeatureStore>
- we declare the g4see98 <FeatureLayer> in link with polygonLightblue <FeatureTypeStyle> (we also link it with polygonSimple)
- we don't forget to add a new Theme for this new FeatureLayer in the Themes configuration
- we reload deegree3 from the console
- we test everything with the WMS Getmapper by asking for LAYERS=g4see98 and STYLES=polygonLightblue

let's test now the combination of three layers : g4cantons98 + g4see98 + meteocities …
- with the WMS Getmapper we ask for
  - LAYERS=g4cantons98,g4see98,meteocities
  - STYLES=polygonBig,polygonLightblue,pointCities
- we understand: why LAYERS and STYLES parameters are plurals and there is an ordered matching of layers and styles

creation of one last FeatureStore, Style and FeatureLayer linkage …
- we create the waterways <ShapeFeatureStore> connected to the shapefile ../../data/base/waterways (EPSG:4326)
- we create the NamedStyle “lineDashed” by introducing the LineSymbolizer which offer capacities to style a line
- we create the waterwaysLyr.xml <FeatureLayers> file connecting the waterways <ShapeFeatureStore>
- we declare the waterways <FeatureLayer> in link with lineDashed <FeatureTypeStyle>
- we don't forget to add a new Theme for this new FeatureLayer in the Themes configuration
- we reload deegree3 from the console
- we test everything with the WMS Getmapper by asking for LAYERS=waterways and STYLES=lineDashed

<FeatureTypeStyle...>

  <Name>lineDashed</Name>
  <Description>
    <Title>Discover LineSymbolizer - a lightblue dashed line</Title>
  </Description>

  <Rule>
    <LineSymbolizer>
      <Stroke>
        <SvgParameter name="stroke">#B8DCEA</SvgParameter>
        <SvgParameter name="stroke-dasharray">5 5</SvgParameter>
      </Stroke>
    </LineSymbolizer>
  </Rule>
</FeatureTypeStyle>

let's test now a complete combination of all layers …
- with the WMS Getmapper we ask for
  - LAYERS=g4cantons98,g4see98,waterways,meteocities
  - STYLES=polygonBig,polygonLightblue,lineDashed,pointCities

discovery of one more styling capicity, GraphicFill …
- we create the NamedStyle “polygonWater” by introducing the use of GraphicFill element to fill polygons according to a graphic pattern
- we add a StyleRef for this new style to g4see98 <FeatureLayer>
- it may be useful to uncomment the Halo element of our pointCities style (you will see)
- we test it as usual !
  - LAYERS=g4cantons98,g4see98,waterways,meteocities
  - STYLES=polygonBig,polygonWater,lineDashed,pointCities

<FeatureTypeStyle...>

  <Name>polygonWater</Name>
  <Description>
    <Title>Polygons filled with a graphic</Title>
  </Description>

  <Rule>
    <PolygonSymbolizer>
      <Fill>
        <GraphicFill>
          <Graphic>
            <ExternalGraphic>
              <OnlineResource xlink:href="http://localhost/webmaptuto/sld/1.1/images/watermark.png"/>
              <Format>image/png</Format>
            </ExternalGraphic>
          </Graphic>
        </GraphicFill>
      </Fill>
      <Stroke>
        <SvgParameter name="stroke">#B8DCEA</SvgParameter>
      </Stroke>
    </PolygonSymbolizer>  
  </Rule>
</FeatureTypeStyle>

see below the intermediary result you should get …

creation of one more style introducing filtered rule …
- we create the NamedStyle “pointFOSSGIS” based on our NamedStyle “pointCities” by adding a filtered Rule element
- we add a StyleRef for this new style to meteocities <FeatureLayer>
- we have now two cartographic rules, each applies to a set of features :
  - the first rule applies only to the city of Rapperswil: by adding a filter to this rule (using the <ogc:Filter> syntax), we select Rappelswils' feature by its ID=0 so as to control the rendering engine to apply an ExternalGraphic based PointSymbolizer to that feature only
  - the second rule applies to all other features of the layer: by adding the <ElseFilter/> element to this rule, we select all the other features that have not been selected by another filtered rule (here it means ID <> 0) and this is to control the rendering engine to apply our previous combination of PointSymbolizer/TextSymbolizer to all these other features
- this logic is not different than the common if…then…else statment in programming
- we test it as usual !

<FeatureTypeStyle ...>

  <Name>pointFOSSGIS</Name>
  <Description>
    <Title>Discover filtered Rule element</Title>
  </Description>
  
  <Rule>
    <ogc:Filter>
      <ogc:PropertyIsEqualTo>
        <ogc:PropertyName>ID</ogc:PropertyName>
        <ogc:Literal>0</ogc:Literal>
      </ogc:PropertyIsEqualTo>
    </ogc:Filter>
    
    <PointSymbolizer>
      <Graphic>
        <ExternalGraphic>
          <OnlineResource xlink:href="images/fossgis_logo.png"/>
          <Format>image/png</Format>
        </ExternalGraphic>
        <AnchorPoint>
          <AnchorPointX>0.2</AnchorPointX>
          <AnchorPointY>0.4</AnchorPointY>
        </AnchorPoint>
      </Graphic>
    </PointSymbolizer>
  </Rule>
  
  <Rule>
    <ElseFilter/>
    <PointSymbolizer>
      <Graphic>
        <Mark>
          <WellKnownName>circle</WellKnownName>
          <Fill>
            <SvgParameter name="fill">#FFFFFF</SvgParameter>
          </Fill>
          <Stroke>
            <SvgParameter name="stroke">#000000</SvgParameter>
            <SvgParameter name="stroke-width">2</SvgParameter>
          </Stroke>
        </Mark>
        <Size>6</Size>
      </Graphic>
    </PointSymbolizer>
    <TextSymbolizer>
      <Label>
        <ogc:PropertyName>NAME</ogc:PropertyName>
      </Label>
      <LabelPlacement>
        <PointPlacement>
          <Displacement>
            <DisplacementX>0</DisplacementX>
            <DisplacementY>-10</DisplacementY>
          </Displacement>
        </PointPlacement>
      </LabelPlacement>
      <Fill>
        <SvgParameter name="fill">#000000</SvgParameter>        
      </Fill>  
    </TextSymbolizer>
  </Rule>
  
</FeatureTypeStyle>

see below the final result you should get …

Part II : discovering Symbology Encoging 1.1 further with UserStyles

Preliminary : before going to part II, we need to configure on last thing on our deegree3

creation of a deegreeWMS configuration …
- we create the mywfs.xml file in DEEGREE_WORKSPACE_ROOT/services directory
- it configure the WFS service so that all the underlying FeatureStore can be queried with EPSG:4326 and EPSG:21781 SRS
- reload deegree3 from the console and test it by requesting : http://localhost:8080/services/mywfs?service=WFS&request=GetCapabilities

<deegreeWFS xmlns="http://www.deegree.org/services/wfs"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" configVersion="3.2.0"
    xsi:schemaLocation="http://www.deegree.org/services/wfs http://schemas.deegree.org/services/wfs/3.2.0/wfs_configuration.xsd">

    <QueryCRS>urn:ogc:def:crs:EPSG::4326</QueryCRS>
    <QueryCRS>urn:ogc:def:crs:EPSG::21781</QueryCRS>
    
</deegreeWFS>

SLD/SE Part2

In the following part we will present the UserStyle SLD 1.1 mechanism for client customization while pursueing to discover styling capacities of SE 1.1.

go to SLD/SE Part2 …

Table of Contents

Interoperability for web portrayal services : a use case with deegree3

Setting up a deegree3 workspace

Discovering Symbology Encoging 1.1 further with NamedStyles

Part II : discovering Symbology Encoging 1.1 further with UserStyles