带有太多多边形的谷歌地图会导致 iOS 崩溃

Question

我有一个包含 400 多个多边形的 Google 地图，这些多边形包含 40.000 多个纬度/经度坐标。这些都是荷兰的自治市，结果可以在这里看到：http://silktool.com/maptest.php

它在台式机上运行良好（以 2.5MB / 500Kb gzipped 加载有点慢），但在 iOS 设备上打开 url 时，它会导致 Mobile Safari 崩溃（在 iOS 版 Chrome 中它可以工作）。

我怀疑这是因为它只是太多的代码或多边形。当我只加载一半的多边形时，Mobile Safari 不会崩溃。

我使用以下 Javasctipt 加载每个多边形：

var city1 = new google.maps.Polygon({
  paths: [
    new google.maps.LatLng(53.0873209365,6.79015076682),
    …many many latlng coordinates… 
    new google.maps.LatLng(53.0716361297,6.81423099069),
    new google.maps.LatLng(53.0873209365,6.79015076682)
  ],
  strokeColor: "#fff",
  strokeOpacity: 0.5,
  strokeWeight: 1,
  fillColor: "rgb(60,255,160)",
  fillOpacity: 0.7
});


var city2 = new google.maps.Polygon({
  paths: [
    new google.maps.LatLng(53.0873209365,6.79015076682),
    …many many latlng coordinates… 
    new google.maps.LatLng(53.0716361297,6.81423099069),
    new google.maps.LatLng(53.0873209365,6.79015076682)
  ],
  strokeColor: "#fff",
  strokeOpacity: 0.5,
  strokeWeight: 1,
  fillColor: "rgb(60,255,160)",
  fillOpacity: 0.7
});

我想让代码在 iOS 上不崩溃，想知道如何做到这一点？

我想了几个选项，但我不知道它们是否可行：

• 使代码更高效/更紧凑
• 不要使用 Google 地图，而是使用带有平滑选项的 Leaflet，以简化不同缩放级别的多边形 (http://leaflet.cloudmade.com/reference.html#polyline-options)
• 将坐标放入 Javascript 数组中（它们现在位于 PHP 数组中，并由此生成 javascript）。
• 更多选项？

我不知道该选择哪个选项，有什么想法吗？

Answer 1

您也可以尝试使用google.maps.KmlLayer。

您是否考虑过使用 Google Maps API v3 的新 KmlLayer？本质上，这里发生的事情是 Google 充当了获取任何公开可用的 KML 层的代理，并自动将其分解为图块。这个平铺层也可以响应与矢量图层非常相似的点击事件。 (link)

请参考similiar threadhttps://gis.stackexchange.com/。