Question

当我将此页面加载到div中时（使用jQuery.load（）），不会显示标记图标。重新加载页面后将显示该图标。当我将它传递给placeMarker函数时，是否导致地图未初始化？如何解决它。

<script type="text/javascript">

var map;
var markers = new Array();      
var marker;

var infoWindow = new google.maps.InfoWindow();
function initialize() {
    var myLatlng = new google.maps.LatLng(-6.19605333333333,106.79684);
    var myOptions = {
            zoom: 8,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    google.maps.event.addListener(map, 'click', function(event) {
        placeMarker(event.latLng);
        fillPositionForm(event.latLng);
    }); 
}

function placeMarker(location) {
    if ( marker ) {
        marker.setPosition(location);
    } else {
        marker = new google.maps.Marker({
            position: location,
            map: map,
            animation: google.maps.Animation.DROP,
            draggable: true
        });
    }
    google.maps.event.addListener(marker, 'dragend', function(event) {
        clearOverlays();
        fillPositionForm(event.latLng);
    });
}

function fillPositionForm(location){            
    jQuery("#latitude").val(location.lat());
    jQuery("#longitude").val(location.lng());
}

function clearOverlays() {
    if (markers) {
        for (i in markers) {
            markers[i].setMap(null);
        }
    }
}

jQuery(document).ready(function() { 
    initialize();
    jQuery("#frmAddPoi").validate({
        messages: {
            latitude: "Please click on map to select poi center position",
            longitude: "Please click on map to select poi center position",
        },
        submitHandler: function(form) {
            return postForm(form, "savepoi", "listcustopoi", false, false);
        }
    });
});
</script>
<div id="map_canvas" class="widgettitle" style="height:240px;"></div>

Answer 1

您正在将placeMarker附加到map.click事件侦听器。

google.maps.event.addListener(map, 'click', function(event) {
    placeMarker(event.latLng);
    fillPositionForm(event.latLng);
});

你需要在调用map之后加载它。

map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
     placeMarker(myLatlng);

请参阅jsFiddle

Answer 2

你应该在load（）成功后调用函数Initialize（）。最好将javascript放在主页面中，而不是加载到页面中。或者你可以使用iFrame，这是最简单的方法。

标记图标不显示在jquery加载上

2 个答案: