astro-leaflet/src/components/customElements/tilelayer.ts

Leaflet astro component, to display maps: Google Maps, Openstreetmap, maps from Michelin, googlemaps, Open Street Map...

// Copyright (c) Pascal Brand
// MIT License

import { tileLayer as LtileLayer } from "leaflet/dist/leaflet-src.esm"
import type { AstroLeafletTileLayerType } from '../../index'
import type { TileLayer } from 'leaflet'
import { getMapFromElement } from '../../index'

export class CustomElementTileLayer extends HTMLElement {
  leafletElement: TileLayer | undefined

  constructor() {
    super()
    const props: AstroLeafletTileLayerType = JSON.parse(this.dataset.props!)
    const map = getMapFromElement(this)
    if (map) {
      this.leafletElement = LtileLayer(props.urlTemplate, props.options).addTo(map!);
    }
  }
}