FarmMaps/FarmMapsLib
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Hide heading and tolerance on desktop
All checks were successful
FarmMaps.Develop/FarmMapsLib/pipeline/head This commit looks good
Details

Browse Source
This commit is contained in:
Willem Dantuma 2021-02-01 08:34:17 +01:00
parent 0c44beabe0
commit d9a42ca75a
5 changed files with 17 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
projects/common-map/src/fm-map/components/aol/gps-location/gps-location.component.html
View File

@ -6,8 +6,8 @@
<stop offset="100%" class="stop2" /> <stop offset="100%" class="stop2" />
</linearGradient> </linearGradient>
</defs> </defs>
<circle class="tolerance" cx="500" cy="500" stroke="none" [attr.r]="locTolerancePixels" /> <circle class="tolerance hidden" [class]="{'hidden':!showTolerance}" cx="500" cy="500" stroke="none" [attr.r]="locTolerancePixels" />
<path *ngIf="showHeading" class="heading" stroke="none" [attr.d]="path" fill="url(#grad1)" [attr.transform]="rotate"></path> <path class="heading hidden" [class]="{'hidden': !showHeading }" stroke="none" [attr.d]="path" fill="url(#grad1)" [attr.transform]="rotate"></path>
<circle class="border" cx="500" cy="500" r="7" stroke="none" /> <circle class="border" cx="500" cy="500" r="7" stroke="none" />
<circle class="center" cx="500" cy="500" r="6" stroke="none" /> <circle class="center" cx="500" cy="500" r="6" stroke="none" />

8
projects/common-map/src/fm-map/components/aol/gps-location/gps-location.component.scss
View File

@ -9,11 +9,19 @@
stroke-width: 0; stroke-width: 0;
} }
.heading.hidden {
display: none;
}
.tolerance { .tolerance {
fill: $primary; fill: $primary;
fill-opacity:0.4; fill-opacity:0.4;
} }
.tolerance.hidden {
display: none
}
.border { .border {
fill: $white; fill: $white;
} }

1
projects/common-map/src/fm-map/components/aol/gps-location/gps-location.component.ts
View File

@ -17,6 +17,7 @@ export class GpsLocation implements OnInit,OnChanges{
@Input() location: number[]=[0,0]; @Input() location: number[]=[0,0];
@Input() locationTolerance: number = 0; @Input() locationTolerance: number = 0;
@Input() showHeading: boolean = false; @Input() showHeading: boolean = false;
@Input() showTolerance: boolean = false;
@Input() heading: number = 0; @Input() heading: number = 0;
@Input() headingTolerance: number = 0; @Input() headingTolerance: number = 0;
public locTolerancePixels: number = 0; public locTolerancePixels: number = 0;

2
projects/common-map/src/fm-map/components/map/map.component.html
View File

@ -39,7 +39,7 @@
<fm-map-item-source-vector [styles]="state.styles" [features]="state.features" (onFeatureSelected)="handleFeatureClick($event)" (onFeatureHover)="handleFeatureHover($event)" [selectedFeature]="state.selectedFeature" [selectedItem]="state.selectedItem"></fm-map-item-source-vector> <fm-map-item-source-vector [styles]="state.styles" [features]="state.features" (onFeatureSelected)="handleFeatureClick($event)" (onFeatureHover)="handleFeatureHover($event)" [selectedFeature]="state.selectedFeature" [selectedItem]="state.selectedItem"></fm-map-item-source-vector>
</aol-layer-vector> </aol-layer-vector>
<router-outlet name="map-layers"></router-outlet> <router-outlet name="map-layers"></router-outlet>
<fm-map-gps-location [position]="state.position" [headingTolerance]="20" [showHeading]="true" [heading]="state.compassHeading"></fm-map-gps-location> <fm-map-gps-location [position]="state.position" [headingTolerance]="20" [showHeading]="isMobile" [showTolerance]="isMobile" [heading]="state.compassHeading"></fm-map-gps-location>
<div class="control-container" > <div class="control-container" >
<router-outlet name="map-controls"></router-outlet> <router-outlet name="map-controls"></router-outlet>
<fm-map-layer-switcher></fm-map-layer-switcher> <fm-map-layer-switcher></fm-map-layer-switcher>

6
projects/common-map/src/fm-map/components/map/map.component.ts
View File

@ -4,6 +4,7 @@ import { Observable, Subject, Subscription, from,of ,EMPTY } from 'rxjs';
import { withLatestFrom, switchMap,skip } from 'rxjs/operators'; import { withLatestFrom, switchMap,skip } from 'rxjs/operators';
import { Router, ActivatedRoute, ParamMap } from '@angular/router'; import { Router, ActivatedRoute, ParamMap } from '@angular/router';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
import { DeviceService } from '@farmmaps/common';
//import { proj,Map } from 'openlayers'; //import { proj,Map } from 'openlayers';
// Map // Map
@ -83,6 +84,7 @@ export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
private lastUrl = ""; private lastUrl = "";
private initialized: boolean = false; private initialized: boolean = false;
public noContent: boolean = false; public noContent: boolean = false;
public isMobile = true;
@ViewChild('map') map; @ViewChild('map') map;
@ViewChild('contentDiv') contentDiv: ElementRef; @ViewChild('contentDiv') contentDiv: ElementRef;
@ -96,7 +98,8 @@ export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
private location: Location, private location: Location,
private geolocationService: GeolocationService, private geolocationService: GeolocationService,
private zone: NgZone, private zone: NgZone,
private deviceorientationService:DeviceOrientationService) { private deviceorientationService:DeviceOrientationService,
private devicesService:DeviceService) {
this.querySub = this.query$.pipe(skip(1), withLatestFrom(this.mapState$)).subscribe(([queryState,mapState]) =>{ this.querySub = this.query$.pipe(skip(1), withLatestFrom(this.mapState$)).subscribe(([queryState,mapState]) =>{
if(queryState) { if(queryState) {
let newQueryState = tassign(mapReducers.initialQueryState); let newQueryState = tassign(mapReducers.initialQueryState);
@ -171,6 +174,7 @@ export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
this.store.dispatch(new mapActions.Clear()); this.store.dispatch(new mapActions.Clear());
this.selectedFeatures$.next({x:0,y:0,features:[]}); this.selectedFeatures$.next({x:0,y:0,features:[]});
this.selectedFeatures$.next(null); this.selectedFeatures$.next(null);
this.isMobile = this.devicesService.IsMobile();
} }
initCustomStyles() { initCustomStyles() {