add zone, add popup address, add popup zone, add remove marker, add close popup
This commit is contained in:
parent
db3ec6cddd
commit
849a6f07a0
GPG Key ID:
D5FB5A5715829326
5
.idea/codeStyles/codeStyleConfig.xml
Normal file
5
.idea/codeStyles/codeStyleConfig.xml
Normal file
@ -0,0 +1,5 @@
|
||||
<component name="ProjectCodeStyleConfiguration">
|
||||
<state>
|
||||
<option name="PREFERRED_PROJECT_CODE_STYLE" value="Default" />
|
||||
</state>
|
||||
</component>
|
||||
99
CLAUDE.md
Normal file
99
CLAUDE.md
Normal file
@ -0,0 +1,99 @@
|
||||
# CLAUDE.md
|
||||
|
||||
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
||||
|
||||
## Project Overview
|
||||
|
||||
`@svrnty/ngx-open-map-wrapper` is an Angular 16+ library that provides a unified map component with automatic fallback between MapLibre GL (WebGL vector maps) and Leaflet (raster maps). The library automatically detects WebGL support and chooses the optimal rendering engine.
|
||||
|
||||
## Architecture
|
||||
|
||||
### Adapter Pattern
|
||||
|
||||
The library uses the **Adapter pattern** to abstract away differences between MapLibre GL and Leaflet:
|
||||
|
||||
- **`IMapAdapter`** (map-adapter.interface.d.ts): Common interface defining map operations
|
||||
- **`LibreAdapter`** (libre-adapter.d.ts): MapLibre GL implementation
|
||||
- **`LeafletAdapter`** (leaflet-adapter.d.ts): Leaflet implementation
|
||||
- **`MapFacade`** (map-facade.d.ts): Facade that selects the appropriate adapter based on WebGL support and user preferences
|
||||
|
||||
### Component Structure
|
||||
|
||||
- **`OpenMapComponent`** (open-map.component.d.ts): Main Angular component that:
|
||||
- Uses `WebglDetectionDirective` to detect WebGL support
|
||||
- Initializes `MapFacade` with the appropriate adapter
|
||||
- Exposes a unified API via input signals and output events
|
||||
- Emits `mapReady` event with the `MapFacade` instance
|
||||
|
||||
- **`WebglDetectionDirective`** (webgl-detection.directive.d.ts): Directive that detects WebGL support on the user's device and emits the result
|
||||
|
||||
### Key Interfaces
|
||||
|
||||
**MapOptions**:
|
||||
- `center: LatLng` - [lat, lng] tuple
|
||||
- `zoom: number`
|
||||
- `styleUrl: string` - MapLibre style URL
|
||||
- `tileUrl: string` - Tile server URL for Leaflet
|
||||
|
||||
**Zone** (for delivery/shipping zones):
|
||||
- `id: string`
|
||||
- `name?: string`
|
||||
- `color?: string`
|
||||
- `opacity?: number`
|
||||
- `polygon: GeoPoint[]` - Array of {x, y} points
|
||||
- `shippingFee?: number`
|
||||
- `deliverySchedule?: string`
|
||||
|
||||
**Address** (for popup display):
|
||||
- `line1, line2, postalCode, subdivision, city, country`
|
||||
- `shippingFee?: number`
|
||||
- `deliverySchedule?: string`
|
||||
|
||||
### Core APIs
|
||||
|
||||
Both adapters implement:
|
||||
- `init(container, options)` - Initialize map
|
||||
- `setCenter(latLng)` - Pan to location
|
||||
- `setZoom(zoom)` - Set zoom level
|
||||
- `addMarker(latLng, options?)` - Add marker with optional id/color
|
||||
- `removeMarker(id?)` - Remove specific or all markers
|
||||
- `addZone(zones)` - Add delivery zones as polygons
|
||||
- `updateZone(zones)` - Update existing zones
|
||||
- `openPopup(address)` - Show address popup
|
||||
- `closePopup()` - Hide popup
|
||||
- `on(type, event)` - Event listener
|
||||
- `destroy()` - Cleanup
|
||||
|
||||
### Zoom Level Handling
|
||||
|
||||
The facade includes a `leafletZoomOffset` property because MapLibre GL and Leaflet use different zoom level scales. When using Leaflet, the facade adjusts zoom levels to maintain visual consistency.
|
||||
|
||||
## Development
|
||||
|
||||
This is a **compiled Angular library** (not a workspace with source code). The repository contains:
|
||||
- `/lib` - TypeScript declaration files (.d.ts)
|
||||
- `/fesm2022` - Compiled ES modules
|
||||
- `package.json` - Library metadata and peer dependencies
|
||||
|
||||
**Peer Dependencies**:
|
||||
- `@angular/common` and `@angular/core`: ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
|
||||
- `maplibre-gl`: ^5.0.0
|
||||
- `leaflet`: ^1.0.0 || ^2.0.0
|
||||
|
||||
**Installation**:
|
||||
```bash
|
||||
yarn add ngx-open-open-map-wrapper leaflet maplibre-gl
|
||||
```
|
||||
|
||||
**CSS Imports Required**:
|
||||
```css
|
||||
@import "leaflet/dist/leaflet.css";
|
||||
@import "maplibre-gl/dist/maplibre-gl.css";
|
||||
```
|
||||
|
||||
## Recent Changes (Current Branch: feature/zone)
|
||||
|
||||
Based on git status and recent commits:
|
||||
- Added `addZone()` and `updateZone()` methods to `IMapAdapter` interface
|
||||
- Both adapters now support zone management (delivery/shipping zones as polygons)
|
||||
- Zone objects include shipping fees and delivery schedules for e-commerce use cases
|
||||
@ -1,4 +1,4 @@
|
||||
import { Map, NavigationControl, Marker, GeoJSONSource } from 'maplibre-gl';
|
||||
import {Map, NavigationControl, Marker, Popup} from 'maplibre-gl';
|
||||
import { Map as Map$1, TileLayer, Marker as Marker$1 } from 'leaflet';
|
||||
import * as i0 from '@angular/core';
|
||||
import { inject, PLATFORM_ID, output, Directive, Injector, input, runInInjectionContext, effect, ViewChild, Component } from '@angular/core';
|
||||
@ -11,6 +11,9 @@ function getLngLat(latLng) {
|
||||
|
||||
class LibreAdapter {
|
||||
map;
|
||||
deliveryCheckMarker;
|
||||
popup;
|
||||
markers = {};
|
||||
init(container, options) {
|
||||
this.map = new Map({
|
||||
container,
|
||||
@ -27,9 +30,41 @@ class LibreAdapter {
|
||||
this.map.setZoom(zoom);
|
||||
}
|
||||
addMarker(latLng, options) {
|
||||
new Marker({ color: options?.color || 'red' })
|
||||
.setLngLat(getLngLat(latLng))
|
||||
const coords = getLngLat(latLng);
|
||||
|
||||
if (options.id) {
|
||||
if (this.markers[options.id]) {
|
||||
this.markers[options.id].remove();
|
||||
}
|
||||
|
||||
const marker = new Marker({ color: options.color || 'red' })
|
||||
.setLngLat(coords)
|
||||
.addTo(this.map);
|
||||
this.markers[options.id] = marker;
|
||||
} else {
|
||||
if (this.deliveryCheckMarker) {
|
||||
this.deliveryCheckMarker.remove();
|
||||
}
|
||||
this.deliveryCheckMarker = new Marker({ color: options?.color || 'red' })
|
||||
.setLngLat(coords)
|
||||
.addTo(this.map);
|
||||
}
|
||||
}
|
||||
removeMarker(id) {
|
||||
if (id) {
|
||||
if (this.markers[id]) {
|
||||
this.markers[id].remove();
|
||||
delete this.markers[id];
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
if (this.deliveryCheckMarker)
|
||||
{
|
||||
this.deliveryCheckMarker.remove();
|
||||
this.deliveryCheckMarker = undefined;
|
||||
}
|
||||
}
|
||||
}
|
||||
destroy() {
|
||||
this.map.remove();
|
||||
@ -50,7 +85,8 @@ class LibreAdapter {
|
||||
properties: {
|
||||
id: zone.id,
|
||||
name: zone.name,
|
||||
color: zone.color ? `#${zone.color}` : '#ff0000',
|
||||
color: zone.color ? zone.color : '#ff0000',
|
||||
opacity: zone.opacity ? zone.opacity : 0.4,
|
||||
},
|
||||
geometry: {
|
||||
type: 'Polygon',
|
||||
@ -64,29 +100,29 @@ class LibreAdapter {
|
||||
features,
|
||||
};
|
||||
|
||||
if (this.map.getSource("delivery-zones")) {
|
||||
(this.map.getSource("delivery-zones").setData(geojson));
|
||||
if (this.map.getSource("zones")) {
|
||||
(this.map.getSource("zones").setData(geojson));
|
||||
}
|
||||
else {
|
||||
this.map.addSource("delivery-zones", {
|
||||
this.map.addSource("zones", {
|
||||
type: "geojson",
|
||||
data: geojson,
|
||||
});
|
||||
|
||||
this.map.addLayer({
|
||||
id: "delivery-zones-fill",
|
||||
id: "zones-fill",
|
||||
type: "fill",
|
||||
source: "delivery-zones",
|
||||
source: "zones",
|
||||
paint: {
|
||||
"fill-color": ["get", "color"],
|
||||
"fill-opacity": 0.4,
|
||||
"fill-opacity": ["get", "opacity"],
|
||||
},
|
||||
});
|
||||
|
||||
this.map.addLayer({
|
||||
id: "delivery-zones-outline",
|
||||
id: "zones-outline",
|
||||
type: "line",
|
||||
source: "delivery-zones",
|
||||
source: "zones",
|
||||
paint: {
|
||||
"line-color": ["get", "color"],
|
||||
"line-width": 2,
|
||||
@ -94,10 +130,77 @@ class LibreAdapter {
|
||||
});
|
||||
}
|
||||
}
|
||||
openAddressPopup(address)
|
||||
{
|
||||
const bounds = this.map.getBounds();
|
||||
const corner = bounds.getNorthWest();
|
||||
this.closePopup();
|
||||
this.popup = new Popup({
|
||||
closeButton: false,
|
||||
closeOnClick: false,
|
||||
})
|
||||
.setLngLat([corner.lng, corner.lat])
|
||||
.setHTML(`
|
||||
<div class="delivery-address">
|
||||
<p>${address.line1}</p>
|
||||
${address.line2 ? `<p>${address.line2}</p>` : ''}
|
||||
<p>${address.city}, ${address.postalCode}</p>
|
||||
<p>${address.subdivision}, ${address.country}</p>
|
||||
${address.shippingFee ? `<p>Shipping ${address.shippingFee}</p>` : ''}
|
||||
${address.deliverySchedule ? `<p>Delivery time estimate ${address.deliverySchedule}</p>` : ''}
|
||||
</div>`)
|
||||
.addTo(this.map);
|
||||
|
||||
this.map.on('move', () => {
|
||||
if (this.popup) {
|
||||
const newBounds = this.map.getBounds();
|
||||
const newCorner = newBounds.getNorthWest();
|
||||
this.popup.setLngLat([newCorner.lng, newCorner.lat]);
|
||||
}
|
||||
});
|
||||
}
|
||||
openZonePopup(zone)
|
||||
{
|
||||
let sumLng = 0;
|
||||
let sumLat = 0;
|
||||
zone.polygon.forEach(point => {
|
||||
sumLng += point.y;
|
||||
sumLat += point.x;
|
||||
});
|
||||
const centerLng = sumLng / zone.polygon.length;
|
||||
const centerLat = sumLat / zone.polygon.length;
|
||||
|
||||
this.closePopup();
|
||||
this.popup = new Popup({
|
||||
closeButton: true,
|
||||
closeOnClick: false,
|
||||
})
|
||||
.setLngLat([centerLng, centerLat])
|
||||
.setHTML(`
|
||||
<div class="delivery-zone">
|
||||
${zone.name ? `<p><strong>${zone.name}</strong></p>` : ''}
|
||||
${zone.shippingFee ? `<p>Shipping: ${zone.shippingFee}$</p>` : ''}
|
||||
${zone.deliverySchedule ? `<p>Delivery: ${zone.deliverySchedule}</p>` : ''}
|
||||
</div>`)
|
||||
.addTo(this.map);
|
||||
}
|
||||
closePopup()
|
||||
{
|
||||
if (this.popup) {
|
||||
this.popup.remove();
|
||||
this.popup = undefined;
|
||||
}
|
||||
}
|
||||
on(type, event,){
|
||||
this.map.on(type, event);
|
||||
}
|
||||
}
|
||||
|
||||
class LeafletAdapter {
|
||||
map;
|
||||
deliveryCheckMarker;
|
||||
markers = {};
|
||||
popup;
|
||||
init(container, options) {
|
||||
this.map = new Map$1(container).setView(options.center, options.zoom);
|
||||
new TileLayer(options.tileUrl, {
|
||||
@ -112,8 +215,33 @@ class LeafletAdapter {
|
||||
this.map.setZoom(zoom);
|
||||
}
|
||||
addMarker(latLng, options) {
|
||||
const marker = new Marker$1(latLng);
|
||||
if (options.id) {
|
||||
if (this.markers[options.id]) {
|
||||
this.map.removeLayer(this.markers[options.id]);
|
||||
}
|
||||
const marker = new Marker$1(latLng)
|
||||
marker.addTo(this.map);
|
||||
this.markers[options.id] = marker;
|
||||
} else {
|
||||
if (this.deliveryCheckMarker) {
|
||||
this.map.removeLayer(this.deliveryCheckMarker);
|
||||
}
|
||||
this.deliveryCheckMarker = new Marker$1(latLng).addTo(this.map);
|
||||
}
|
||||
}
|
||||
|
||||
removeMarker(id) {
|
||||
if (id) {
|
||||
if (this.markers[id]) {
|
||||
this.map.removeLayer(this.markers[id]);
|
||||
delete this.markers[id];
|
||||
}
|
||||
} else {
|
||||
if (this.deliveryCheckMarker) {
|
||||
this.map.removeLayer(this.deliveryCheckMarker);
|
||||
this.deliveryCheckMarker = undefined;
|
||||
}
|
||||
}
|
||||
}
|
||||
destroy() {
|
||||
this.map.remove();
|
||||
@ -124,19 +252,99 @@ class LeafletAdapter {
|
||||
updateZone(zones) {
|
||||
for(let zone of zones)
|
||||
{
|
||||
const polygon = zone.polygon.map((geoPoint) => {
|
||||
const latlngs = zone.polygon.map((geoPoint) => {
|
||||
return new LatLng(geoPoint.x, geoPoint.y);
|
||||
});
|
||||
let color = "red"
|
||||
let color = "#ff0000"
|
||||
let opacity = 0.4;
|
||||
if(zone.color)
|
||||
color = `#${zone.color}`;
|
||||
color = zone.color;
|
||||
|
||||
this.map.polygon.push(L.polygon(polygon, {
|
||||
color
|
||||
})
|
||||
.addTo(this.map));
|
||||
if (zone.opacity)
|
||||
opacity = zone.opacity;
|
||||
|
||||
const polygon = L.polygon(latlngs, { color, fillOpacity: opacity })
|
||||
.addTo(this.map);
|
||||
}
|
||||
}
|
||||
openAddressPopup(address)
|
||||
{
|
||||
const bounds = this.map.getBounds();
|
||||
const corner = bounds.getNorthEast();
|
||||
|
||||
if (this.popup) {
|
||||
this.map.removeLayer(this.popup);
|
||||
}
|
||||
|
||||
this.popup = new Marker$1(corner, {
|
||||
opacity: 0
|
||||
})
|
||||
.addTo(this.map)
|
||||
.bindTooltip(`
|
||||
<div class="delivery-address">
|
||||
<p>${address.line1}</p>
|
||||
${address.line2 ? `<p>${address.line2}</p>` : ''}
|
||||
<p>${address.city}, ${address.postalCode}</p>
|
||||
<p>${address.subdivision}, ${address.country}</p>
|
||||
${address.shippingFee ? `<p>Shipping ${address.shippingFee}</p>` : ''}
|
||||
${address.deliverySchedule ? `<p>Delivery time estimate ${address.deliverySchedule}</p>` : ''}
|
||||
</div>`,
|
||||
{
|
||||
permanent: true,
|
||||
offset: [-38, 135]
|
||||
})
|
||||
.openTooltip();
|
||||
|
||||
this.map.on('move', () => {
|
||||
if (this.popup) {
|
||||
const newBounds = this.map.getBounds();
|
||||
const newCorner = newBounds.getNorthEast();
|
||||
this.popup.setLatLng(newCorner);
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
openZonePopup(zone)
|
||||
{
|
||||
let sumLat = 0;
|
||||
let sumLng = 0;
|
||||
zone.polygon.forEach(point => {
|
||||
sumLat += point.x;
|
||||
sumLng += point.y;
|
||||
});
|
||||
const centerLat = sumLat / zone.polygon.length;
|
||||
const centerLng = sumLng / zone.polygon.length;
|
||||
|
||||
if (this.popup) {
|
||||
this.map.removeLayer(this.popup);
|
||||
}
|
||||
|
||||
this.popup = new Marker$1([centerLat, centerLng], {
|
||||
opacity: 0
|
||||
})
|
||||
.addTo(this.map)
|
||||
.bindTooltip(`
|
||||
<div class="delivery-zone">
|
||||
${zone.name ? `<p><strong>${zone.name}</strong></p>` : ''}
|
||||
${zone.shippingFee ? `<p>Shipping: ${zone.shippingFee}</p>` : ''}
|
||||
${zone.deliverySchedule ? `<p>Delivery: ${zone.deliverySchedule}</p>` : ''}
|
||||
</div>`,
|
||||
{
|
||||
permanent: true,
|
||||
offset: [0, 0]
|
||||
})
|
||||
.openTooltip();
|
||||
}
|
||||
closePopup()
|
||||
{
|
||||
if (this.popup) {
|
||||
this.map.removeLayer(this.popup);
|
||||
this.popup = undefined;
|
||||
}
|
||||
}
|
||||
on(type, event) {
|
||||
this.map.on(type, event);
|
||||
}
|
||||
}
|
||||
|
||||
class MapFacade {
|
||||
@ -166,14 +374,29 @@ class MapFacade {
|
||||
addMarker(latLng, options) {
|
||||
this.adapter.addMarker(latLng, options);
|
||||
}
|
||||
removeMarker() {
|
||||
this.adapter.removeMarker();
|
||||
}
|
||||
destroy() {
|
||||
this.adapter.destroy();
|
||||
}
|
||||
addZone(deliveryZones) {
|
||||
this.adapter.addZone(deliveryZones);
|
||||
addZone(zones) {
|
||||
this.adapter.addZone(zones);
|
||||
}
|
||||
updateZone(deliveryZones) {
|
||||
this.adapter.updateZone(deliveryZones);
|
||||
updateZone(zones) {
|
||||
this.adapter.updateZone(zones);
|
||||
}
|
||||
openAddressPopup(deliveryAddress) {
|
||||
this.adapter.openAddressPopup(deliveryAddress);
|
||||
}
|
||||
openZonePopup(zone) {
|
||||
this.adapter.openZonePopup(zone);
|
||||
}
|
||||
closePopup() {
|
||||
this.adapter.closePopup();
|
||||
}
|
||||
on(type, event,){
|
||||
this.adapter.on(type, event);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
18
lib/adapters/leaflet-adapter.d.ts
vendored
18
lib/adapters/leaflet-adapter.d.ts
vendored
@ -1,13 +1,19 @@
|
||||
import {DeliveryZone, IMapAdapter, LatLng, MapOptions} from './map-adapter.interface';
|
||||
import {Zone, IMapAdapter, LatLng, MapOptions, Address} from './map-adapter.interface';
|
||||
export declare class LeafletAdapter implements IMapAdapter {
|
||||
private map;
|
||||
private deliveryCheckMarker?;
|
||||
private markers?: {};
|
||||
private popup?;
|
||||
init(container: HTMLElement, options: MapOptions): void;
|
||||
setCenter(latLng: LatLng): void;
|
||||
setZoom(zoom: number): void;
|
||||
addMarker(latLng: LatLng, options?: {
|
||||
color?: string;
|
||||
}): void;
|
||||
addMarker(latLng: LatLng, options?: { id?: string; color?: string }): void;
|
||||
removeMarker(id?: string): void;
|
||||
destroy(): void;
|
||||
addZone(zone: DeliveryZone[]): void;
|
||||
updateZone(one: DeliveryZone[]): void;
|
||||
addZone(zone: Zone[]): void;
|
||||
updateZone(zone: Zone[]): void;
|
||||
openZonePopup(zone: Zone) : void
|
||||
openAddressPopup(address: Address): void;
|
||||
closePopup(): void;
|
||||
on(type: string, event: (e: any) => void): void;
|
||||
}
|
||||
|
||||
18
lib/adapters/libre-adapter.d.ts
vendored
18
lib/adapters/libre-adapter.d.ts
vendored
@ -1,13 +1,19 @@
|
||||
import {DeliveryZone, IMapAdapter, LatLng, MapOptions} from './map-adapter.interface';
|
||||
import {Address, IMapAdapter, LatLng, MapOptions, Zone} from './map-adapter.interface';
|
||||
export declare class LibreAdapter implements IMapAdapter {
|
||||
private map;
|
||||
private deliveryCheckMarker?;
|
||||
private markers?: {};
|
||||
private popup?;
|
||||
init(container: HTMLElement, options: MapOptions): void;
|
||||
setCenter(latLng: LatLng): void;
|
||||
setZoom(zoom: number): void;
|
||||
addMarker(latLng: LatLng, options?: {
|
||||
color?: string;
|
||||
}): void;
|
||||
addMarker(latLng: LatLng, options?: { id?: string; color?: string }): void;
|
||||
removeMarker(id?: string): void;
|
||||
destroy(): void;
|
||||
addZone(zone: DeliveryZone[]): void;
|
||||
updateZone(one: DeliveryZone[]): void;
|
||||
addZone(zone: Zone[]): void;
|
||||
updateZone(zone: Zone[]): void;
|
||||
openZonePopup(zone: Zone) : void
|
||||
openAddressPopup(address: Address): void;
|
||||
closePopup(): void;
|
||||
on(type: string, event: (e: any) => void): void;
|
||||
}
|
||||
|
||||
35
lib/adapters/map-adapter.interface.d.ts
vendored
35
lib/adapters/map-adapter.interface.d.ts
vendored
@ -1,5 +1,4 @@
|
||||
import * as maplibregl from 'maplibre-gl';
|
||||
import * as L from 'leaflet';
|
||||
|
||||
export interface MapOptions {
|
||||
center: LatLng;
|
||||
zoom: number;
|
||||
@ -10,11 +9,24 @@ export interface GeoPoint {
|
||||
x: number;
|
||||
y: number;
|
||||
}
|
||||
export interface DeliveryZone {
|
||||
export interface Zone {
|
||||
id: string;
|
||||
name?: string;
|
||||
color?: string;
|
||||
opacity?: number;
|
||||
polygon: GeoPoint[];
|
||||
shippingFee?: number;
|
||||
deliverySchedule?: string;
|
||||
}
|
||||
export interface Address {
|
||||
line1: string;
|
||||
line2?: string;
|
||||
postalCode: string;
|
||||
subdivision: string;
|
||||
city: string;
|
||||
country: string;
|
||||
shippingFee?: number;
|
||||
deliverySchedule?: string;
|
||||
}
|
||||
|
||||
export type LatLng = [number, number];
|
||||
@ -23,10 +35,17 @@ export interface IMapAdapter {
|
||||
init(container: HTMLElement, options: MapOptions): void;
|
||||
setCenter(latLng: LatLng): void;
|
||||
setZoom(zoom: number): void;
|
||||
addMarker(latLng: LatLng, options?: {
|
||||
color?: string;
|
||||
}): void;
|
||||
addMarker(latLng: LatLng, options?: { id?: string; color?: string }): void;
|
||||
removeMarker(id?: string): void;
|
||||
destroy(): void;
|
||||
addZone(zone: DeliveryZone[]): void;
|
||||
updateZone(one: DeliveryZone[]): void;
|
||||
addZone(zone: Zone[]): void;
|
||||
updateZone(zone: Zone[]): void;
|
||||
openZonePopup(zone: Zone) : void
|
||||
openAddressPopup(address: Address): void;
|
||||
closePopup(): void;
|
||||
on(
|
||||
type: string,
|
||||
event: (e: any) => void,
|
||||
): void;
|
||||
|
||||
}
|
||||
|
||||
15
lib/adapters/map-facade.d.ts
vendored
15
lib/adapters/map-facade.d.ts
vendored
@ -1,4 +1,4 @@
|
||||
import {IMapAdapter, MapOptions, LatLng, DeliveryZone} from './map-adapter.interface';
|
||||
import {IMapAdapter, MapOptions, LatLng, Zone, Address} from './map-adapter.interface';
|
||||
export declare class MapFacade implements IMapAdapter {
|
||||
private readonly adapter;
|
||||
private readonly leafletZoomOffset;
|
||||
@ -6,10 +6,13 @@ export declare class MapFacade implements IMapAdapter {
|
||||
init(container: HTMLElement, options: MapOptions): void;
|
||||
setCenter(latLng: LatLng): void;
|
||||
setZoom(zoom: number): void;
|
||||
addMarker(latLng: LatLng, options?: {
|
||||
color?: string;
|
||||
}): void;
|
||||
addMarker(latLng: LatLng, options?: { id?: string; color?: string }): void;
|
||||
removeMarker(id?: string): void;
|
||||
destroy(): void;
|
||||
addZone(zone: DeliveryZone[]): void;
|
||||
updateZone(one: DeliveryZone[]): void;
|
||||
addZone(zone: Zone[]): void;
|
||||
updateZone(zone: Zone[]): void;
|
||||
openZonePopup(zone: Zone) : void
|
||||
openAddressPopup(address: Address): void;
|
||||
closePopup(): void;
|
||||
on(type: string, event: (e: any) => void): void;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user