0

特定の場所に移動できるおかげで、Googleマップv3を使用するサイトに取り組んでいます

Web サイト - http://dev.fama.net.pl/walendia/lokalizacja.html

サイトの上部にある入力に「szczecin」と入力し、送信をクリックします - マーカーが地図に表示されます。次に「warszawa」と入力します - 新しいマーカーが地図に表示されますが、古いマーカーはまだそこにあります。以前のマーカーを削除する方法地図のマーカー

グーグルマップコード

var map;
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var geocoder = new google.maps.Geocoder();
var stepDisplay;
var markersArray = [];
var iconSize = new google.maps.Size(158,59);
var iconOrigin = new google.maps.Point(0,0);
var iconAnchor = new google.maps.Point(20,59);

function initialize(center, zoom) {

    directionsDisplay = new google.maps.DirectionsRenderer({suppressMarkers: true});

    var mapOptions = {
        zoom: zoom,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        panControl: false,
        zoomControl: true,
        zoomControlOptions: {
            style: google.maps.ZoomControlStyle.LARGE,
            position: google.maps.ControlPosition.TOP_RIGHT
        }
    }

    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

    directionsDisplay.setMap(map);
    directionsDisplay.setPanel(document.getElementById('directions-panel'));

    geocoder.geocode({address: center}, function(results, status) {
        map.setCenter(results[0].geometry.location);
    });

}

function addMarker(location, icon) {

    geocoder.geocode({address: location}, function(results, status) {

        marker = new google.maps.Marker({
            position: results[0].geometry.location,
            map: map,
            icon: icon
        });

        google.maps.event.addListener(marker);

        markersArray.push(marker);

    });
}

function addMarker2(position, icon) {

    var location = new google.maps.LatLng(52.08901624831595, 20.854395031929016);
    var icon = {
        url: 'http://dev.fama.net.pl/walendia/img/markers/end.png',
        size: iconSize,
        origin: iconOrigin,
        anchor: iconAnchor
    }   

    marker = new google.maps.Marker({
        position: location,
        map: map,
        icon: icon
    });

    markersArray.push(marker);

}

function calcRoute(start, end) {
    var start = start;
    var end = end;
    var request = {
        origin: start,
        destination: end,
        travelMode: google.maps.TravelMode.DRIVING
    };

    directionsService.route(request, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {

            var location = start;
            var icon = {
                url: 'http://dev.fama.net.pl/walendia/img/markers/start.png',
                size: iconSize,
                origin: iconOrigin,
                anchor: iconAnchor
            }

            addMarker(location, icon);
            addMarker2(location, icon);

            directionsDisplay.setDirections(result);
        }
    });    
}

// SET CENTER ON RESIZE
google.maps.event.addDomListener(window, "resize", function() {
    var center = map.getCenter();
    google.maps.event.trigger(map, "resize");
    map.setCenter(center); 
    directionsDisplay.setMap(map);
});

$(document).ready(function() {
    $('.form-box form').submit(function() {
        var start = $(this).find('input[name="start"]').val();
        var end = new google.maps.LatLng(52.08901624831595, 20.854395031929016);
        directionsDisplay.setMap(map);
        calcRoute(start, end);

        return false;
    });
});

HTMLコード

$(document).ready(function() {
    initialize('Łączności 131, 05-552 Łazy, Polska', 10);
    addMarker2(location);
});
4

1 に答える 1

1

2 番目のマーカーを追加する前に、 からマーカーを削除する必要がありますmarkersArray。次の関数を使用して、配列からマーカーを削除します。

function deleteMarkers() {
  if (markersArray) {
   for (i=0; i < markersArray.length; i++) {
        markersArray[i].setMap(null);
    }
markersArray.length = 0;
}
}

DEMO FIDDLE

注：ボタンをクリックしたときにマーカーを削除して表示するサンプルをいくつか取りました。必要に応じてこれらの機能を使用してください。

于 2013-09-06T09:19:41.630 に答える