Use refactored styles

This commit is contained in:
Willem Dantuma
2020-02-12 21:33:28 +01:00
parent 6379b64351
commit 937dbe9b43
5 changed files with 35 additions and 16 deletions

View File

@@ -14,7 +14,7 @@ import {Vector,Cluster} from 'ol/source';
import {Layer} from 'ol/layer';
import {GeoJSON} from 'ol/format';
import {Select} from 'ol/interaction';
import {IStyleCache} from '../../../models/style.cache';
import {IStyles} from '../../../models/style.cache';
import {FeatureIconService} from '../../../services/feature-icon.service';
@Component({
@@ -33,8 +33,9 @@ export class ItemVectorSourceComponent extends SourceVectorComponent implements
@Input() features: Array<Feature>;
@Input() selectedFeature: Feature;
@Input() selectedItem: IItem;
@Input() styles:IStyles;
@Output() onFeaturesSelected: EventEmitter<Feature> = new EventEmitter<Feature>();
private styleCache:IStyleCache = {};
private stylesCache:IStyles = {};
constructor(@Host() private layer: LayerVectorComponent, private itemService: ItemService, @Host() private map: MapComponent, private itemTypeService: ItemTypeService,private featureIconService$:FeatureIconService) {
super(layer);
@@ -58,14 +59,14 @@ export class ItemVectorSourceComponent extends SourceVectorComponent implements
this.format = new GeoJSON();
this._select = new Select({
style: (feature) => {
return this.styleCache['selected'];
return this.stylesCache['selected'];
},
hitTolerance: 10,
layers: [this.layer.instance as Layer]
});
this._hoverSelect = new Select({
style: (feature) => {
return this.styleCache['selected'];
return this.stylesCache['selected'];
},
hitTolerance: 10,
condition: (e: MapBrowserEvent) => {
@@ -87,12 +88,12 @@ export class ItemVectorSourceComponent extends SourceVectorComponent implements
this.host.instance.setStyle((feature) => {
var key = feature.get('itemType') + (this.selectedItem?"_I":"");
if (!this.styleCache[key]) {
if (!this.stylesCache[key]) {
if (this.itemTypeService.itemTypes[key]) {
let itemType = this.itemTypeService.itemTypes[key];
let fillColor = color.asArray(itemType.iconColor);
fillColor[3] = this.selectedItem?0:0.5;
this.styleCache[key] = new style.Style({
this.stylesCache[key] = new style.Style({
image: itemType.icon ? new style.Icon({
anchor: [0.5, 1],
scale: 0.05,
@@ -105,13 +106,13 @@ export class ItemVectorSourceComponent extends SourceVectorComponent implements
fill: new style.Fill({
color: fillColor
}),
geometry:(feature) => this.geometry(feature)
});
} else {
key = 'file';
}
}
var styleEntry = this.styleCache[key];
styleEntry.geometry = (feature) => this.geometry(feature);
var styleEntry = this.stylesCache[key];
return styleEntry;
});
}
@@ -142,5 +143,17 @@ export class ItemVectorSourceComponent extends SourceVectorComponent implements
this.map.instance.addInteraction(this._hoverSelect);
}
}
if (changes["styles"] && this.instance) {
let styles = changes["styles"].currentValue;
for (const key in styles) {
if (styles.hasOwnProperty(key)) {
let style = styles[key];
if(style.geometry == null) {
style.setGeometry((feature) => this.geometry(feature));
}
this.stylesCache[key]=style;
}
}
}
}
}