我有一个根据标记位置在数据库中保存航路点的项目,我想在这个标记上使用自定义图标,所以我抑制了路线标记(绿色标记)
但是如果我将标记移动到另一个点,它不会根据标记位置更改渲染线,我想在更改标记位置时“更新”此渲染器。
This is the link to my project with the original version 这是我的代码:(用我的尝试编辑)
var map, ren, ser;
var data = {};
var data2 = {};
var marker;
var infowindow;
var directionsDisplay;
var wayA = [];
var wayB = [];
var directionResult = [];
function goma()
{
var mapDiv = document.getElementById('mappy');
var mapOptions = {
zoom: 12,
center: new google.maps.LatLng(-23.563594, -46.654239),
mapTypeId : google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map( mapDiv, mapOptions );
google.maps.event.addListener(map, "click", function(event) {
if (wayA.length == wayB.length) {
wayA.push(new google.maps.Marker({
draggable: true,
position: event.latLng,
map: map
}));
} else {
wayB.push(new google.maps.Marker({
draggable: true,
position: event.latLng,
map: map
}));
ren = new google.maps.DirectionsRenderer( {'draggable':true, suppressMarkers : true} );
ren.setMap(map);
ren.setPanel(document.getElementById("directionsPanel"));
ser = new google.maps.DirectionsService();
ser.route({ 'origin': wayA[wayA.length-1].getPosition(), 'destination': wayB[wayB.length-1].getPosition(), 'travelMode': google.maps.DirectionsTravelMode.DRIVING},function(res,sts) {
if(sts=='OK') {
directionResult.push(res);
ren.setDirections(res);
} else {
directionResult.push(null);
}
});
}
});
}
最佳答案
我有一个 demo哪个可以满足您的需求。
你需要的改变在
directionsDisplay = new google.maps.DirectionsRenderer( {
'map': map,
'preserveViewport': true,
'draggable':true/*,
'suppressMarkers' : true */}
);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById("directionsPanel"));
directionsService = new google.maps.DirectionsService();
}
});
注意 suppressMarkers' : true
已被注释掉
这意味着当显示方向标记时,原始标记仍然存在。这些被删除使用
function clearOverlays() {
if (wayA) {
for (i in wayA) {
wayA[i].setMap(null);
}
}
if (wayB) {
for (i in wayB) {
wayB[i].setMap(null);
}
}
}
这在结束时调用
function calcRoute() {
directionsService.route({ 'origin': wayA[wayA.length-1].getPosition(), 'destination':
wayB[wayB.length-1].getPosition(), 'travelMode':
google.maps.DirectionsTravelMode.DRIVING},function(response,status) {
if(status == google.maps.DirectionsStatus.OK) {
directionResult.push(response);
directionsDisplay.setDirections(response);
} else {
directionResult.push(null);
}
})
clearOverlays();
}
关于google-maps-api-3 - 拖动标记时更改方向渲染的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12783190/