From 2f692a6b636da217ab4dcc525b2d101969e398b6 Mon Sep 17 00:00:00 2001
From: Ben Gunnewijk <b.gunnewijk@geonovum.nl>
Date: Wed, 14 Feb 2024 22:27:06 +0100
Subject: [PATCH] Switched default basemap to BRT - grijs

The rewrite to start with invisible pastel and OSM basemaps also improved the initial load time :)
---
 index.js            | 6 +++---
 scripts/basemaps.js | 6 ++++--
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/index.js b/index.js
index 2a978d0..e119432 100644
--- a/index.js
+++ b/index.js
@@ -21,10 +21,10 @@ async function main() {
   globalThis.map = map;
 
   // Add two Dutch basemap options for the Dutch example.
-  await addPDOKTileLayer(map, "grijs");
-  await addPDOKTileLayer(map, "pastel");
+  await addPDOKTileLayer(map, "grijs", true);
+  await addPDOKTileLayer(map, "pastel", false);
   // Add a global basemap for people who edit with data outside the Netherlands.
-  addOSMBaseLayer(map);
+  addOSMBaseLayer(map, false);
 
   addPopupToLayer(map);
 
diff --git a/scripts/basemaps.js b/scripts/basemaps.js
index 0922cf8..702b601 100644
--- a/scripts/basemaps.js
+++ b/scripts/basemaps.js
@@ -11,18 +11,19 @@ import { addOpenLayersTransformation } from "./openlayers-proj4.js";
 // URL https://service.pdok.nl//brt/achtergrondkaart/wmts/v2_0?request=GetCapabilities&service=WMTS
 // Source tileMatrixSet=EPSG:28992&crs=EPSG:28992&layers=pastel&styles=default&format=image/png&url=https://service.pdok.nl//brt/achtergrondkaart/wmts/v2_0?request%3DGetCapabilities%26service%3DWMTS
 
-export function addOSMBaseLayer(map) {
+export function addOSMBaseLayer(map, startVisible = true) {
   const tileLayer = new ol.layer.Tile({
     title: "OSM",
     type: "base",
     source: new ol.source.OSM(),
+    visible: startVisible,
   });
 
   map.addLayer(tileLayer);
   return tileLayer;
 }
 
-export async function addPDOKTileLayer(map, wmtsLayerId) {
+export async function addPDOKTileLayer(map, wmtsLayerId, startVisible = true) {
   const wmtsServiceURL =
     "https://service.pdok.nl/brt/achtergrondkaart/wmts/v2_0?request=GetCapabilities&service=WMTS";
 
@@ -76,6 +77,7 @@ export async function addPDOKTileLayer(map, wmtsLayerId) {
 
   const tileLayer = new ol.layer.Tile({
     source: new ol.source.WMTS(wmtsOptions),
+    visible: startVisible,
   });
 
   tileLayer.set("name", "PDOK - BRT " + wmtsLayerId);