37 lines
1.1 KiB
TypeScript
37 lines
1.1 KiB
TypeScript
import { AbstractLayer } from "esquisse"
|
|
import type { OsmMap } from "esquisse"
|
|
import type { GeoJSONSource } from "maplibre-gl"
|
|
import type { FeatureCollection } from "geojson"
|
|
|
|
/** Renders the located nodes as circle markers on the base map. */
|
|
export default class EventLayer extends AbstractLayer {
|
|
constructor({ map }: { map: OsmMap }) {
|
|
super({ map, visibleOnLoad: true })
|
|
|
|
this.addSource("events", {
|
|
type: "geojson",
|
|
data: { type: "FeatureCollection", features: [] },
|
|
})
|
|
|
|
this.addLayer({
|
|
id: "events",
|
|
type: "circle",
|
|
source: "events",
|
|
paint: { "circle-radius": 6, "circle-color": "#f00" },
|
|
})
|
|
}
|
|
|
|
/**
|
|
* Push a fresh feature set into the source. Wrapped in `onLoadOrNow` because
|
|
* `addSource` is itself deferred until load — this guarantees the source
|
|
* exists (as `custom-events`) before we reach for it, on first load and retry.
|
|
*/
|
|
setData(data: FeatureCollection) {
|
|
this.map.onLoadOrNow(() => {
|
|
const source = this.map.getSource("custom-events") as
|
|
| GeoJSONSource
|
|
| undefined
|
|
source?.setData(data)
|
|
})
|
|
}
|
|
}
|