缩小谷歌地图的活动?

时间:2014-07-09 11:42:11

标签: javascript google-maps zoom google-maps-markers

我正在尝试在地图上维护一组恒定的样本标记,以便于查看。在平移和缩放期间,我使用从数据库中随机选择的标记填充我的地图,直到某个数字。主要问题是用新的标记入境替换落在界外的标记。

除了缩小之外,下面的代码工作得很好。 当我缩小时,我希望使用一组新的随机标记重复刷新地图,最多可达一定数量并均匀分布在地图上。问题是有一个zoom_changed事件,但它似乎没有区分进出。

有什么建议吗?

      google.maps.event.addListener(map, 'idle', function() {
            bounds = map.getBounds();
            var southWest = bounds.getSouthWest();
            var northEast = bounds.getNorthEast();
            var north = northEast.lat();
            var south = southWest.lat();
            var west = southWest.lng();
            var east = northEast.lat();
            var marnum = 20;
            $.post('pzparsers/pzparsers.php', {north:north, south:south, west:west, east:east, marnum:marnum}, function(response){
                eval(response);
                bounds = map.getBounds();
                if(oldmarkers.length == 0 && newmarkers.length !== 0){
                    //b = $.extend( true, {}, a );
                    for (var i = 0; i < newmarkers.length; i++) {
                        oldmarkers[i] = newmarkers[i];
                        oldmarkers[i].setMap(map);
                    }
                } else if (oldmarkers.length !== 0 && newmarkers.length !== 0){
                    for (var i = 0; i < oldmarkers.length; i++){
                        if(!bounds.contains(oldmarkers[i].getPosition())){
                            oldmarkers[i].setMap(null);
                            oldmarkers[i] = newmarkers[i];
                            oldmarkers[i].setMap(map);
                        }
                    }
                }                       
            }); 
        });

php: -

  $output .= "newmarkers.length = 0;\n";
    if($mrk_cnt > 0){
        for ($lcnt = 0; $lcnt < $mrk_cnt; $lcnt++){
            $output .= "var point = new google.maps.LatLng($lat[$lcnt], $lng[$lcnt]);\n";
            $output .= "var mrktx = \"$inf[$lcnt]\";\n";
            $output .= "var infowindow = new google.maps.InfoWindow({ content: mrktx });\n";
            $output .= "var marker = new google.maps.Marker({position: point, icon: $icon[$lcnt], title: '$inf[$lcnt]  $begin[$lcnt] - $end[$lcnt]'});\n";
            $output .= "google.maps.event.addListener(marker,'click', function() {infowindow.open(map,marker);});\n";
            //$output .= "marker.setMap(map);\n";       
            $output .= "newmarkers.push(marker);\n";
        }
    }

3 个答案:

答案 0 :(得分:1)

缩放更改事件谷歌地图

google.maps.event.addListener(map, 'zoom_changed', function() {
    var zoomLevel = map.getZoom();
    map.setCenter(myLatLng);
    infowindow.setContent('Zoom: ' + zoomLevel);
});

在这里阅读更多

https://developers.google.com/maps/documentation/javascript/events

答案 1 :(得分:1)

如果没有内置功能,请制作一个。请尝试以下方法:

var mapzoom;

function initialize()
{

    //first get the zoom value of the map in initialize function
    mapzoom=map.getZoom();
}

google.maps.event.addListener(map, 'zoom_changed', function() {

    var zoomLevel = map.getZoom();

    if(mapzoom> zoomLevel)
    {
        //means zoom out do your code here

    }

    mapzoom=map.getZoom(); //to stored the current zoom level of the map

});

答案 2 :(得分:0)

谢谢,我实现了如下(&#39; if(zoomDiff&lt; 0)&#39;)。但是,标记的放置存在间歇性的问题。这些数据是由php返回的,但有时它并没有被加载到地图上。关于什么可能是错误的时机的任何线索?

      function pan_zoom(){
            google.maps.event.addListener(map, 'idle', function() {
                bounds = map.getBounds();
                var southWest = bounds.getSouthWest();
                var northEast = bounds.getNorthEast();
                var north = northEast.lat();
                var south = southWest.lat();
                var west = southWest.lng();
                var east = northEast.lng();
                var marnum = 3;
                newZoom = map.getZoom();
                zoomDiff = newZoom - oldZoom;
                oldZoom = newZoom;
                if(zoomDiff < 0){
                    for(var index in oldmarkers) {
                        oldmarkers[index].setMap(null);
                        delete oldmarkers[index];
                    }
                    var fetchsize = marnum;
                } else {
                    for(var index in oldmarkers) {
                        if(!bounds.contains(oldmarkers[index].getPosition())){
                            oldmarkers[index].setMap(null);
                            delete oldmarkers[index];
                        }
                    }
                    oldsize = Object.size(oldmarkers);
                    var fetchsize = marnum - oldsize;
                }
                $.post('pzparsers/pzparsers.php', {north:north, south:south, west:west, east:east, fetchsize:fetchsize}, function(response){
                    document.getElementById('search_results').innerHTML = north+' '+south+' '+west+' '+east;
                    document.getElementById('search_results').innerHTML += response;
                    eval(response);
                    for(var index in newmarkers) {
                        oldmarkers[index] = newmarkers[index];
                        oldmarkers[index].setMap(map);
                    }           
                }); 
            });
        }