fix: sanitize invalid comparison style layers

web/kyushu_compare.html

@@ -82,14 +82,26 @@ const leftMap = new maplibregl.Map({
   container:"left-map",style:emptyStyle(),center:START.center,zoom:START.zoom,bearing:0,pitch:0,attributionControl:false
 });
 const rightMap = new maplibregl.Map({
-  container:"right-map",style:REFERENCE_STYLE,center:START.center,zoom:START.zoom,bearing:0,pitch:0,attributionControl:false
+  container:"right-map",style:emptyStyle(),center:START.center,zoom:START.zoom,bearing:0,pitch:0,attributionControl:false
 });
 leftMap.addControl(new maplibregl.NavigationControl(),"top-right");
 rightMap.addControl(new maplibregl.NavigationControl(),"top-right");
 let syncing=false;
 
-function cloneReferenceForLocal(){
+function sanitizeReferenceStyle(raw){
-  const style=JSON.parse(JSON.stringify(rightMap.getStyle()));
+  const style=JSON.parse(JSON.stringify(raw));
+  const sources=style.sources || {};
+  const removed=[];
+  style.layers=(style.layers || []).filter(function(layer){
+    if(!layer.source || sources[layer.source])return true;
+    removed.push(layer.id + " -> " + layer.source);
+    return false;
+  });
+  return {style:style,removed:removed};
+}
+
+function cloneReferenceForLocal(referenceStyle){
+  const style=JSON.parse(JSON.stringify(referenceStyle));
   const source=style.sources && style.sources.navsea_delivery;
   if(!source)throw new Error("参考 style 中找不到 sources.navsea_delivery");
   delete source.url;
@@ -103,19 +115,31 @@ function cloneReferenceForLocal(){
   return style;
 }
 
-rightMap.once("style.load",function(){
+async function loadComparisonStyles(){
-  setState(rightState,"参考 style 已加载","ok");
   try{
-    leftMap.setStyle(cloneReferenceForLocal());
+    setState(rightState,"下载并检查参考 style…","");
+    const response=await fetch(REFERENCE_STYLE,{cache:"no-store"});
+    if(!response.ok)throw new Error("HTTP " + response.status);
+    const raw=await response.json();
+    const checked=sanitizeReferenceStyle(raw);
+    const removedText=checked.removed.length
+      ? "；忽略无效 layer: " + checked.removed.join(", ")
+      : "";
+    rightMap.setStyle(checked.style);
+    leftMap.setStyle(cloneReferenceForLocal(checked.style));
+    setState(rightState,"参考 style 已加载" + removedText,"ok");
   }catch(err){
     console.error(err);
-    setState(leftState,"左侧初始化失败：" + (err.message || err),"err");
+    setState(rightState,"参考 style 加载失败：" + (err.message || err),"err");
+    setState(leftState,"等待有效参考 style","err");
   }
-});
+}
+
 leftMap.on("style.load",function(){
   const sources=Object.keys((leftMap.getStyle() || {}).sources || {});
   if(sources.includes("navsea_delivery"))setState(leftState,"Production v2 PBF 已接入","ok");
 });
+loadComparisonStyles();
 
 function cameraOf(map){
   const c=map.getCenter();