mirrors/PMTiles
1
0
Fork 0
mirror of https://github.com/protomaps/PMTiles.git synced 2026-02-04 10:51:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

New viewer 4 (#559)

Browse Source 
app: viewer improvements [#49]

* show missing id when feature id is undefined instead of 0
* improve point symbology for dense point tilesets
* show lon,lat in popup
* better wrapping for long popup value strings
This commit is contained in:
Brandon Liu
2025-04-25 11:33:32 +08:00
committed by GitHub
parent ae4840fdf1
commit bb51c64b72
2 changed files with 23 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
app/src/FeatureTable.tsx
View File

@@ -1,9 +1,9 @@
import { For } from "solid-js";
import { For, Show } from "solid-js";
export interface InspectableFeature {
layerName: string;
type: number;
id: number;
id: number | undefined;
properties: { [key: string]: string | number | boolean };
}
@@ -15,21 +15,28 @@ const intToGeomType = (n: number) => {
export const FeatureTable = (props: { features: InspectableFeature[] }) => {
return (
<div class="max-h-120 overflow-y-scroll divide-y app-divide">
<div class="max-h-120 overflow-y-scroll max-w-200 divide-y app-divide">
<For each={props.features}>
{(f) => (
<div class="p-2">
<div>
{f.layerName} {intToGeomType(f.type)}
{f.layerName}{" "}
<span class="app-text-light">{intToGeomType(f.type)}</span>
</div>
<div class="text-xs font-mono app-text-light">
<Show when={f.id !== undefined} fallback={"missing ID"}>
ID {f.id}
</Show>
</div>
<div class="text-xs font-mono app-text-light">ID {f.id}</div>
<table class="font-mono table-auto border-separate border-spacing-x-2">
<tbody>
<For each={Object.entries(f.properties)}>
{([key, value]) => (
<tr>
<td class="text-right app-text-light">{key}</td>
<td>
<td class="text-right app-text-light break-keep">
{key}
</td>
<td class="break-all">
{typeof value === "boolean"
? JSON.stringify(value)
: value.toString()}