more fixes for the WFS display layer.

Ensure projections are set properly when given src-srs

Author: theduckylittle

examples/desktop/mapbook.xml

@@ -8,6 +8,32 @@
         <layer name="usng-grid" status="off" />
     </map-source>
 
+    <map-source name="issue542" type="wfs" src-proj="EPSG:4326" title="Issue 542">
+        <url>https://mrdata.usgs.gov/wfs/sgmc2</url>
+        <param name="typename" value="ms:Structure"/>
+        <!--
+        <param name="cross-origin" value="anonymous"/>
+        <param name="srsname"  value="EPSG:4326"/>
+        -->
+        <layer name="Structure" >
+            <style><![CDATA[
+            {
+                "circle-radius": 4,
+                "circle-color": "#fec44f",
+                "fill-color": "#fec44f",
+                "circle-stroke-color": "#d95f0e",
+                "line-color": "blue",
+                "line-width": 2,
+                "fill-opacity": 0.20,
+                "line-opacity": 0.80,
+                "text-field_COMMENTED-OUT": "{OWNER_NAME}",
+                "text-color": "#000000"
+            }
+            ]]></style>
+            <template name="identify" auto="true" />
+        </layer>
+    </map-source>
+
     <map-source name="sketch" type="vector" title="Drawing and Markup">
         <layer name="default" selectable="true" status="on">
             <style><![CDATA[
@@ -478,6 +504,8 @@
                draw-point="true" draw-line="true" draw-polygon="true"
                draw-modify="true" draw-remove="true" draw-edit="true" />
 
+      <layer src="issue542/Structure" />
+
         <group title="Overlays" expand="true" tip="Layers that sit above the basemaps">
             <group title="County Layers">
                 <metadata>https://raw.githubusercontent.com/geomoose/gm3-demo-data/main/demo/parcels/LICENSE</metadata>

src/gm3/components/map/layers/vector.js

@@ -41,8 +41,10 @@ import { tile, bbox } from "ol/loadingstrategy";
 import VectorSource from "ol/source/Vector";
 import VectorLayer from "ol/layer/Vector";
 import { createXYZ } from "ol/tilegrid";
+import { transformExtent } from "ol/proj";
 import { getEditStyle } from "./edit";
 import { EDIT_LAYER_NAME } from "../../../defaults";
+import { getQueryProjection } from "./wfs";
 
 // WARNING! This is a monkey patch in order to
 // allow rendering labels outside of a polygon's
@@ -76,25 +78,37 @@ function defineSource(mapSource) {
       format = GeoJSONFormat;
     }
 
+    // TODO: Ensure this gets the real map projection when
+    //       the code supports alternative projections.
+    const mapProjection = "EPSG:3857";
+    const queryProjection = getQueryProjection(mapSource, mapProjection);
+
     return {
-      format: new format({}),
-      projection: "EPSG:4326",
+      format: new format({
+        srsName: queryProjection,
+      }),
       url: function (extent) {
         if (typeof mapSource.params.typename === "undefined") {
           console.error(
             'No "typename" param defined for a WFS layer. This will fail.'
           );
         }
 
+        const queryExtent = transformExtent(
+          extent,
+          mapProjection,
+          queryProjection
+        );
+
         const urlParams = Object.assign(
           {},
           {
-            srsname: "EPSG:3857",
+            srs: queryProjection,
             outputFormat: outputFormat,
             service: "WFS",
             version: "1.1.0",
             request: "GetFeature",
-            bbox: extent.concat("EPSG:3857").join(","),
+            bbox: queryExtent,
           },
           mapSource.params
         );