1.1.3 • Published 7 months ago
@geosdi/ngx-leaflet-ping-layer-plugin v1.1.3
NgxLeafletPingLayer
This library was generated with Angular CLI version 13.0.0.
General information
Service to wrap leaflet ping layer. See documentation https://github.com/Asymmetrik/leaflet-d3
Installation
npm i @geosdi/ngx-leaflet-ping-layer-plugin --save
It depends on :
"@angular/common": ">=13.0.0",
"@angular/core": ">=13.0.0",
"typescript": ">=4.4.0",
"leaflet": ">=1.7.1",
"rxjs": "^7.4.0",
"@asymmetrik/leaflet-d3": ">=4.4.0",
"@asymmetrik/ngx-leaflet": ">=6.0.1",
"@asymmetrik/leaflet-d3": "^4.4.0",
Usage
import { Injectable } from '@angular/core';
import {NgxLeafletPingLayerPluginService} from "./ngx-leaflet-ping-layer-plugin.service";
@Injectable({
providedIn: 'root'
})
export class Service {
constructor(private lLeafletPingLayerPluginService: NgxLeafletPingLayerPluginService) {
}
public addPlugin() {
this.lLeafletPingLayerPluginService.withMap(this.map)
.withOpacityScale([1, 0])
.withRadiusScale([2, 18])
.withStyle('ping-blue')
.applyPingLayer();
this.lLeafletPingLayerPluginService.initPingLayer.next([15, 40]);
setTimeout(() => {
this.lLeafletPingLayerPluginService.stopPingLayer$.next(null);
}, 3000);
setTimeout(() => {
this.lLeafletPingLayerPluginService.initPingLayer.next([15, 40]);
}, 8000);
}
}
Methods
Method | action |
---|---|
withRadiusScale(radiusScale: number[]): INgxLeafletPingLayerService | the circle dimensions range |
withOpacityScale(opacityScale: number[]): INgxLeafletPingLayerService | the circle opacity range |
withStyle(style: string): INgxLeafletPingLayerService | css style class |
withMap(map: any): INgxLeafletPingLayerService | map to apply plugin |
applyPingLayer(): void | add plugin |
Events
Event | action |
---|---|
initPingLayer: Subject<number[]> | lng and lat to put ping layer on map |
stopPingLayer$: Subject> | stop ping layer |