如何快速渲染多个gmap折线

时间:2017-08-21 15:41:43

标签: javascript google-maps maps

我有一些代码循环通过一系列航空公司航线和机场在每个机场放置标记并在它们之间绘制折线。当我有400条路线时,代码可以正常工作。当我将它扩展到完整的~3500ish路线时,它会停止近一分钟的渲染。有什么方法可以加快速度吗?

map.fitBounds(bounds);
var flightPath;
var flightPlanCoordinates;
$.each(routes, function(key, route) {
    flightPlanCoordinates = [];
    flightPlanCoordinates.push( markers[route.origincode].position );
    flightPlanCoordinates.push( markers[route.destinationcode].position );
    flightPath = new google.maps.Polyline({
        path: flightPlanCoordinates,
        geodesic: true,
        strokeColor: '#004494',
        strokeOpacity: 0.2,
        strokeWeight: 1
    });
    flightPath.setMap(map); //commenting this line speeds things back up
    google.maps.event.addListener(flightPath, 'mouseover', function (event) {
        this.setOptions({
            strokeOpacity: 1,
            strokeWeight: 2
        });
    });
    google.maps.event.addListener(flightPath, 'mouseout', function (event) {
        this.setOptions({
            strokeOpacity: 0.2,
            strokeWeight: 1
        });
    });
});

1 个答案:

答案 0 :(得分:0)

我建议您在json开始之前请求并解码背景中的方向MapsActivity数据。您还可以将解码LatLng存储在SharedPreferencd中(例如:1->(1.12,1.32),2->(1.32,2.52)),使其成为流数据,而不是存储所有日期。数组会花费你很多资源并降低运行速度。最后,从SharedPreferenced获取LatLng数据并使其痛苦。