Blame view

src/components/road-map.component.ts 841 Bytes
e74fdc9c   Yarik   Button
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
  import { Component, Input, AfterViewInit } from '@angular/core';
  import * as L from 'leaflet';
  
  @Component({
      // tslint:disable-next-line:component-selector
      selector: 'road-map',
      template: '<div id="{{identificator}}" [style.height]="getHeight()" ></div>',
  })
  export class RoadMapComponent implements AfterViewInit {
      protected isVisible: boolean = false;
      protected map: L.Map;
      @Input() identificator: string = 'mapID';
  
      public ngAfterViewInit(): void {
          this.map = L.map(this.identificator).setView([51.505, -0.09], 13);
          L.tileLayer('https://a.tile.openstreetmap.org/{z}/{x}/{y}.png', {
              maxZoom: 18,
          }).addTo(this.map);
      }
      public showMap(): void {
          this.isVisible = true;
      }
      public getHeight(): string {
          return this.isVisible ? '100%' : '0';
      }
  }