我正在使用谷歌地图API(V3),我在显示 15,000点左右的多边形时遇到一些问题,至少 10点精度在每一点。这些是天气和县地图,因此数据量自然很高。应该注意的是,我现在能够显示一个简单的多边形,并且使用相同的方法来添加具有大量数据的多边形,并且在JS控制台中查看它,我可以看到它已经被填充了。
有没有人有经验处理这样的事情(据推测),数据量正在发挥作用,而我正在达到一些我似乎无法在任何地方找到的限制?
我是否有更好的方法可以使用而不只是声明new google.maps.Polygon
中包含大量的点?
更新: 我正在使用的代码如下。页面启动时的内存使用量在Chrome中大约为160MB,我很好。当脚本运行时,只有几秒MB的峰值可能持续2秒。
function addPolygonToMap(WeatherAlert) {
WeatherAlert.WeatherAlert.googleCoordinateArray = [];
if(WeatherAlert.WeatherAlert.Coordinates.length > 0){
// WeatherAlert.WeatherAlert.Coordinates contains a string of all the coordinates.
$.each(WeatherAlert.WeatherAlert.Coordinates, function(key, value) {
// CleanPolygonData splits the coordinates and separates them further into an X and Y value.
var PolygonData = CleanPolygonData(value);
$.each(PolygonData, function(key, Polygon) {
WeatherAlert.WeatherAlert.googleCoordinateArray.push(new google.maps.LatLng(Polygon[0], Polygon[1]));
});
});
}
var HexColor = mapWeatherAlerts(WeatherAlert.WeatherAlert, window.WeatherAlertProperties);
var Polygon = new google.maps.Polygon({
WeatherAlert: WeatherAlert.WeatherAlert,
paths: WeatherAlert.WeatherAlert.googleCoordinateArray,
strokeColor: '#' + HexColor,
strokeOpacity: 0.8,
strokeWeight: 1,
fillColor: '#' + HexColor,
fillOpacity: 0.4
});
Polygon.setMap(map);
window.MapPolygons.push(Polygon);
google.maps.event.addListener(Polygon, 'click', clickPolygon);
}