changeset 2526:6498267096ae

client: critical bottlenecks: use png instead of vectors for marker The positioning of text is not always precise. The exclamation mark in the warning sign for critical bottlenecks was not always perfectly centered. Using a png image is more reliable.
author Markus Kottlaender <markus@intevation.de>
date Wed, 06 Mar 2019 15:39:59 +0100
parents 8416cf343f17
children 1a6553da9078
files client/src/assets/marker-bottleneck-critical.png client/src/store/map.js
diffstat 2 files changed, 4 insertions(+), 19 deletions(-) [+]
line wrap: on
line diff
Binary file client/src/assets/marker-bottleneck-critical.png has changed
--- a/client/src/store/map.js	Wed Mar 06 15:25:40 2019 +0100
+++ b/client/src/store/map.js	Wed Mar 06 15:39:59 2019 +0100
@@ -346,25 +346,10 @@
               styles.push(
                 new Style({
                   geometry: new Point(bnCenter),
-                  image: new RegularShape({
-                    points: 3,
-                    radius: isLegend ? 9 : 13,
-                    fill: new Fill({ color: "white" }),
-                    stroke: new Stroke({
-                      color: "rgba(255, 0, 0, 0.8)",
-                      width: isLegend ? 2 : 3
-                    })
-                  }),
-                  text: new Text({
-                    font:
-                      "bold " +
-                      (isLegend ? 8 : 12) +
-                      'px "Open Sans", "sans-serif"',
-                    placement: "point",
-                    fill: new Fill({ color: "black" }),
-                    text: "!",
-                    offsetY: isLegend ? 0 : 1,
-                    offsetX: isLegend ? 1 : 0
+                  image: new Icon({
+                    src: require("../assets/marker-bottleneck-critical.png"),
+                    anchor: [0.5, 0.5],
+                    scale: isLegend ? 0.5 : 1
                   })
                 })
               );