我正在尝试根据可用的经度和纬度显示 gmap。这repeater control data source
是我的代码
<script src="http://maps.google.com/maps/api/js?key=myapikey&sensor=false"
type="text/javascript"></script>
<script type="text/javascript">
$('document').ready(function () {
$('.mapicon').click(function (e) {
init($(this).next('.hdnLatitude').val(), $(this).nextAll('.hdnLongitude').val(), $(this).nextAll('.hdnInfoWindow').val());
$("#popup_container").dialog({ modal: true }, { border: 10 }, { width: 513 }, { height: 450 });
});
});
</script>
这是加载 gmap 的 init 方法
<script type="text/javascript">
function init(hdnLatitude, hdnLongitude, hdnInfoWindow) {
// alert(hdnLatitude);
// alert(hdnLongitude);
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 10,
center: new google.maps.LatLng(hdnLatitude, hdnLongitude),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
var image = 'images/map-icon.gif';
var marker = new google.maps.Marker({
position: new google.maps.LatLng(hdnLatitude, hdnLongitude),
map: map,
icon: image
});
var infoWindow = new google.maps.InfoWindow();
google.maps.event.addListener(marker, 'click', function () {
infoWindow.setContent(hdnInfoWindow);
infoWindow.open(map, marker);
});
}
</script>
这是HTML
<div id="popup_container" style="display: none;">
<div id="map" style="width: 500px; height: 400px;">
</div>
</div>
问题是当第一次单击时mapicon
gmap 正确显示,但之后在每次调用弹出窗口中打开但地图出现四分之一并且标记未正确显示。
已编辑
不幸的是,我没有得到单一的答案,或者我的问题可能对 SO 用户不清楚。
我制作了一个测试页面,您可以在其中检查确切的问题。
第一次点击它显示完美的地图但是当你关闭弹出窗口一次又一次点击gmap
然后弹出窗口打开但gmap
显示四分之一。