changeset 2964:b9625cf91f95

client: maplayer: use buildVectorLoader for fairway dimensions too by adding a flag for bbox strategy. I don't know why the fairway dimensions need to be loaded all at once for the cross profiles to work, but I left that intact. Also some redundant code was removed.
author Markus Kottlaender <markus@intevation.de>
date Mon, 08 Apr 2019 17:33:45 +0200
parents 27ffd94afcb5
children 8acd0a235a94
files client/src/components/Maplayer.vue
diffstat 1 files changed, 45 insertions(+), 87 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/Maplayer.vue	Mon Apr 08 16:51:50 2019 +0200
+++ b/client/src/components/Maplayer.vue	Mon Apr 08 17:33:45 2019 +0200
@@ -77,25 +77,28 @@
   methods: {
     buildVectorLoader(
       featureRequestOptions,
-      endpoint,
       vectorSource,
+      bboxStrategyDisabled,
       featurePostProcessor
     ) {
       // build a function to be used for VectorSource.setLoader()
       // make use of WFS().writeGetFeature to build the request
       // and use our HTTP library to actually do it
-      // NOTE: a) the geometryName has to be given in featureRequestOptions,
-      //          because we want to load depending on the bbox
-      //  b) the VectorSource has to have the option strategy: bbox
-      featureRequestOptions["outputFormat"] = "application/json";
-      var loader = function(extent, resolution, projection) {
-        featureRequestOptions["bbox"] = extent;
-        featureRequestOptions["srsName"] = projection.getCode();
-        var featureRequest = new WFS().writeGetFeature(featureRequestOptions);
-        // DEBUG console.log(featureRequest);
+      // NOTE: the geometryName has to be given in featureRequestOptions if
+      // bboxStrategy (default) is used
+      featureRequestOptions.featureNS = "gemma";
+      featureRequestOptions.featurePrefix = "gemma";
+      featureRequestOptions.outputFormat = "application/json";
+      return (extent, resolution, projection) => {
+        if (!bboxStrategyDisabled) {
+          featureRequestOptions.bbox = extent;
+        }
+        featureRequestOptions.srsName = projection.getCode();
         HTTP.post(
-          endpoint,
-          new XMLSerializer().serializeToString(featureRequest),
+          "/internal/wfs",
+          new XMLSerializer().serializeToString(
+            new WFS().writeGetFeature(featureRequestOptions)
+          ),
           {
             headers: {
               "X-Gemma-Auth": localStorage.getItem("token"),
@@ -104,27 +107,18 @@
           }
         )
           .then(response => {
-            var features = new GeoJSON().readFeatures(
+            const features = new GeoJSON().readFeatures(
               JSON.stringify(response.data)
             );
             if (featurePostProcessor) {
               features.map(f => featurePostProcessor(f));
             }
             vectorSource.addFeatures(features);
-            // console.log(
-            //   "loaded",
-            //   features.length,
-            //   featureRequestOptions.featureTypes,
-            //   "features"
-            // );
-            // DEBUG console.log("loaded ", features, "for", vectorSource);
-            // eslint-disable-next-line
           })
           .catch(() => {
             vectorSource.removeLoadedExtent(extent);
           });
       };
-      return loader;
     },
     updateBottleneckFilter(bottleneck_id, datestr) {
       const exists = bottleneck_id != "does_not_exist";
@@ -228,58 +222,46 @@
 
     // TODO make display of layers more dynamic, e.g. from a list
 
-    // load different fairway dimension layers (level of service)
-    [
-      "FAIRWAYDIMENSIONSLOS1",
-      "FAIRWAYDIMENSIONSLOS2",
-      "FAIRWAYDIMENSIONSLOS3"
-    ].forEach((los, i) => {
-      // loading the full WFS layer without bboxStrategy
-      var source = this.layers[los].getSource();
-      var loader = function() {
-        var featureRequest = new WFS().writeGetFeature({
-          srsName: "EPSG:3857",
-          featureNS: "gemma",
-          featurePrefix: "gemma",
+    this.layers.FAIRWAYDIMENSIONSLOS1.getSource().setLoader(
+      this.buildVectorLoader(
+        {
           featureTypes: ["fairway_dimensions"],
-          outputFormat: "application/json",
-          filter: equalTo("level_of_service", i + 1)
-        });
+          filter: equalTo("level_of_service", 1)
+        },
+        this.layers.FAIRWAYDIMENSIONSLOS1.getSource(),
+        true
+      )
+    );
 
-        featureRequest["outputFormat"] = "application/json";
-        // NOTE: loading the full fairway_dimensions makes sure
-        //       that all are available for the intersection with the profile
-        HTTP.post(
-          "/internal/wfs",
-          new XMLSerializer().serializeToString(featureRequest),
-          {
-            headers: {
-              "X-Gemma-Auth": localStorage.getItem("token"),
-              "Content-type": "text/xml; charset=UTF-8"
-            }
-          }
-        ).then(response => {
-          source.addFeatures(
-            new GeoJSON().readFeatures(JSON.stringify(response.data))
-          );
-          // would scale to the extend of all resulting features
-          // this.openLayersMap.getView().fit(vectorSrc.getExtent());
-        });
-      };
+    this.layers.FAIRWAYDIMENSIONSLOS2.getSource().setLoader(
+      this.buildVectorLoader(
+        {
+          featureTypes: ["fairway_dimensions"],
+          filter: equalTo("level_of_service", 2)
+        },
+        this.layers.FAIRWAYDIMENSIONSLOS2.getSource(),
+        true
+      )
+    );
 
-      this.layers[los].getSource().setLoader(loader);
-    });
+    this.layers.FAIRWAYDIMENSIONSLOS3.getSource().setLoader(
+      this.buildVectorLoader(
+        {
+          featureTypes: ["fairway_dimensions"],
+          filter: equalTo("level_of_service", 3)
+        },
+        this.layers.FAIRWAYDIMENSIONSLOS3.getSource(),
+        true
+      )
+    );
 
     // load following layers with bboxStrategy (using our request builder)
     this.layers.WATERWAYAREA.getSource().setLoader(
       this.buildVectorLoader(
         {
-          featureNS: "gemma",
-          featurePrefix: "gemma",
           featureTypes: ["waterway_area"],
           geometryName: "area"
         },
-        "/internal/wfs",
         this.layers.WATERWAYAREA.getSource()
       )
     );
@@ -287,12 +269,9 @@
     this.layers.WATERWAYAXIS.getSource().setLoader(
       this.buildVectorLoader(
         {
-          featureNS: "gemma",
-          featurePrefix: "gemma",
           featureTypes: ["waterway_axis"],
           geometryName: "wtwaxs"
         },
-        "/internal/wfs",
         this.layers.WATERWAYAXIS.getSource()
       )
     );
@@ -300,12 +279,9 @@
     this.layers.WATERWAYPROFILES.getSource().setLoader(
       this.buildVectorLoader(
         {
-          featureNS: "gemma",
-          featurePrefix: "gemma",
           featureTypes: ["waterway_profiles"],
           geometryName: "geom"
         },
-        "/internal/wfs",
         this.layers.WATERWAYPROFILES.getSource()
       )
     );
@@ -313,12 +289,9 @@
     this.layers.DISTANCEMARKS.getSource().setLoader(
       this.buildVectorLoader(
         {
-          featureNS: "gemma",
-          featurePrefix: "gemma",
           featureTypes: ["distance_marks_ashore_geoserver"],
           geometryName: "geom"
         },
-        "/internal/wfs",
         this.layers.DISTANCEMARKS.getSource()
       )
     );
@@ -326,12 +299,9 @@
     this.layers.DISTANCEMARKSAXIS.getSource().setLoader(
       this.buildVectorLoader(
         {
-          featureNS: "gemma",
-          featurePrefix: "gemma",
           featureTypes: ["distance_marks_geoserver"],
           geometryName: "geom"
         },
-        "/internal/wfs",
         this.layers.DISTANCEMARKSAXIS.getSource()
       )
     );
@@ -339,12 +309,9 @@
     this.layers.GAUGES.getSource().setLoader(
       this.buildVectorLoader(
         {
-          featureNS: "gemma",
-          featurePrefix: "gemma",
           featureTypes: ["gauges_geoserver"],
           geometryName: "geom"
         },
-        "/internal/wfs",
         this.layers.GAUGES.getSource()
       )
     );
@@ -352,12 +319,9 @@
     this.layers.STRETCHES.getSource().setLoader(
       this.buildVectorLoader(
         {
-          featureNS: "gemma",
-          featurePrefix: "gemma",
           featureTypes: ["stretches_geoserver"],
           geometryName: "area"
         },
-        "/internal/wfs",
         this.layers.STRETCHES.getSource(),
         f => {
           if (f.getId() === this.selectedStretchId) {
@@ -371,12 +335,9 @@
     this.layers.BOTTLENECKSTATUS.getSource().setLoader(
       this.buildVectorLoader(
         {
-          featureNS: "gemma",
-          featurePrefix: "gemma",
           featureTypes: ["bottlenecks_geoserver"],
           geometryName: "area"
         },
-        "/internal/wfs",
         this.layers.BOTTLENECKSTATUS.getSource()
       )
     );
@@ -384,12 +345,9 @@
     this.layers.BOTTLENECKS.getSource().setLoader(
       this.buildVectorLoader(
         {
-          featureNS: "gemma",
-          featurePrefix: "gemma",
           featureTypes: ["bottlenecks_geoserver"],
           geometryName: "area"
         },
-        "/internal/wfs",
         this.layers.BOTTLENECKS.getSource()
       )
     );