Skip to content
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/geojson-update-data.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte-maplibre-gl': minor
---

Add `dataDiff` prop to `GeoJSONSource` for incremental updates via MapLibre's `updateData()` API. Property-only changes skip the full geojson-vt re-tile, significantly improving performance for large datasets.
5 changes: 3 additions & 2 deletions svelte-maplibre-gl/src/lib/sources/GeoJSONSource.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,12 @@
interface Props extends Omit<maplibregl.GeoJSONSourceSpecification, 'type'> {
id?: string;
source?: maplibregl.GeoJSONSource;
dataDiff?: maplibregl.GeoJSONSourceDiff;
children?: Snippet;
}
let { source = $bindable(undefined), id, children, ...spec }: Props = $props();
let { source = $bindable(undefined), id, children, dataDiff, ...spec }: Props = $props();
</script>

<RawSource {id} bind:source type="geojson" {...spec}>
<RawSource {id} bind:source type="geojson" {dataDiff} {...spec}>
{@render children?.()}
</RawSource>
12 changes: 10 additions & 2 deletions svelte-maplibre-gl/src/lib/sources/RawSource.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,10 @@
type Props = {
id?: string;
source?: Source;
dataDiff?: maplibregl.GeoJSONSourceDiff;
children?: Snippet;
} & Specs;
let { source = $bindable(undefined), id: _id, children, ...spec }: Props = $props();
let { source = $bindable(undefined), id: _id, children, dataDiff, ...spec }: Props = $props();
spec = spec as Specs;

const mapCtx = getMapContext();
Expand Down Expand Up @@ -92,11 +93,18 @@
if (source && spec.type === 'geojson') {
spec.data;
if (!firstRun) {
// TODO: support diffrential update ? (updateData)
(source as maplibregl.GeoJSONSource).setData(spec.data);
}
}
});
$effect(() => {
if (source && spec.type === 'geojson') {
dataDiff;
if (!firstRun && dataDiff) {
(source as maplibregl.GeoJSONSource).updateData(dataDiff);
Comment thread
samtalki marked this conversation as resolved.
Outdated
}
}
});
Comment thread
samtalki marked this conversation as resolved.
Comment thread
samtalki marked this conversation as resolved.
$effect(() => {
if (source && spec.type === 'geojson') {
spec.cluster;
Expand Down
Loading