Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support tilejson #364

Merged
merged 2 commits into from
Jan 20, 2025
Merged

Support tilejson #364

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2fc6283
refactor to support basemaps TileJSON in addition to PMTiles.
bdon Jan 20, 2025
462ff3b
Support TileJSON in addition to PMTiles for basemaps.
bdon Jan 20, 2025
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
104 changes: 59 additions & 45 deletions app/src/MapView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import {
setRTLTextPlugin,
} from "maplibre-gl";
import type {
LngLatBoundsLike,
MapGeoJSONFeature,
MapTouchEvent,
StyleSpecification,
Expand Down Expand Up @@ -299,19 +300,17 @@ function MapLibreView(props: {
map.on("idle", () => {
setZoom(map.getZoom());
setError(undefined);
memoizedArchive()
?.getMetadata()
.then((metadata) => {
if (metadata) {
const m = metadata as {
version?: string;
"planetiler:osm:osmosisreplicationtime"?: string;
};
setTimelinessInfo(
`tiles@${m.version} ${m["planetiler:osm:osmosisreplicationtime"]?.substr(0, 10)}`,
);
}
});
archiveInfo().then((i) => {
if (i?.metadata) {
const m = i.metadata as {
version?: string;
"planetiler:osm:osmosisreplicationtime"?: string;
};
setTimelinessInfo(
`tiles@${m.version} ${m["planetiler:osm:osmosisreplicationtime"]?.substr(0, 10)}`,
);
}
});
});

const showContextMenu = (e: MapTouchEvent) => {
Expand Down Expand Up @@ -365,34 +364,51 @@ function MapLibreView(props: {
});

// ensure the dropped archive is first added to the protocol
const memoizedArchive = () => {
const archiveInfo = async (): Promise<
{ metadata: unknown; bounds: LngLatBoundsLike } | undefined
> => {
if (!props.droppedArchive && props.tiles?.endsWith(".json")) {
const resp = await fetch(props.tiles);
const tileJson = await resp.json();
return {
metadata: tileJson,
bounds: [
[tileJson.bounds[0], tileJson.bounds[1]],
[tileJson.bounds[2], tileJson.bounds[3]],
],
};
}

const p = protocolRef();
if (p) {
if (props.droppedArchive) {
p.add(props.droppedArchive);
return props.droppedArchive;
}
if (props.tiles) {
let archive = p.tiles.get(props.tiles);
let archive = props.droppedArchive;
if (archive) {
p.add(archive);
} else if (props.tiles) {
archive = p.tiles.get(props.tiles);
if (!archive) {
archive = new PMTiles(props.tiles);
p.add(archive);
}
return archive;
}
if (archive) {
const metadata = await archive.getMetadata();
const header = await archive.getHeader();
return {
metadata: metadata,
bounds: [
[header.minLon, header.minLat],
[header.maxLon, header.maxLat],
],
};
}
}
};

const fit = async () => {
const header = await memoizedArchive()?.getHeader();
if (header) {
mapRef?.fitBounds(
[
[header.minLon, header.minLat],
[header.maxLon, header.maxLat],
],
{ animate: false },
);
const bounds = (await archiveInfo())?.bounds;
if (bounds) {
mapRef?.fitBounds(bounds, { animate: false });
}
};

Expand All @@ -411,22 +427,20 @@ function MapLibreView(props: {
const styleMajorVersion = props.npmVersion
? +props.npmVersion.split(".")[0]
: STYLE_MAJOR_VERSION;
memoizedArchive()
?.getMetadata()
.then((m) => {
if (m instanceof Object && "version" in m) {
const tilesetVersion = +(m.version as string).split(".")[0];
if (
VERSION_COMPATIBILITY[tilesetVersion].indexOf(styleMajorVersion) < 0
) {
setMismatch(
`style v${styleMajorVersion} may not be compatible with tileset v${tilesetVersion}. `,
);
} else {
setMismatch("");
}
archiveInfo().then((i) => {
if (i && i.metadata instanceof Object && "version" in i.metadata) {
const tilesetVersion = +(i.metadata.version as string).split(".")[0];
if (
VERSION_COMPATIBILITY[tilesetVersion].indexOf(styleMajorVersion) < 0
) {
setMismatch(
`style v${styleMajorVersion} may not be compatible with tileset v${tilesetVersion}. `,
);
} else {
setMismatch("");
}
});
}
});
});

createEffect(() => {
Expand Down
Loading