Add custom style for vnd.farmmaps.itemntype.layer

projects/common-map/src/fm-map/components/aol/item-layers/item-layers.component.ts

@@ -126,7 +126,7 @@ export class ItemLayersComponent extends LayerGroupComponent implements OnChange
             return this.getColorFromGradient(l, feature);           
           }
         })
-      } if (l && l.rendering && l.rendering.renderoutputType == "Tiles") {
+      } else if (l && l.rendering && l.rendering.renderoutputType == "Tiles") {
         var rt = l.rendering as IRenderoutputTiles;
         layer = new Tile({
           source: new XYZ({

projects/common-map/src/fm-map/components/aol/item-vector-source/item-vector-source.component.ts

@@ -54,19 +54,27 @@ export class ItemVectorSourceComponent extends SourceVectorComponent implements
     return geometry;
    }
 
+  getSelectedStyle(feature:Feature):style.Style {
+    let key = feature.get('itemType')+"_selected";
+    if(this.stylesCache[key]) {
+      return this.stylesCache[key];
+    }
+    return this.stylesCache["selected"];
+  }
+
   ngOnInit() {
     this.strategy = loadingstrategy.bbox;
     this.format = new GeoJSON();
     this._select = new Select({
       style: (feature) => {        
-        return this.stylesCache['selected'];
+        return this.getSelectedStyle(feature);
       },
       hitTolerance: 10,
       layers: [this.layer.instance as Layer]
     });
     this._hoverSelect = new Select({
       style: (feature) => {
-        return this.stylesCache['selected'];
+        return this.getSelectedStyle(feature);
       },
       hitTolerance: 10,
       condition: (e: MapBrowserEvent) => {
@@ -148,7 +156,7 @@ export class ItemVectorSourceComponent extends SourceVectorComponent implements
       for (const key in styles) {
         if (styles.hasOwnProperty(key)) {
           let style = styles[key];
-          if(style.geometry == null) {
+          if(style.geometry_ == null) {
             style.setGeometry((feature) => this.geometry(feature));
           }          
           this.stylesCache[key]=style;

projects/common-map/src/fm-map/components/map/map.component.ts

@@ -32,6 +32,7 @@ import {Extent,createEmpty,extend } from 'ol/extent';
 import {transform} from 'ol/proj';
 import { query } from '@angular/animations';
 import { tassign } from 'tassign';
+import * as style from 'ol/style';
 
 
 @Component({
@@ -156,6 +157,26 @@ export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
     this.query$.pipe(withLatestFrom(this.mapState$)).subscribe((state) => {
       this.replaceUrl(state[1], state[0],false);
     });
+    this.initCustomStyles();
+  }
+
+  initCustomStyles() {
+    this.store.dispatch(new mapActions.SetStyle('vnd.farmmaps.itemtype.layer',new style.Style({
+      stroke: new style.Stroke({
+        color: 'red',
+        lineDash: [ 5,5],
+        width: 1
+      }),
+      geometry:(feature) =>feature.getGeometry()
+    })));
+    this.store.dispatch(new mapActions.SetStyle('vnd.farmmaps.itemtype.layer_selected',new style.Style({
+      stroke: new style.Stroke({
+        color: 'red',
+        lineDash: [ 5,5],
+        width: 3
+      }),
+      geometry:(feature) =>feature.getGeometry()
+    })));
   }
 
   private stateSetCount: number = 0;