Mercurial > gemma

changeset 691:d643ff60f607

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Client: improve style of waterway axis. * Add label and circle style to waterway axis via WFS.
author Bernhard Reiter <bernhard@intevation.de>
date Thu, 20 Sep 2018 14:33:34 +0200
parents f595b3455d75
children a1c62adc9bcb 77928a3497f1
files client/src/map/store.js
diffstat 1 files changed, 20 insertions(+), 2 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/map/store.js	Thu Sep 20 14:15:32 2018 +0200
+++ b/client/src/map/store.js	Thu Sep 20 14:33:34 2018 +0200
@@ -3,7 +3,7 @@
 import TileWMS from "ol/source/TileWMS.js";
 import { Tile as TileLayer, Vector as VectorLayer } from "ol/layer.js";
 import OSM from "ol/source/OSM";
-import { Stroke, Style, Fill, Text } from "ol/style.js";
+import { Stroke, Style, Fill, Text, Circle as CircleStyle } from "ol/style.js";
 import VectorSource from "ol/source/Vector.js";
 
 const MapStore = {
@@ -92,7 +92,25 @@
       {
         name: "Distance marks, Axis",
         data: new VectorLayer({
-          source: new VectorSource()
+          source: new VectorSource(),
+          style: function(feature) {
+            return [
+              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()
+                })
+              })
+            ];
+          }
         }),
         isVisible: true
       }