放置在地图上后，除了谷歌地图中的前五个图标外，所有图标都消失了答案

【问题标题】：All icons disappear except for the first five from google maps after having been placed on the map放置在地图上后，除了谷歌地图中的前五个图标外，所有图标都消失了
【发布时间】：2012-05-12 12:38:43
【问题描述】：

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

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

我的代码是错误的还是地图上的图标数量有限制。无论查找多少个地址，它始终在地图上保留 5 个图标。所有其他都被删除。我怀疑是否存在限制，因为我见过带有数百个图标的地图。

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

// 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);

        }

    });

};

});

【问题讨论】：

你试过不同的地址吗？听起来您开始放大并可以看到 7 个不同的标记。它们是不是靠得太近了，以至于当您缩小它们时，它们会显示为一个？
看起来不错，但我们需要查看您的其余代码，否则最好提供演示链接。
counter 变量有什么作用，它设置为什么？
同意皮特。另外，如果这 7 个地址是静态的，为什么不使用 Web 服务对其进行地理编码，临时缓存相关信息服务器端，然后在初始加载时渲染标记...这将节省您的用户时间...
这里是结果的链接。 blacktiehomeservices.com/view/…

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

【解决方案1】：

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

Example 使用 createMarker 函数。

【讨论】：