Mercurial > gemma

changeset 700:8c3c43595d39

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
client: make kilometre style resolution depending * Add style function that takes the resolution into account for the distance_marks_geoserver that display the riverkilometre on the waterway axis. Circle and Text are independently switched off if the resolution is too large.
author Bernhard Reiter <bernhard@intevation.de>
date Thu, 20 Sep 2018 21:50:18 +0200
parents 3da0ab06d5a0
children 8149772c62d6
files client/src/map/store.js
diffstat 1 files changed, 23 insertions(+), 14 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/map/store.js	Thu Sep 20 16:14:38 2018 +0200
+++ b/client/src/map/store.js	Thu Sep 20 21:50:18 2018 +0200
@@ -21,6 +21,7 @@
         name: "Inland ECDIS chart Danube",
         data: new TileLayer({
           source: new TileWMS({
+            preload: 1,
             url: "https://demo.d4d-portal.info/wms",
             params: { LAYERS: "d4d", VERSION: "1.1.1", TILED: true }
           })
@@ -93,23 +94,31 @@
         name: "Distance marks, Axis",
         data: new VectorLayer({
           source: new VectorSource(),
-          style: function(feature) {
-            return [
-              new Style({
+          style: function(feature, resolution) {
+            if (resolution < 10) {
+              var s = new Style({
                 image: new CircleStyle({
                   radius: 5,
-                  fill: new Fill({color: 'rgba(255, 0, 0, 0.1)'}),
-                  stroke: new Stroke({color: 'blue', width: 1})
-                }),
-                text: new Text({
-                  font: '10px "Open Sans", "sans-serif"',
-                  fill: new Fill({
-                    color: "black"
-                  }),
-                  text: (feature.get("hectometre")/10).toString()
+                  fill: new Fill({ color: "rgba(255, 0, 0, 0.1)" }),
+                  stroke: new Stroke({ color: "blue", width: 1 })
                 })
-              })
-            ];
+              });
+              if (resolution < 6) {
+                s.setText(
+                  new Text({
+                    offsetY: 12,
+                    font: '10px "Open Sans", "sans-serif"',
+                    fill: new Fill({
+                      color: "black"
+                    }),
+                    text: (feature.get("hectometre") / 10).toString()
+                  })
+                );
+              }
+              return s;
+            } else {
+              return [];
+            }
           }
         }),
         isVisible: true