首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >gmaps.js遍历地址并添加标记

gmaps.js遍历地址并添加标记
EN

Stack Overflow用户
提问于 2013-01-14 07:24:04
回答 1查看 1.4K关注 0票数 1

我想使用gmaps.js循环遍历全球寻址的50+,并在地图上添加标记。多亏了对另一个问题的很好的回答,我认为我已经解决了它。

gmaps.js - loop through elements and add markers

简而言之,使用准确的答案(现场示例http://jsfiddle.net/w8bvR/3/)。

脚本端

代码语言:javascript
复制
    var map = new GMaps({
    div: '#mapCanvas',
    lat: 0,
    lng: 52,
    zoom: 13,
    width: '600px',
    height: '400px'
});

var popupTemplate = '<div class="popupText"><h3>%1</h3><p>%2</p></div>';
var location = $('#location').text();

$('.blist p').find('br').replaceWith(', ');

$(".blist").each(function() {
    var title = $(this).find("h3").text();
    var address = $(this).find("p.address").text();
    GMaps.geocode({
        address: address,
        callback: function(results, status) {
            if (status == 'OK') {
                var latlng = results[0].geometry.location;
                map.setCenter(latlng.lat(), latlng.lng());
                map.addMarker({
                    lat: latlng.lat(),
                    lng: latlng.lng(),
                    title: title,
                    infoWindow: {
                        content: popupTemplate.replace('%1',title).replace('%2',address)
                    }
                });
            }
        }
    });
});

HTML端

代码语言:javascript
复制
    <div id="mapCanvas"></div>
<h1 id="location">Phuket, Thailand</h1>

<div class="blist">
    <h3>APK Resort</h3>
    <p class="address">95 Ratchapratanusorn road<br>Kathu<br>Patong Beach 83150<br>Phuket<br></p>
</div>

<div class="blist">
    <h3>Patong Bay House</h3>
    <p class="address">160/5 Phungmuang Sai kor Rd<br>Phuket<br>Patong Beach 83150<br>Kathu<br></p>
</div>

<div class="blist">
    <h3>Bel Aire Resort</h3>
    <p class="adress">59/1-3 Sainamyen Rd Patong Kathu<br>Phuket<br>Patong Beach 8310<br>T<br></p>
</div>

然而,由于某些原因,当我从mysql中获取地址viva PHP并创建50+时,它只添加了11个标记来映射,无论是什么顺序或从我创建的mysql中选择。我有点迷惑为什么它会将自己限制为11,因为googles API声称至少在那个级别上没有限制。

看到我正在从mysql/php获取数据,我确信还有一种更优雅的方法,但这两种方法都不是专家。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-01-14 08:07:37

问题是代码没有检查OVER_QUERY_LIMIT错误并进行适当的处理。如果不处理这种情况,您将得到大约10个来自地理编码服务的响应(如您所见)。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/14309438

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档