谷歌地图api v2 -如何处理200-300个标记
Google maps api v2 - how to handle 200-300 hundred markers
你好,我有一个相当大的脚本,所以我不会把它全部张贴在这里,但我真的需要帮助,不知道该怎么做更多…
我在地图上有~300个标记,他们都在同一时间加载,谷歌无法处理或我的脚本无法处理,但我得到"地址找不到"在其中一半,甚至可能更多(其他人正确加载)。但是如果我把它全部删除,一切都会正常工作!
该怎么办?是否有一种方法来加载他们几个在时间一步一步,或者有许多标记处理程序等?(不是marksmanager,我需要在所有缩放级别中都能看到它们)
try with timeout没有帮助!
部分代码:
function initHeadAddress(searchString) {
if(searchString == 'undefined') {
map.clearOverlays();
var t = setTimeout("showAddress('Himmelev Bygade 78 B, 4000 Roskilde, Denmark',1,'3T Bygningsentreprise A/S','4000','Roskilde','46328328','null','www.3t.dk',null,null)",1000);
var t = setTimeout("showAddress('Nørre Allé 51, 7760 Hurup, Denmark',4,'Idealcombi','7760','Hurup','96882500','null','http://www.idealcombi.dk/',null,null)",1000);
..... A LOT OF THESE HERE MORE !!!!
// default one
showAddress('Denmark', 0, null, null,null,null,null,null,null,searchString);
} else {
// if used search function
showAddress(searchString, 0, null, null,null,null,null,null,null,searchString);
}
}
ShowAddress功能:
function showAddress(address, markerType, companyname,postnr, by, phone, fax, web, email, searchString) {
if (geocoder) {
geocoder.getLatLng(
address,
function(point) {
if (!point) {
//alert("Adresse " +address+ " blev ikke fundet");
console.log("Adresse " +address+ " blev ikke fundet");
} else {
var myIcon = new GIcon(G_DEFAULT_ICON);
myIcon.shadow = null;
myIcon.infoWindowAnchor = new GPoint(9, 2)
if (markerType == '0') {
myIcon.image = '/files/billeder/../Templates/Designs/Ideal2011/images/Map/googleempty.png';
myIcon.iconSize = new GSize(18, 18);
}
if (markerType == '1') {
myIcon.image = '/files/billeder/../Templates/Designs/Ideal2011/images/Map/googlered.png';
myIcon.iconSize = new GSize(18, 18);
$('#dotRedCheckbox').click(
function(){
if(!$(this).hasClass('activeMarker')){
marker.hide();
} else {
marker.show();
}
}
);
}
else if (markerType == '2') {
myIcon.image = '/files/billeder/../Templates/Designs/Ideal2011/images/Map/googlelblue.png';
myIcon.iconSize = new GSize(18, 18);
$('#dotlBlueCheckbox').click(
function(){
if(!$(this).hasClass('activeMarker')){
marker.hide();
} else {
marker.show();
}
}
);
}
else if (markerType == '3') {
myIcon.image = '/files/billeder/../Templates/Designs/Ideal2011/images/Map/googledblue.png';
myIcon.iconSize = new GSize(18 , 18);
$('#dotdBlueCheckbox').click(
function(){
if(!$(this).hasClass('activeMarker')){
marker.hide();
} else {
marker.show();
}
}
);
}
else if (markerType == '4') {
myIcon.image = '/files/billeder/../Templates/Designs/Ideal2011/images/Map/googlegreen.png';
myIcon.iconSize = new GSize(18, 18);
$('#dotGreenCheckbox').click(
function(){
if(!$(this).hasClass('activeMarker')){
marker.hide();
} else {
marker.show();
}
}
);
}
var markerOptions = { icon: myIcon };
var marker = new GMarker(point, markerOptions);
marker.getPoint();
if(markerType != 0){
points.push(point);
markers.push(marker);
}
if (markerType == 0) {
if(searchString == 'undefined'){
map.setCenter(point, 6);
} else {
map.setCenter(point, 13);
LatD = point.lat().toFixed(5);
LngD = point.lng().toFixed(5);
find_closest_marker(LatD, LngD);
find_closest_marker2(LatD, LngD);
find_closest_marker3(LatD, LngD);
}
}
Lat = point.lat().toFixed(5);
Lng = point.lng().toFixed(5);
var image = '<img src="http://cbk0.google.com/cbk?output=thumbnail&w=85&h=70&ll='+Lat+','+Lng+'" />'; // alt="'+address+'"
map.addOverlay(marker);
if(markerType != 0) {
if(fax != "" && fax != null && fax != 'null'){
var newfax = "Mob.: "+fax+"<br/>";
} else {
var newfax = "";
};
if(web != "" && web != null && web != 'null'){
var newweb = "<a href='"+web+"'>"+web+"</a><br/>";
} else {
var newweb = "";
};
if(postnr != "" && postnr != null && postnr != 'null'){
var newpostnr = postnr;
} else {
var newpostnr = "";
};
if(phone != "" && phone != null && phone != 'null'){
var newphone = phone;
} else {
var newphone = "";
};
//address = address.replace("Denmark, ","");
//address = address.replace(", Denmark","");
//address = address.replace(", 2650 Hvidovre","");
//address = address.replace(", Hurup","");
//address = address.replace("UK, ","");
address2 = address.split(',');
address = address2[0];
var infoboxInfo = '<div class="infoboxall"><div class="infoboxinfo"><div class="infoboxAddress">'+companyname +"</div>"+ address + '<br/>' + newpostnr + " " + by+ "<br/>" + "Tlf.: " + newphone + "<br/>" + newfax + newweb+"<a href='mailto:"+email+"'>"+email+"</a>"+'</div>' + image+'</div>';
//marker.openInfoWindowHtml(address);
//GEvent.addListener(marker, 'click',marker.openInfoWindowHtml(address));
GEvent.addListener(marker, "click", function()
{marker.openInfoWindowHtml(infoboxInfo);});
marker.markerType = markerType;
marker.title = companyname;
marker.address = address;
marker.postby = newpostnr+ " " + by;
marker.phone = newphone;
marker.fax = newfax;
marker.web = newweb;
marker.email = email;
}
}
}
);
}
}
有人有什么想法吗?如果有5个标记左右,我说脚本是如何工作的……但是当全部插入时只显示其中的一部分?想法?
是的,你可以这样做,就像我在以前的项目中从数据库加载标记一样(我在这个项目中使用API v3,但概念是相同的)。由于API同时接受来自同一IP的5个请求,我做了一个"标记队列"。当由于API返回错误而无法放置标记时,我将其放入队列中,每隔一秒钟左右,我尝试从队列中添加下一个标记,直到队列为空。
请查看前面链接中的"gmaps3.js"源代码,看看我是如何做到的。如果你有更多问题,请告诉我。
根据Google的说法,版本2的API已经被弃用,你应该开始使用版本3。一个很大的好处是,你不再需要一个特定于域的"API密钥",事实上,你根本不需要一个API密钥版本3。
我认为它比版本2更简单,更干净。如果您熟悉jQuery和jQuery插件,那么您将真正喜欢使用Map API版本3。
相关文章:
- 如何使用jquery/javascript处理来自多个动态创建的锚标记的onclick事件
- 将javascript添加到200多个html文件中,最简单的方法
- 传单:处理由多个GeoJSON组成的GeoJSON
- 处理来自多个数据源的数据
- 在用户键入消息时显示字数统计,并将字长限制为 300 个字
- 并非所有循环都已处理,13200 个循环中只有 5655 个
- 如何无延迟地处理 100 多个移动矩形
- 如何在函数完成后使用 jQuery 进行动画处理 - 让第二个函数等待
- 我可以定义一个函数来处理在 2 个输入标签上定义的“更改键控”事件吗?这是个好主意吗
- 我应该如何处理在多个页面上重复使用的ajax get函数
- 使用jQuery将动态内容预处理为多个元素
- 处理来自多个来源的响应错误
- 第二个请求接收仍在处理的第一个请求
- 在异步代码块中处理的多个ajax延迟调用的数组,后面是同步的最终代码块
- 当只选择一个项目时,如何处理具有多个项目的选择
- 如何处理超过3000个值负载上选择选项下拉
- 套接字.io:如何处理打开两个窗口的认证客户端
- 当单元格内容长度超过300个字符时,获取Excel单元格范围
- 谷歌地图api v2 -如何处理200-300个标记
- 当我们需要信任大约 200-300 个自定义图表时.js D3 是最佳选择吗?