Mercurial > gemma
changeset 691:d643ff60f607
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 }