从 Google 地图上显示的 KMZ 存档中删除非 KML 项目

Question

我正在使用 google.maps.KmlLayer 在 Google 地图上加载 KMZ。 KMZ 包含一个 KML 图层和一些图像文件。我只想在我的地图上显示 KML 文件，但图像文件也会被添加。

有什么方法可以从使用 google.maps.KmlLayer 显示的 KMZ 存档中删除非 KML 元素（如 PNG 文件）？我似乎无法在 DOM 中找到作为元素的 PNG，否则我会以这种方式隐藏或删除它们。

一种可能的解决方案是将 KMZ 下载到服务器，仅提取 KML 文件，然后将其添加到地图中。但如果可能的话，我想尽量将其保留在客户端。

这是一个包含两个 PNG 文件的 KMZ 存档示例（在这种情况下，我只想删除其中一个，legend.png）：

var map;

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    zoom: 2,
    mapTypeId: google.maps.MapTypeId.TERRAIN,
    center: {
      lat: 41.876,
      lng: -87.624
    }
  });

}

initMap();

var kmlUrl = 'https://www.weather.gov/source/crh/shapefiles/wwa.kmz';
var kmlOptions = {
  suppressInfoWindows: true,
  preserveViewport: false,
  map: map
};
var kmlLayer = new google.maps.KmlLayer(kmlUrl, kmlOptions);

<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<div id="map" style="min-width: 800px; min-height: 660px"></div>

Answer 1

根据文档，有一个 KmlOptions 属性禁用 ScreenOverlays 的显示：

screenOverlays
Type: boolean
Whether to render the screen overlays. Default true.

将其设置为 true 会删除该图例。

var map;

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    zoom: 2,
    mapTypeId: google.maps.MapTypeId.TERRAIN,
    center: {
      lat: 41.876,
      lng: -87.624
    }
  });

}

initMap();

var kmlUrl = 'https://www.weather.gov/source/crh/shapefiles/wwa.kmz';
var kmlOptions = {
  suppressInfoWindows: true,
  preserveViewport: false,
  map: map,
  screenOverlays: false
};
var kmlLayer = new google.maps.KmlLayer(kmlUrl, kmlOptions);

html,
body,
#map {
  height: 100%;
  width: 100%;
  padding: 0px;
  margin: 0px;
}

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="map"></div>

从 Google 地图上显示的 KMZ 存档中删除非 KML 项目

Remove non-KML item from KMZ archive displayed on Google Map

google-maps

kml

kmz

google-maps-api-3