Toggle basemap (though it seems to lose the rendered thing before

clicking another button)
a-b-street · Dec 24, 2023 · 12ac548 · 12ac548
1 parent c810a62
commit 12ac548
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 8 deletions.
diff --git a/web/src/App.svelte b/web/src/App.svelte
@@ -13,14 +13,14 @@
   import { mapContents, sidebarContents } from "./stores";
   import ViewShortcutsMode from "./ViewShortcutsMode.svelte";
 
-  let offlineMode = true;
-  let mapStyle = offlineMode
-    ? {
+  let showBasemap = false;
+  $: mapStyle = showBasemap
+    ? "https://api.maptiler.com/maps/dataviz/style.json?key=MZEJTanw3WpxRvt7qDfo"
+    : {
         version: 8,
         sources: {},
         layers: [],
-      }
-    : "https://api.maptiler.com/maps/dataviz/style.json?key=MZEJTanw3WpxRvt7qDfo";
+      };
 
   type Mode =
     | {
@@ -85,6 +85,12 @@
       <MapLoader {map} bind:app />
     {/if}
     <div><button on:click={zoomToFit}>Zoom to fit</button></div>
+    <div>
+      <label
+        ><input type="checkbox" bind:checked={showBasemap} />Show basemap</label
+      >
+    </div>
+    <hr />
 
     <div bind:this={sidebarDiv} />
   </div>
@@ -101,7 +107,7 @@
             {map}
             {app}
             boundary={mode.boundary}
-            {offlineMode}
+            {showBasemap}
             bind:mode
           />
         {:else if mode.mode == "view-shortcuts"}

diff --git a/web/src/NeighbourhoodMode.svelte b/web/src/NeighbourhoodMode.svelte
@@ -25,7 +25,7 @@
   export let map: Map;
   export let app: LTN;
   export let boundary: Feature<Polygon>;
-  export let offlineMode: boolean;
+  export let showBasemap: boolean;
 
   let addingFilter = false;
   let undoLength = 0;
@@ -166,7 +166,7 @@
   <div slot="map">
     <GeoJSON data={details} generateId>
       <FillLayer
-        beforeId={offlineMode ? undefined : "Building"}
+        beforeId={showBasemap ? "Building" : undefined}
         filter={isPolygon}
         manageHoverState
         paint={{