maplibregl.addProtocol("cog", MaplibreCOGProtocol.cogProtocol);

map.on("load", () => {
  map.addSource("imageSource", {
    type: "raster",
    url: `cog://http://localhost:5000/cog?year=${year}&pid=${pid}`,
    tileSize: 256,
    minzoom: 0,
  });

  map.addLayer({
    id: "imageLayer",
    source: "imageSource",
    type: "raster",
  });
});

document.addEventListener("DOMContentLoaded", function () {
  fetchDataForTable();
});