--- a/client/src/components/ImportStretches.vue	Tue Apr 02 17:08:07 2019 +0200
+++ b/client/src/components/ImportStretches.vue	Tue Apr 02 18:19:43 2019 +0200
@@ -303,7 +303,6 @@
 import { LAYERS } from "@/store/map";
 import { HTTP } from "@/lib/http";
 import { sortTable } from "@/lib/mixins";
-import { Stroke, Style, Fill } from "ol/style.js";
 
 export default {
   name: "importstretches",
@@ -343,7 +342,7 @@
     ...mapState("map", ["identifiedFeatures", "currentMeasurement"]),
     ...mapGetters("map", ["getVSourceByName", "getLayerByName"]),
     ...mapGetters("user", ["isSysAdmin"]),
-    ...mapState("imports", ["stretches"]),
+    ...mapState("imports", ["stretches", "selectedStretch"]),
     defineStretchesLabel() {
       return this.$gettext("Define Stretches");
     },
@@ -381,6 +380,16 @@
         this.pipetteStart = false;
         this.pipetteEnd = false;
       }
+    },
+    selectedStretch(stretch) {
+      this.getVSourceByName(LAYERS.STRETCHES)
+        .getFeatures()
+        .forEach(f => {
+          f.set("highlighted", false);
+          if (f.getId() === stretch.id) {
+            f.set("highlighted", true);
+          }
+        });
     }
   },
   methods: {
@@ -460,50 +469,14 @@
       });
     },
     moveMapToStretch(stretch) {
-      //define new style for the selected stretch
-      var newStyle = new Style({
-        stroke: new Stroke({
-          color: "rgba(250, 240, 10, .9)",
-          width: 5
-        }),
-        fill: new Fill({
-          color: "rgba(250, 240, 0, .7)"
-        })
-      });
-      let stretchesLayer = this.getLayerByName(LAYERS.STRETCHES);
-      let oldStyle = stretchesLayer.data.getStyle();
+      this.$store.commit("imports/selectedStretch", stretch);
       this.$store.commit("map/setLayerVisible", LAYERS.STRETCHES);
-      var stretches = stretchesLayer.data.getSource().getFeatures();
-      // change the style when the the stretches are already loaded
-      if (stretches.length) {
-        this.setStretchStyle(stretches, stretch, oldStyle, newStyle);
-      } else {
-        // by choosing stretch first time wating to load the features then change the style
-        stretchesLayer.data.getSource().once("change", () => {
-          this.setStretchStyle(
-            stretchesLayer.data.getSource().getFeatures(),
-            stretch,
-            oldStyle,
-            newStyle
-          );
-        });
-      }
       this.$store.commit("map/moveToExtent", {
         feature: stretch,
         zoom: 17,
         preventZoomOut: true
       });
     },
-    // give the selected stretch new style and set the orginal style to the others
-    setStretchStyle(features, stretch, oldStyle, newStyle) {
-      features.forEach(f => {
-        if (f.id_ === stretch.id) {
-          f.setStyle(newStyle);
-        } else {
-          f.setStyle(oldStyle);
-        }
-      });
-    },
     clean() {
       this.id = "";
       this.edit = false;