Google Maps JS：如何判断addGeoJson的所有要素加载完成？

Great question! 确实，addGeoJson不像loadGeoJson那样自带加载完成的回调，但其实它的特性可以帮我们轻松搞定这个问题——因为**addGeoJson是同步执行的**！

核心原理 #

loadGeoJson需要异步请求远程的GeoJSON文件，所以需要回调来确认加载完成；而addGeoJson接收的是已经在内存中的JavaScript对象（也就是你代码里的js_featured），它会一次性把所有要素处理并添加到Data图层中。当addGeoJson这行代码执行完毕时，所有要素已经完全就绪，直接在它后面写后续逻辑就可以了。

代码示例 #

基于你的原有代码，我们可以直接在addGeoJson之后执行后续功能，甚至可以利用它返回的要素数组来做更精准的处理：

// 初始化Data图层
lyr_featured = new google.maps.Data({map: map});
// 同步添加GeoJSON，返回已添加的要素数组
const addedFeatures = lyr_featured.addGeoJson(js_featured);

// 👇 这里直接执行后续功能，所有要素已经加载完成！
console.log(`成功加载 ${addedFeatures.length} 个要素`);

// 示例：给所有要素设置样式
lyr_featured.setStyle({
  fillColor: '#2ecc71',
  strokeColor: '#27ae60',
  strokeWeight: 2
});

// 示例：计算并适配所有要素的边界范围
const bounds = new google.maps.LatLngBounds();
addedFeatures.forEach(feature => {
  // 根据要素几何类型扩展边界
  const geometry = feature.getGeometry();
  switch(geometry.getType()) {
    case 'Point':
      bounds.extend(geometry.get());
      break;
    case 'Polygon':
      geometry.getArray().forEach(path => {
        path.getArray().forEach(point => bounds.extend(point));
      });
      break;
    // 可扩展处理LineString、MultiPoint等其他几何类型
  }
});
map.fitBounds(bounds);

特殊情况：异步获取GeoJSON数据 #

如果你的js_featured是通过异步请求（比如fetch、axios）获取的，只要确保在拿到数据后再调用addGeoJson，后续逻辑依然可以直接放在addGeoJson之后：

// 异步拉取GeoJSON数据
fetch('/your-geojson-api')
  .then(res => res.json())
  .then(js_featured => {
    lyr_featured = new google.maps.Data({map: map});
    const addedFeatures = lyr_featured.addGeoJson(js_featured);
    // 这里所有要素已加载，执行后续操作
    processFeatures(addedFeatures);
  })
  .catch(err => console.error('GeoJSON加载失败:', err));

function processFeatures(features) {
  // 你的后续处理逻辑
}

关键提示 #

addGeoJson返回的addedFeatures数组是已经添加到图层的要素集合，直接操作这个数组比调用lyr_featured.forEach()遍历整个图层更高效，尤其当图层数据量较大时。

内容的提问来源于stack exchange，提问作者user2470281