--- a/client/src/components/layers/LegendElement.vue	Mon Apr 08 14:53:09 2019 +0200
+++ b/client/src/components/layers/LegendElement.vue	Mon Apr 08 15:32:53 2019 +0200
@@ -16,7 +16,7 @@
  * Author(s):
  * Thomas Junk <thomas.junk@intevation.de>
  */
-import { mapGetters } from "vuex";
+import { mapState } from "vuex";
 
 import { Map, View } from "ol";
 import Feature from "ol/Feature";
@@ -26,22 +26,26 @@
 import Point from "ol/geom/Point";
 
 export default {
-  name: "legendelement",
-  props: ["name"],
+  props: ["layer"],
   data: function() {
     return {
-      myMap: null,
-      mapLayer: null
+      myMap: null
     };
   },
   computed: {
-    ...mapGetters("map", ["getLayerByName"]),
+    ...mapState("map", ["layers"]),
     id() {
-      return "legendelement-" + this.name;
+      return (
+        "legendelement-" +
+        this.layer
+          .get("label")
+          .toLowerCase()
+          .replace(/\s/g, "")
+      );
     },
     mstyle() {
-      if (this.mapLayer && this.mapLayer.data.getStyle) {
-        return this.mapLayer.data.getStyle();
+      if (this.layer && this.layer.getStyle) {
+        return this.layer.getStyle();
       }
     }
   },
@@ -57,8 +61,7 @@
     }
   },
   mounted() {
-    this.mapLayer = this.getLayerByName(this.name);
-    if (this.mapLayer.data.getType() == "VECTOR") {
+    if (this.layer.getType() == "VECTOR") {
       this.initMap();
     } else {
       // TODO other tiles
@@ -81,7 +84,7 @@
       });
     },
     createVectorLayer() {
-      let mapStyle = this.mapLayer.data.getStyle();
+      let mapStyle = this.layer.getStyle();
 
       let feature = new Feature({
         geometry: new LineString([[-1, 0.5], [0, 0], [0.7, 0], [1.3, -0.7]])
@@ -89,20 +92,21 @@
 
       // special case if we need to call the style function with a special
       // parameter or to detect a point layer
-      if (this.mapLayer["forLegendStyle"]) {
-        if (this.mapLayer.forLegendStyle.point) {
+      let legendStyle = this.layer.get("forLegendStyle");
+      if (legendStyle) {
+        if (legendStyle) {
           feature.setGeometry(new Point([0, 0]));
         }
-        mapStyle = this.mapLayer.data.getStyleFunction()(
+        mapStyle = this.layer.getStyleFunction()(
           feature,
-          this.mapLayer.forLegendStyle.resolution,
+          legendStyle.resolution,
           true
         );
       }
 
       // we could add extra properties here, if they are needed for
       // the styling function in the future. An idea is to extend the
-      // this.mapLayer["forLegendStyle"] for it.
+      // this.layer["forLegendStyle"] for it.
       // FIXME, this is a special case for the Fairway Dimensions style
       feature.set("level_of_service", "");
       return new VectorLayer({