Add larger tile size and document layer style

MTES-MCT · Feb 19, 2024 · 2c91625 · 2c91625
1 parent ab94994
commit 2c91625
Show file tree

Hide file tree

Showing 3 changed files with 54 additions and 1 deletion.
diff --git a/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx b/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx
@@ -1,4 +1,5 @@
 import { FAO_LAYER } from '@features/AdministrativeZone/layers/constants'
+import { useMainAppSelector } from '@hooks/useMainAppSelector'
 import React, { useEffect } from 'react'
 
 import {
@@ -9,7 +10,6 @@ import {
   layersNotInShowedLayers
 } from '../../../domain/entities/layers'
 import { LayerProperties } from '../../../domain/entities/layers/constants'
-import { useMainAppSelector } from '../../../hooks/useMainAppSelector'
 import { monitorfishMap } from '../../map/monitorfishMap'
 import { getVectorOLLayer } from '../useCases/showAdministrativeZone'
 

diff --git a/frontend/src/features/AdministrativeZone/layers/constants.ts b/frontend/src/features/AdministrativeZone/layers/constants.ts
@@ -1,6 +1,7 @@
 import { getLayerNameFromTypeAndZone } from '@features/AdministrativeZone/useCases/utils'
 import TileLayer from 'ol/layer/Tile'
 import { TileWMS } from 'ol/source'
+import { createXYZ } from 'ol/tilegrid'
 
 import { LayerProperties } from '../../../domain/entities/layers/constants'
 
@@ -10,6 +11,7 @@ export const FAO_LAYER = new TileLayer({
   source: new TileWMS({
     params: { FORMAT: 'image/png', LAYERS: 'monitorfish:fao_areas', STYLES: 'monitorfish:FAO style', TILED: true },
     serverType: 'geoserver',
+    tileGrid: createXYZ({ tileSize: 512 }),
     // Countries have transparency, so do not fade tiles:
     transition: 0,
     url: `${import.meta.env.FRONTEND_GEOSERVER_REMOTE_URL}/geoserver/monitorfish/wms`

diff --git a/frontend/src/features/AdministrativeZone/layers/styles/geoserver_fao_style.md b/frontend/src/features/AdministrativeZone/layers/styles/geoserver_fao_style.md
@@ -0,0 +1,51 @@
+# Geoserver FAO style
+
+The `fao_areas` layer is served as a Geoserver `wms` layer.
+
+For `geowebcache` to be running under `/wms` routes, the `WMS` caching direct integration must be setup:
+https://docs.geoserver.org/stable/en/user/geowebcache/webadmin/defaults.html#enable-direct-integration-with-geoserver-wms
+
+The style (named `FAO style`) is defined as the following SLD:
+```xml
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<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" xmlns:se="http://www.opengis.net/se">
+  <NamedLayer>
+    <Name>FAO areas layer</Name>
+    <UserStyle>
+      <Name>FAO areas</Name>
+      <Title>FAO Areas</Title>
+      <FeatureTypeStyle>
+        <Rule>
+          <Name>Line</Name>
+          <LineSymbolizer>
+            <Stroke>
+              <CssParameter name="stroke">#767ab2</CssParameter>
+              <CssParameter name="stroke-width">1</CssParameter>
+            </Stroke>
+          </LineSymbolizer>
+        </Rule>
+        <Rule>
+          <Name>Text</Name>
+          <TextSymbolizer>
+            <Label>
+              <ogc:PropertyName>f_code</ogc:PropertyName>
+            </Label>
+            <Font>
+              <CssParameter name="font-size">12</CssParameter>
+            </Font>
+            <Halo>
+              <Fill>
+                <CssParameter name="fill">#ffffff</CssParameter>
+              </Fill>
+            </Halo>
+            <Fill>
+              <CssParameter name="fill">#282F3E</CssParameter>
+              <CssParameter name="fill-opacity">1</CssParameter>
+            </Fill>
+          </TextSymbolizer>
+        </Rule>
+      </FeatureTypeStyle>
+    </UserStyle>
+  </NamedLayer>
+</StyledLayerDescriptor>
+```