1

フランスに集中する約 80,000 のマーカーのマップを管理する必要があります。そのために、ビューポートの境界を取得し、ビューポート内のマーカーを含む動的 JSON (PHP を使用) を呼び出すことにしました。そして、これは「アイドル」イベントです。

このソリューションで問題に直面しました。確かに、すでに存在するマーカーは（同じ位置に）再プロットされたため、結果としてマップの重みがなくなりました...

それを解決するために、新しいマーカーのみをプロットするために、JSON クエリの前後のマーカー リストが比較されます (jQuery のおかげです)。そしてそれはうまくいきます！

ここで、現在マップに表示されていないマーカーを削除したいと思います。または、マーカーのタイトルでもあるIDで指定されたマーカーのリスト（jQueryのおかげで取得できます）。では、どうすればそのようなマーカーを削除できますか? MarkerManager を使用していることを指定します。

そうしないと、これらのマーカーを削除しないと、場合によっては再プロットされると思います...たとえば、都市 A を表示しているときに、マップを移動して都市 B を表示すると、元の場所に戻ります。都市A...

コードは次のとおりです。

var map;
var mgr;
var markers = [];

function initialize(){

    var mapOptions = {
        zoom: 6,
        center: new google.maps.LatLng(46.679594, 2.109375)
    };
    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

    var mgrOptions = { borderPadding: 50, maxZoom: 15, trackMarkers: false };

    mgr = new MarkerManager(map, mgrOptions);

    google.maps.event.addListener(map, 'idle', function() {
        mapEvent();
    });

}

function mapEvent(){
    if( map.getZoom() >= 8 ){
        var bounds = map.getBounds();
        getSupports(bounds.getNorthEast(), bounds.getSouthWest());
    } else {
        // Todo
    }
}


var markerslistID = new Array();
var markerslistData = {};

function getSupports(ne, sw){

    newMarkerslistID = new Array();
    newMarkerslistData = {};

    // Getting the markers of the current view
    $.getJSON('./markerslist.php?nelat='+ne.lat()+'&nelng='+ne.lng()+'&swlat='+sw.lat()+'&swlng='+sw.lng(), function(data) {

        for (var i = 0; i < data.points.length; i++) {
            var val = data.points[i];

            newMarkerslistID.push(val.id);
            newMarkerslistData[val.id] = new Array(val.lat, val.lng, val.icon);
        }

        // List of New Markers TO PLOT
        var diffNewMarkers = $(newMarkerslistID).not(markerslistID).get();
        // List of Old markers TO REMOVE
        var diffOldMarkers = $(markerslistID).not(newMarkerslistID).get();

        // Plotting the NEW MARKERS
        for( var i = 0; i < diffNewMarkers.length; i++ ){
            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(newMarkerslistData[diffNewMarkers[i]][0], newMarkerslistData[diffNewMarkers[i]][1]),
                title : diffNewMarkers[i],
                icon : './images/'+newMarkerslistData[diffNewMarkers[i]][2]+'.png'
            });

            mgr.addMarker(marker, 0);

        }

        /*****************************************
        HERE WE HAVE TO REMOVE
        THE MARKERS CONTAINED IN diffOldMarkers
        *****************************************/

        mgr.refresh();

        // Switching the new list to the old, for the next event 
        markerslistID = newMarkerslistID;
        markerslistData = newMarkerslistData;

    });
}

ご協力ありがとうございました。

4

1 に答える 1

3

現在のビューポートにないすべてのマーカーを非表示にするワンライナー。 

!map.getBounds().contains(marker.getPosition()) && marker.setVisible(false);

または、

if (map.getBounds().contains(marker.getPosition()) && !marker.getVisible()) {
    marker.setVisible(true);
} 
else if (!map.getBounds().contains(marker.getPosition()) && marker.getVisible()) {
    marker.setVisible(false);
}
于 2014-01-23T15:36:40.973 に答える