Refactor getcolor
FarmMaps.Develop/FarmMapsLib/pipeline/head This commit looks good Details

2022.01
Willem Dantuma 2021-03-15 16:26:05 +01:00
parent f8a0e1e167
commit 5b710ce200
3 changed files with 58 additions and 35 deletions

18
package-lock.json generated
View File

@ -1865,25 +1865,25 @@
}
},
"@farmmaps/common": {
"version": "0.0.1-prerelease.563",
"resolved": "https://repository.akkerweb.nl/repository/npm-group/@farmmaps/common/-/common-0.0.1-prerelease.563.tgz",
"integrity": "sha512-XsPocXZm3/glNaaRF3ojzzbwILmM6HVW6lvLKMDUH/1deUB4EAlTbcj0O1hpkArcDfBs6lRvMXkWpbyT58fxmQ==",
"version": "0.0.1-prerelease.569",
"resolved": "https://repository.akkerweb.nl/repository/npm-group/@farmmaps/common/-/common-0.0.1-prerelease.569.tgz",
"integrity": "sha512-98PielIjWbn6J2AAIW7WgFcDGY1wI77MhhZDVy44TS5y0zo7tg0cgwcFARrhpFztGzFKSyhmt7+wySBNBovDGQ==",
"requires": {
"tslib": "^2.0.0"
}
},
"@farmmaps/common-map": {
"version": "0.0.1-prerelease.563",
"resolved": "https://repository.akkerweb.nl/repository/npm-group/@farmmaps/common-map/-/common-map-0.0.1-prerelease.563.tgz",
"integrity": "sha512-uxjRwwh/8Q/NHF86grwNUC8b0cyHrtAHeVuOYuAtLSjy/DA9k0+C3/S6LgOnvmP0K4Sempc81BLeDvN0eG0cGA==",
"version": "0.0.1-prerelease.569",
"resolved": "https://repository.akkerweb.nl/repository/npm-group/@farmmaps/common-map/-/common-map-0.0.1-prerelease.569.tgz",
"integrity": "sha512-3r0I0BB1XWqXVZ5nw5LxeytnMu0IJ/ltKrmJpMs+T86hqCQI+SWXAcvsZ+jnTS2waSzaIPMW+FVewIkX9hkzEA==",
"requires": {
"tslib": "^2.0.0"
}
},
"@farmmaps/common-map3d": {
"version": "0.0.1-prerelease.563",
"resolved": "https://repository.akkerweb.nl/repository/npm-group/@farmmaps/common-map3d/-/common-map3d-0.0.1-prerelease.563.tgz",
"integrity": "sha512-njlJgIjhpZll8Q1B/VSe7lwrM47Zc4V40jj8Eb2MVWwW7DrRVhf1qrqTbrNHbOzdi+0oy79/TUKQlYvmeVEkPQ==",
"version": "0.0.1-prerelease.569",
"resolved": "https://repository.akkerweb.nl/repository/npm-group/@farmmaps/common-map3d/-/common-map3d-0.0.1-prerelease.569.tgz",
"integrity": "sha512-Vn3DQBEuoPVVueqX97jrAJMUfrTPcjUOef8fhaqAh9dH5FIRSVWEQRYwVliGfuemiFtbTf/p/hgjB5J0nqaYLg==",
"requires": {
"tslib": "^2.0.0"
}

View File

@ -19,9 +19,9 @@
"@angular/platform-browser": "~10.2.4",
"@angular/platform-browser-dynamic": "~10.2.4",
"@angular/router": "~10.2.4",
"@farmmaps/common": ">=0.0.1-prerelease.563 <0.0.1",
"@farmmaps/common-map": ">=0.0.1-prerelease.563 <0.0.1",
"@farmmaps/common-map3d": ">=0.0.1-prerelease.563 <0.0.1",
"@farmmaps/common": ">=0.0.1-prerelease.569 <0.0.1",
"@farmmaps/common-map": ">=0.0.1-prerelease.569 <0.0.1",
"@farmmaps/common-map3d": ">=0.0.1-prerelease.569 <0.0.1",
"@microsoft/signalr": "^3.1.3",
"@ng-bootstrap/ng-bootstrap": "^7.0",
"@ngrx/effects": "^10.0",

View File

@ -3,7 +3,7 @@ import { LayerGroupComponent, MapComponent } from 'ngx-openlayers';
import { ItemService,IItem,AppConfig } from '@farmmaps/common';
import { IItemLayer, ITemporalItemLayer} from '../../../models/item.layer';
import { ILayerData} from '../../../models/layer.data';
import { IRenderoutputTiles,IRenderoutputImage,IGradientstop,ILayer,IHistogram} from '../../../models/color.map';
import { IRenderoutputTiles,IRenderoutputImage,IGradientstop,ILayer,IHistogram,IColor} from '../../../models/color.map';
import {Extent} from 'ol/extent';
import Projection from 'ol/proj/Projection';
import * as proj from 'ol/proj';
@ -52,11 +52,8 @@ export class ItemLayersComponent extends LayerGroupComponent implements OnChange
return "#" + this.componentToHex(r) + this.componentToHex(g) + this.componentToHex(b) + this.componentToHex(a);
}
getColorFromGradient(item:IItem,layer: ILayer, feature): style.Style {
var value = layer.indexKey ? feature.get(layer.indexKey): feature.get(layer.name);
var key = item.code + "_" + value;
if(!this.styleCache[key]) {
var gradient: IGradientstop[] = layer.renderer.colorMap.gradient;
getColorFromGradient(layer: ILayer, value: number): IColor {
var gradient: IGradientstop[] = layer.renderer.colorMap.gradient;
var histogram: IHistogram = layer.renderer.band.histogram;
var index = (value - histogram.min) / histogram.max;
var min = gradient[0];
@ -68,27 +65,53 @@ export class ItemLayersComponent extends LayerGroupComponent implements OnChange
}
var i = index - min.relativestop;
var size = max.relativestop - min.relativestop;
var alpha = Math.round( min.color.alpha + ((max.color.alpha - min.color.alpha) * i / size));
var alpha = Math.round(min.color.alpha + ((max.color.alpha - min.color.alpha) * i / size));
var red = Math.round(min.color.red + ((max.color.red - min.color.red) * i / size));
var green = Math.round(min.color.green + ((max.color.green - min.color.green) * i / size));
var blue = Math.round(min.color.blue + ((max.color.blue - min.color.blue) * i / size));
this.styleCache[key] = new style.Style(
{
image: new style.Circle({
fill: new style.Fill({
color: this.rgbaToHex(red,green,blue,alpha)
return { alpha: alpha, red: red, green: green, blue: blue };
}
getColorForValue(layer: ILayer, value: number): IColor {
var color: IColor = { alpha:0,red:0,green:0,blue:0};
layer.renderer.colorMap.entries.forEach((entry) => {
if(entry.value==value) {
color =entry.color;
return;
}
});
return color;
}
getColor(item: IItem, layer: ILayer, feature): style.Style {
var value = layer.indexKey ? feature.get(layer.indexKey) : feature.get(layer.name);
var key = item.code + "_" + value;
if (!this.styleCache[key]) {
var color: IColor;
if(layer.renderer.colorMap.colormapType == "manual") {
color = this.getColorForValue(layer, value);
} else {
color = this.getColorFromGradient(layer, value);
}
this.styleCache[key] = new style.Style(
{
image: new style.Circle({
fill: new style.Fill({
color: this.rgbaToHex(color.red, color.green, color.blue, color.alpha)
}),
radius: 3
}),
radius: 3
}),
fill: new style.Fill({
color: this.rgbaToHex(red, green, blue, alpha)
}),
stroke: new style.Stroke({
color: this.rgbaToHex(red, green, blue, 255),
width: 1.25
}),
});
fill: new style.Fill({
color: this.rgbaToHex(color.red, color.green, color.blue, color.alpha)
}),
stroke: new style.Stroke({
color: this.rgbaToHex(color.red, color.green, color.blue, 255),
width: 1.25
}),
});
}
return this.styleCache[key];
}
@ -133,7 +156,7 @@ export class ItemLayersComponent extends LayerGroupComponent implements OnChange
url: `${this._apiEndPoint}/api/v1/items/${item.code}/vectortiles/{z}/{x}/{y}.pbf?v=${Date.parse(item.updated)}`
}),
style: (feature) => {
return this.getColorFromGradient(item,l, feature);
return this.getColor(item,l, feature);
}
})
} else if (l && l.rendering && l.rendering.renderoutputType == "Tiles") {