1

我插入了一条折线捕捉到道路。它工作正常。现在，我想在同一张地图中插入另一个分离的折线捕捉到道路。而且效果不好。它系统地将第一条折线的终点连接到第二条折线的起点。

谢谢你的帮助。

这是我的代码

function initialize() {

var pos = new google.maps.LatLng(-26.431228,-69.572755);

var myOptions = {
    zoom: 5,
    center: pos,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map(document.getElementById('map'), myOptions);

map.setCenter(pos);


//FIRST POLYLINE SNAP TO ROAD

ChileTrip1 = [
    new google.maps.LatLng(-33.417723,-70.605018),
    new google.maps.LatLng(-33.022446,-71.551688)
    ];

var traceChileTrip1 = new google.maps.Polyline({
    path: ChileTrip1,
    strokeColor: "red",
    strokeOpacity: 1.0,
    strokeWeight: 2
});

var service1 = new google.maps.DirectionsService(),traceChileTrip1,snap_path=[];
traceChileTrip1.setMap(map);
for(j=0;j<ChileTrip1.length-1;j++){
    service1.route({origin: ChileTrip1[j],destination: ChileTrip1[j+1],travelMode: google.maps.DirectionsTravelMode.DRIVING},function(result, status) {
        if(status == google.maps.DirectionsStatus.OK) {
            snap_path = snap_path.concat(result.routes[0].overview_path);
            traceChileTrip1.setPath(snap_path);
        }
    });
}

//SECOND POLYLINE SNAP TO ROAD

ChileTrip2 = [
    new google.maps.LatLng(-29.959694,-71.30825),
    new google.maps.LatLng(-32.778038,-71.181908)
];

var traceChileTrip2 = new google.maps.Polyline({
    path: ChileTrip2,
    strokeColor: "blue",
    strokeOpacity: 1.0,
    strokeWeight: 2
});

var service2 = new google.maps.DirectionsService(),traceChileTrip2,snap_path=[];
traceChileTrip2.setMap(map);
for(j=0;j<ChileTrip2.length-1;j++){
    service2.route({origin: ChileTrip2[j],destination: ChileTrip2[j+1],travelMode: google.maps.DirectionsTravelMode.DRIVING},function(result, status) {
        if(status == google.maps.DirectionsStatus.OK) {
            snap_path = snap_path.concat(result.routes[0].overview_path);
            traceChileTrip2.setPath(snap_path);
        }
    });
}

    };
    window.onload = function() { initialize();};
4

1 回答 1

4

DirectionsService 是异步的。在使用之前清除回调例程中的 snap_path 数组，或者创建 2 个单独的 snap_path 数组：

function initialize() {

var pos = new google.maps.LatLng(-26.431228,-69.572755);

var myOptions = {
    zoom: 5,
    center: pos,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map(document.getElementById('map'), myOptions);

map.setCenter(pos);


//FIRST POLYLINE SNAP TO ROAD

ChileTrip1 = [
    new google.maps.LatLng(-33.417723,-70.605018),
    new google.maps.LatLng(-33.022446,-71.551688)
    ];

var traceChileTrip1 = new google.maps.Polyline({
    path: ChileTrip1,
    strokeColor: "red",
    strokeOpacity: 1.0,
    strokeWeight: 2
});

var service1 = new google.maps.DirectionsService(),traceChileTrip1,snap_path1=[];
traceChileTrip1.setMap(map);
for(j=0;j<ChileTrip1.length-1;j++){
    service1.route({origin: ChileTrip1[j],destination: ChileTrip1[j+1],travelMode: google.maps.DirectionsTravelMode.DRIVING},function(result, status) {
        if(status == google.maps.DirectionsStatus.OK) {
            snap_path1 = snap_path1.concat(result.routes[0].overview_path);
            traceChileTrip1.setPath(snap_path1);
        } else alert("Directions request failed: "+status);        
    });
}

//SECOND POLYLINE SNAP TO ROAD

ChileTrip2 = [
    new google.maps.LatLng(-29.959694,-71.30825),
    new google.maps.LatLng(-32.778038,-71.181908)
];

var traceChileTrip2 = new google.maps.Polyline({
    path: ChileTrip2,
    strokeColor: "blue",
    strokeOpacity: 1.0,
    strokeWeight: 2
});

var service2 = new google.maps.DirectionsService(),traceChileTrip2,snap_path2=[];
traceChileTrip2.setMap(map);
for(j=0;j<ChileTrip2.length-1;j++){
    service2.route({origin: ChileTrip2[j],destination: ChileTrip2[j+1],travelMode: google.maps.DirectionsTravelMode.DRIVING},function(result, status) {
        if(status == google.maps.DirectionsStatus.OK) {
            snap_path2 = snap_path2.concat(result.routes[0].overview_path);
            traceChileTrip2.setPath(snap_path2);
        } else alert("Directions request failed: "+status);        
    });
}

    };
    window.onload = function() { initialize();};

工作示例

请注意，overview_path 是“简化的”，不一定遵循道路。如果您需要确切的路线，您需要处理所有的腿。

于 2013-08-01T12:53:20.243 回答