所有图标在放置在地图上之后从谷歌地图中的前五个图标消失

时间:2012-05-03 01:22:14

标签: javascript google-maps google-maps-api-3 google-maps-markers

我有一个带谷歌地图的网页。我使用javascript根据来自json文件的地址在地图上放置标记。 json文件中有7个地址。

当地图加载时,我会看到地图上的所有7个图标,但它们会立即消失,然后使用边界框调整地图的大小。

我的代码是错误的还是我在地图上可以拥有的数字图标有限制。无论查询了多少个地址,它总是在地图上保留5个图标。所有其他人都被删除。我怀疑是否有限制因为我看过有数百个图标的地图。

我为每个地址使用不同的图标。所以我删除了自定义图标并使用了Google提供的标准图标。同样的问题。所以,它似乎在代码中。帮助任何人。

// JavaScript Document
$(document).ready(function() {

var addresses = [];
var address, company;
var geocoder, marker, thumbtack;

var bounds = new google.maps.LatLngBounds();    

// Set map options
    var options = {
    zoom:11,
    center: new google.maps.LatLng(Lat, Lng),
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControl: true,
    mapTypeControlOptions: {
        style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
    }
};

// Create the map
var map = new google.maps.Map(document.getElementById('map'), options);
marker = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(Lat, Lng),
    title: "Your Zip Code"
});
//bounds.extend(new google.maps.LatLng(Lat, Lng));

    // Get the data
    // var listing is already set in footer.php
    processFile(listings);

function processFile(listings) {
        $.each(listings,function(business, info) {
            address = info[2];
            company = info[0];
            thumbtack = info[4];
            getCoordinates(address, company, thumbtack);
        });
    }


    function getCoordinates(address, company, thumbtack) {
    var counter = 0;
            // Check to see if we already have a geocoded object.  If not we create one.
    if(!geocoder) {
        geocoder = new google.maps.Geocoder();
    }

    // Create a GeocoderRequest object
    var geocoderRequest = {
        address: address
    }

    // Making the geocode request and adding marker
    geocoder.geocode(geocoderRequest, function(results, status) {
        // Check if status is OK before proceding
        if (status == google.maps.GeocoderStatus.OK) {
            addresses.push(results[0].geometry.location);
            counter++;
            marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location,
                title: company,
                //icon: "http://gmaps-samples.googlecode.com/svn/trunk/markers/blue/marker" + thumbtack + ".png"
                                    icon: thumbtack
            });
            //bounds.extend(results[0].geometry.location);

            // Adjusting the map to new bounding box
                            //map.fitBounds(bounds);

        }

    });

};

});

1 个答案:

答案 0 :(得分:0)

在我看来,你应该一次只看到一个标记。我建议添加一个createMarker函数,它可以使用函数闭包来创建7个标记。

Example使用createMarker函数。