Question

使用谷歌地图v3和一个小的jquery插件，我为用户创建了一个页面，在谷歌地图上添加点/标记。
到目前为止，这完美地运作现在，我需要改进此功能，并允许用户在地图上添加多个标记/点。
每个用户将被限制为他可以添加的特定点数这个数字对每个用户来说都是唯一的 - 所以它必须是可变的
我到目前为止使用的js代码就是这个。

$("#my_map").gmap3({
    map:{
        options:{
            center:[start_lat, start_long],
            zoom: start_zoom,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            mapTypeControl: true,
            mapTypeControlOptions:  {   style: google.maps.MapTypeControlStyle.DROPDOWN_MENU    },
            navigationControl: true,
            scrollwheel: true,
            streetViewControl: false
        },
        events:{                    
            click: function(map, event) // clicking on map adds a new marker
            {
                var lat = event.latLng.lat(), 
                    lng = event.latLng.lng();
                // save to form
                $("#map_lat").val(lat);
                $("#map_long").val(lng);
                $("#map_zoom").val( map.getZoom() );

                $(this).gmap3({
                    clear: { id: ["newTag"] }, // remove old/new tags (based on marker id value)
                    marker: { id: 'newTag', latLng: event.latLng } // add new marker on map
                });
            } // end click
        } // end event
    } // end map
});

map = $("#my_map").gmap3('get');
google.maps.event.trigger(map, 'resize');

start_lat，start_long，start_zoom是传递给函数的参数 map_lat，map_long，map_zoom是页面形式的ID - 点击地图填充这些字段。

现在，让我们假设我只想添加2个标记我可以在要填充的表单中生成适当的唯一ID 我可以在函数中传递另一个变量来了解标记的限制但是，如何修改点击事件以限制它们呢？
我希望这是有道理的

编辑：我已经设法以非优雅的方式做我的事。我想知道是否有更优雅的东西？

// assuming var maxItems=2 (argument in function
                for (var i=0; i<=maxItems; i++)
                {
                    if ( $("#map_lat"+i).val()=='' || $("#map_long"+i).val()=='' || $("#map_zoom"+i).val()==''      )
                    {
                        // populate form fields
                        $("#map_lat"+i).val(lat);
                        $("#map_long"+i).val(lng);
                        $("#map_zoom"+i).val( map.getZoom() );

                        $(this).gmap3({
                            clear: { id: ["newTag"+i] }, // remove old/new tags (based on marker id value)
                            marker: { id: 'newTag'+i, latLng: event.latLng } // add new marker on map
                        }); 

                        break;
                    }


}

Answer 1

您可以通过以下方式创建标记，并为用户管理单独的数组..

var markers = new Object();
function click_event(user_id)
{ 
    var marker = new google.maps.Marker({
      position:mycenter,
      title:infoName,
      id: count++
      // animation:google.maps.Animation.BOUNCE
      });

    markers[user_id].push(marker);

    display_markers(user_id, limit);
}

function display_markers(user_id, limit)
{
    remove_markers(); //remove all previous markers from map
    for( var i = 0; i < limit ; i++ )
    {
        markers[user_id][i].setMap(map); //will set limited markers for particular user
    }
}

限制gmap v3上添加标记的数量

1 个答案: