为什么Google Maps JavaScript在第二次点击时没有显示地图？ [英] Why Google Maps JavaScript is not showing a map right when i click it second time?

问题描述

我使用Google Maps JavaScript API v3在我的网络应用程序中显示地图上的位置。在我的html中，我有：

I am using Google Maps JavaScript API v3 for showing locations on the map in my web application. In my html I have:

<script src="jquery-mainpage.js"></script>
<script type="text/javascript"
    src="http://maps.googleapis.com/maps/api/js?key=AIzaSyB4LCwxrO5EzHnAQXCkP9fjREUEhOPCol4&sensor=false">
</script>

这就是我在中单击更新按钮时制作地图的方式。 jquery-mainpage.js ：

$('#updatebtn').unbind("click");
$('#updatebtn').bind('click', function(){
    var keystring = $('#key').text();
    $.ajax({
        type: 'POST',
        url: 'http://localhost:8888/jsgooglemaps',
        data: {keystr: keystring},
        success: function(result) {
            var obj = jQuery.parseJSON(result);
            var centerLatLng = new google.maps.LatLng(obj.centerLat, 
                obj.centerLong);
            var myOptions = {
                center: centerLatLng,
                zoom: 17,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                draggable: true
            };

            var map = new google.maps.Map(
                document.getElementById("map_canvas_1"),
                myOptions);

            var markerArray = obj.locations;
            for(var i=0;i<markerArray.length;i++){
                var myLatlng = new google.maps.LatLng(
                    markerArray[i].latitude, 
                    markerArray[i].longitude);
                var marker = new google.maps.Marker({
                    clickable: true,
                    position: myLatlng,
                    map: map,
                    zIndex: i
                });
                google.maps.event.addListener(marker, "click", function() {
                    var tempLatLng = new google.maps.LatLng(0, 0);
                    this.setVisible(false); 
                    this.setPosition(tempLatLng);
                    var j = this.getZIndex();
                    markerArray[j].latitude = 0;
                    markerArray[j].longitude = 0;
                });
            }
        }
    });
});

首先点击它显示一切正确。但是当我再次单击更新按钮时，它不显示地图权利。我附上了两个屏幕截图。有人可以告诉我为什么会发生。提前致谢。
第一次点击地图

On first click it shows everything right. but when i click update button again then it doesn't show map right. I am attaching both screen shots. Can anybody tell me why is it happening. Thanks in advance. Map on first click

地图，当我再次点击更新按钮

Map when i click update button again

推荐答案

我正在从ajax成功代码创建map_convas_1 div，并在更新完成后将其删除。然后每当用户点击更新按钮时再次创建它。它的工作很好。

I am creating map_convas_1 div from the ajax success code and removing it when updating is done. and then creating it again whenever user clicks update button. Its working fine.

这篇关于为什么Google Maps JavaScript在第二次点击时没有显示地图？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！