-1
是否有可能针对特定标记的InfoWindow更新它?Google Maps API v3 - 如何更新标记的InfoWindow
单击标记时,将打开显示名称和地址的InfoWindow。它还将Lat和Long发送到PHP脚本,以便从地图上的div中的数据库中获取有关此Marker的更多详细信息。
我希望能够更新名称和地址使用这个离开地图的div,这是没有问题的 - 我坚持如何针对特定标记的InfoWindow来更新它与新的名称和地址,虽然。
我已经为每个标记添加了一个标识,但我不知道如何使用它(或者如果可能的话)以该标识为目标标记,并从发送信息的其他函数更新其InfoWindow数据库。
\t var map;
\t var map_center = {lat: <?=$map['lat']?>, lng: <?=$map['lng']?>};
\t var markers = [];
\t var infowindow = new google.maps.InfoWindow();
\t map_initialize(); // initialize google map
\t
\t //############### Google Map Initialize ##############
\t function map_initialize() {
var googleMapOptions = {
center: map_center, // map center
zoom: 15, //zoom level, 0 = earth view to higher value
panControl: true, //enable pan Control
zoomControl: true, //enable zoom control
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL //zoom control size
},
\t scaleControl: true, // enable scale control
mapTypeId: google.maps.MapTypeId.ROADMAP // google map type
};
map = new google.maps.Map(document.getElementById("map"), googleMapOptions);
$.getJSON("<?=$urlpath?>map_process.php", function(data) {
\t
\t \t \t \t $.each(data, function(key, val) {
\t \t \t \t \t \t var point \t = new google.maps.LatLng(parseFloat(val['lat']),parseFloat(val['lng']));
\t \t \t \t \t \t var name \t = val['name'];
\t \t \t \t \t \t var address \t = '<p>'+ val['address'] +'</p>';
\t \t \t \t \t \t var properties \t = val['properties'];
\t \t \t \t \t var id \t \t \t \t \t = val['id'];
\t \t \t \t \t
\t \t \t \t \t create_marker(point, name, address, false, false, "/images/pin_green.png", properties, id);
\t \t \t })
\t \t \t });
}
\t \t //############### Function create_marker ##############
\t \t
\t \t
\t \t function create_marker(MapPos, MapTitle, MapDesc, InfoOpenDefault, DragAble, iconPath, properties, id) {
\t
\t var this_id = 'marker_' + id;
\t \t
\t \t //new marker
\t \t var marker = new google.maps.Marker({
\t \t \t id: this_id,
\t position: MapPos,
\t map: map,
\t draggable: DragAble,
\t animation: google.maps.Animation.DROP,
\t title: MapTitle,
\t icon: iconPath,
\t properties: properties
\t \t });
\t \t
\t \t //Content structure of info Window for the Markers
\t \t var contentString = $('<div class="marker-info-win">'+
\t \t '<div class="marker-inner-win"><span class="info-content">'+
\t \t '<h1 class="marker-heading">'+MapTitle+'</h1>'+
\t \t MapDesc+
\t \t '</span>'+
\t \t '</div></div>');
\t \t \t google.maps.event.addListener(marker, 'click', function(event) {
\t \t \t infowindow.setContent(contentString[0]);
\t \t \t infowindow.open(map, marker);
\t \t \t
\t \t \t //############### Send latlng to right panel ##############
\t \t \t
\t \t \t var mLatLang = marker.getPosition().toUrlValue(); //get marker position
\t \t \t showRightPanel(mLatLang);
\t \t \t
\t \t \t });
\t \t \t \t \t \t
\t \t \t \t markers.push(marker);
\t \t \t } \t \t
\t \t \t function showRightPanel(mLatLang) { //function that will add markers on button click
\t \t \t
\t var myData = {latlang : mLatLang}; //post variables
\t $.ajax({
\t type: "POST",
\t url: "<?=$urlpath?>map_show_panel.php",
\t data: myData,
\t success:function(data){
\t \t $('#marker_result').html(data);
\t },
\t error:function (xhr, ajaxOptions, thrownError){
\t \t alert(thrownError); //throw any errors
\t }
\t });
\t \t \t
\t \t \t }
如果信息窗口已打开(添加到DOM),你可以使用普通的JavaScript/jQuery方法访问它中的HTML元素。 – geocodezip
也许我在问错误的问题。我希望能够更新与标记相关联的内容,因此如果稍后点击标记,它将显示此更新的内容,而不是最初使用var contentString =设置的内容.... – Ashley
我已经完成了解决方法我用ajax调用更新了infoWindow,但这并不是我想要发生的事情,它似乎是一个额外的调用,没有必要,我只需要在内容需要更新时执行它(很少) – Ashley