我使用谷歌地图的实现,在地图上加载由 PHP脚本确定的位置的标记,允许用户根据搜索条件动态过滤兴趣点.这是通过对php搜索脚本的ajax调用完成的.这些标记还有一个附加的infoWindow,通过
// Initialize the info window var InfoWindow = new google.maps.InfoWindow({ content: 'Display Error: Please Try Again', maxWidth: 400 }); // Lots of code to prep the search filters and now inside an $.ajax().done(function(html) { $('#ajaxStub div.stubCalc').each(function() { } }) method var newMarker = new google.maps.Marker({ position: latlon, icon: $(this).find('.iconStub').text(), title: $(this).find('.nameStub').text(), map: gmap }); // onClick show the InfoWindow google.maps.event.addListener(newMarker, 'click', function(e) { InfoWindow.content = $('<div class="projectStub" guid=""></div>').attr('guid', guid).get(0); InfoWindow.open(gmap, newMarker); // loadStub(div, guid, [isToolbox], [callback()]) is defined in CalcInfo.js so that it can also be used by the Calculator Toolbox Page loadStub($('div.projectStub[guid="' + guid + '"]').get(), guid, false, function() { InfoWindow.setContent(InfoWindow.content); }); });
并且你可以看到loadStub方法进行初始的ajax调用并为文件上传的ajax调用做准备(因此这个infowindow的内容非常动态)
function loadStub(project, guid, isToolbox, callback) { if (typeof(isToolbox) === 'undefined') isToolbox = false; $(project).html('<img src="/Styles/images/ajax-loader.gif"/>'); $.ajax({ url: "/ajax.php?ajax=CalcInfo", type: "POST", data: { guid: guid, isToolbox: isToolbox.toString() }, cache: false }).done(function(html) { $(project).html($(html).html()); $(project).find('#fileInput').change(function() { // More code here to prepare for ajax upload $.ajax({ url: "/ajax.php&ajax=Thumbnail&guid=" + guid, type: "POST", data: formdata }).done(function(html) { if ($(html).find('#ajaxContent .error').length > 0) { var errorMessage = 'The Server Returned the Following Error(s):\n'; $(html).find('#ajaxContent .error').each(function() { errorMessage += $(this).text() + '\n'; }); errorMessage += 'Please Try Again'; alert(errorMessage); } }).fail(function() { alert('There Was an Error Connecting to the Server. Please Try Again.'); }).always(function() { loadStub(); }); }); if (typeof callback == 'function') { callback(); } }).fail(function() { $(project).html('<div style="margin: 75px 0; text-align: center;">There Was an Error Connecting to the Server<br/>Please Try Again</div>'); }); }
我能够确定通过使用setContent方法而不是分配InfoWindow.content谷歌地图将适当地调整InfoWindow大小,但它不会平移地图以适应InfoWindow的内容,因为它在使用InfoWindow.open时默认().有谁知道一个体面的解决方案?
如果我需要澄清任何事情,请告诉我.
提前致谢.
尝试调用InfoWindow.open(gmap,newMarker);再次将内容设置为ajax结果之后. 根据内容大小调用open方法时,地图将自动平移,这似乎是一个可用的解决方法.