Peter Bastiani
c20754e10a
All checks were successful
FarmMaps.Develop/FarmMapsLib/pipeline/head This commit looks good
69 lines
2.2 KiB
HTML
69 lines
2.2 KiB
HTML
@if (showLegend()) {
|
|
<table class="container">
|
|
<tr>
|
|
<td colspan="3">
|
|
<div class="title">
|
|
@if (showTitle) {
|
|
<h4>{{layer.name}}</h4>
|
|
}
|
|
@if (layer.unit) {
|
|
<b>({{layer.unit}})</b>
|
|
}
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<a i18n-title title="more info"><i class="fal fa-info-circle text-primary" (click)="hideHistogramDetails = !hideHistogramDetails"></i></a>
|
|
</td>
|
|
<td colspan="2">
|
|
@if (histogramenabled) {
|
|
<div class="title">
|
|
<h4>{{histogram}}</h4>
|
|
@if (histogramunit) {
|
|
<b>({{histogramunit}})</b>
|
|
}
|
|
</div>
|
|
}
|
|
</td>
|
|
</tr>
|
|
@for (entry of layer.renderer.colorMap.entries; track $index; let i = $index) {
|
|
<tr>
|
|
<td class="legend-items"><span [style.background-color]="getAlphaHex(entry.color)" [style.border-color]="getHex(entry.color)"class="color"></span></td>
|
|
<td class="legend-items-text">@if (!entry.label) {
|
|
<span>{{getScaledValue(entry.value,layer.scale) | number:'1.0-2'}} {{legendunit}}</span>
|
|
}@if (entry.label) {
|
|
<span>{{entry.label}}</span>
|
|
}</td>
|
|
<td class="histogram-items">
|
|
@if (showHistogram()) {
|
|
<div>
|
|
<span class="bar" [style.background-color]="getHex(entry.color)" [style.width]="getPart(layer.renderer, i)">
|
|
</span>
|
|
@if (getPercentage(layer.renderer,i); as percentage) {
|
|
<span class="bar-label">{{percentage | number:'1.0-2'}} %</span>
|
|
}
|
|
</div>
|
|
}
|
|
</td>
|
|
</tr>
|
|
}
|
|
@if (showHistogram()) {
|
|
<tr>
|
|
<td colspan="4" class="pb-1 pt-1">
|
|
<div class="info" [ngbCollapse]="hideHistogramDetails">
|
|
@if (bandContainsStatistics()) {
|
|
<fm-map-statistics-details [statistics]="layer.renderer.band.statistics" [scale]="layer.scale"></fm-map-statistics-details>
|
|
} @else {
|
|
<fm-map-histogram-details [histogram]="layer.renderer.band.histogram" [scale]="layer.scale"></fm-map-histogram-details>
|
|
}
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
}
|
|
</table>
|
|
}
|
|
|
|
|
|
|
|
|
|
|