地图API常见问题
李白，字一日
问题原因大部是闭包造成的, 解决办法: 通过创建一个函数来封装基于当前marker的操作, 将各类关于这个marker的事件都在函数内实现,
循环时通过调用应该函数实现marker的创建.
示例代码：
function createGMarker(lat, lng, html){
var marker = new GMarker(new GLatLng(lat, lng));
GEvent.addListener(marker, 'click', function(){
this.openInfoWindowHtml(html);
});
return marker;
}
2. 代码执行结果地图显示正常,路线信息(div2里的内容)显示正常,就是老提示getDistance().meters为空或不是对象,得不到
距离???
<script type='text/javascript'>
document.body.onload = function distance(){
var map = new GMap2(document.getElementById('div1'));
var test = document.getElementById('div2');
map.setCenter(new google.maps.LatLng(39.9493, 116.3975),5);
var directio = new GDirections(map,test);
directio.load('from: 北京 to: 上海');
var dire = directio.getDistance().meters;
}
</script>
原因没有经过异步的处理, 解决办法在异步函数里处理.
代码示例：
GEvent.addListener(dir, 'load', function(){
var distance = dir.getDistance().meters
});
3. 请教如何做一个地址列表与地图中自定义的MARKER关联互动?
自动定位使用GMap2.panTo()函数，
弹出窗口就使用GMap2.openInfoWindowHtml()函数，
参数是任意HTML字符串，
这样的话就可以随意控制窗口中的内容了
4. 添加一个标记点后，拖动该标记点后，如何获取此标记点的经度和纬度呢？
代码示例：
GEvent.addListener(marker1, "dragend", function() {
marker1.openInfoWindowHtml("Just bouncing along...");
var latlng = this.getLatLng();
});
5. 地图上原本有个标注，我现在点按钮新建一个标注，那如何使原来的标注消失。
原因分析：
对于GMap2.removeOverlay()函数不熟悉
解决办法：
1.记录原marker
2.删除原marker，创建新marker
代码示例：
var marker = new GMarker();
GEvent.addListener(map, 'click', function(){
if(marker) {
map.removeOverlay(marker);
marker = null;
}
marker = new GMarker();
map.addOverlay(marker);
});
6. 有没有方法实现Map大小的自动设置
解决办法：
对于map的调整可以通过监听window的resize事实来响应窗口的大小变化的问题。
代码示例：
GEvent.addDomListener(window, 'resize', function(){
map.checkResize();
});
7 .如何开发自己的城市街景
http://code.google.com/intl/zh-CN/apis/maps/documentation/services.html#Streetview
8. 如何设置双域名的API？(或者多域名）
解决办法：
1)客户端代码采用动态加载api的办法，同时动态生成 key
2)通过服务器对访问的URL来提供不同的KEY来实现。
前端解决方法：
代码示例：
function getMapApiKey(url){
var urlKey =
[
{url: 'www.a.com', key: 'asdff7'},
{url: 'www.a1.com', key: 'asdff1'},
{url: 'www.a2.com', key: 'asdff2'}
]
for(var i = 0; i << urlKey.length; i ++){
if(url.indexOf(urlKey[i].url) != -1) return urlKey[i].key;
}
return '';
}
document.write('<<script type="text/javascript" url="'+
getMapApiKey
(location.href)+'">><</script>>');
9. Google地图API问题，如何出现系统找出的路径中的小圆圈 ？
原因分析:
对于javascript与map api的结果要求比较高, 要结合GPolyline与鼠标事件进行处理。然后产生一个GMarker用于
拖
曳。
解决办法：
1）找出来离鼠标最近的点，然后指定最短距离，当鼠标与Polyline的距离小于最短距离时，就会画出来一个GMarker.
代码示例：
function checkMouse(point){
var minDist = 250; //允许最短距离
var shortDist = 999999; //当前最短距离
var shortIdx = -1;
//选择最短距离点
for(var i = 0; i << points.length; i++){
if (point.distanceFrom(points[i]) << shortDist) {
shortDist = point.distanceFrom(points[i]);
shortIdx = i;
}
}
if(shortDist << minDist){
//找到最短距离
dragMarker.show();
dragMarker.setLatLng(points[shortIdx]);
} else {
//未找到最短距离
dragMarker.hide();
}
}
10. 如何使用GDirections?
GDirections基础介绍
a)GDirections即可以直接与地图对象关联，也可以不与地图对象关联
关联:
需要向GDirections对象传入地图对象与相应的展现节点，展现的节点也可以为空
代码如下：
var dir = new GDirections(map, domNode);
当关联地图后，dir的任何变动都会反映在map上，包括线路的变化，标记的变化。
当domNode传入后，dir变化后的结果将完全清空原dom节点里的任何数据。
这时很多的默认加载项也是生效的，在相应的回调函数里都是可以得到的。比如getPolyline, getRoute,都在load,
error的回调里有效。
不关联：
var dir = new GDirections();
这时有两个重要的属性默认将会失效：getPolyline, getRoute。为了能使用getPolyline与getRoute,我
们在加载函数load*的options中需要加入:
{
getPolyline: true, //任意选取一个或者同时选择
getSteps: true
}
b)任何一次GDirections都是可能失败的。
所以我们需要定义两个函数应对，
分别用于处理成功与失败的情况。
因为GDirections的操作是异步操作，
成功与网络有很大的关系，而网络可能是不稳定的，
同时可能包含一些不确定的随机事件的原因，
所以我们不能默认GDirections一定能成功执行，
否则将可能引入潜在的错误风险。
一般可以定义成如下的形式：
function onDirSuc(){
}
function onDirFail(){
}
分别对应于load, error两个事件
GEvent.addListener(dir, 'load', onDirSuc);
GEvent.addListener(dir, 'error', onDirFail);
c)明确传入的数据结构
很多失败的GDirections代码是从不明确怎样传入数据给GDirections开始的.
GDirections支持两种数据格式:
1.查询字串
2.查询数组
它们的基本结构组成：
地址
坐标
1）查询字串
对应的调用函数是dir.load()
地址形式:
"from: 北京 to: 上海"
"from: Seattle to: San Francisco"
"from: Toronto to: Ottawa to: New York"
坐标形式:
"from: 63.192828,-120.130023 to: 56.8032003,-100.1828833"
"from: -80.13532,120.829232 to: 89.12828,78.01822 to:
55.8282,100.020833"
2）查询数组
它对应的调用函数是dir.loadFromWaypoints()
地址形式:
['北京', '上海']
['Seattle', 'San Francisco']
['Toronto', 'Ottawa', 'New York']
坐标形式:
['63.192828,-120.130023', '56.8032003,-100.1828833']
['-80.13532,120.829232', '89.12828,78.01822',
'55.8282,100.020833']
d)常见问题分析与解决
最基本的了解与正确的使用之间还存在一定的距离，所以往往需要通过错误促使我们成长。
1. 多次创建 GMap与 GDirections, 在示例代码影响下，论坛上有会员将示例代码封装在一个函数中，从而实现多次的
GDirections,但同时引入了重复创建的错误。
解决：
a)不重复创建不必要的GDirections,
b)重新组织数据
c)调用load*
d)深入了解GDirections的使用方法
2.GDirections是异步操作，任何的后续处理都需要在onDirSuc或者onDirFail里实现，很多开发者直接后续处理
放
在load*后面，导致无法得到想要的结果。示例
这里
1.可以通过传入callback的办法来实现后续处理
2. 也可以直接通过处理onDirSuc/onDirFail来处理
3.GDirections是异步操作，当需要汇集多次的GDirections结果时，处理起来将会比较麻烦。示例
一个比较通用的办法是:
1.定义一个处理汇总函数callback
2.数据化的需要汇总的dir成dirList，将它们的处理函数，是否完成标签按下面的格式
[{load: onDirSuc0, error: onDirFail0, flag: false},
{load: onDirSuc1, error: onDirFail1, flag: false},
...
]
3. 在所有的onDirSucX/onDirFailX里将自已对应原flag置位，检测所有的flag是否完成
4.如果完成调用callback
一段取GDirections后Polyline的代码示例：
//
var onDirSuccess = function() {
var points = [];
var pol = this.getPolyline();
var count = pol.getVertexCount();
for (var i = 0; i << count; i++) {
var point = pol.getVertex(i);
}
//do something
if (callback) callback();
}; //<<--注意有分号
var onDirFailure = function() {
//do something else
if (callback)
callback();
};
var dir = new GDirections();
GEvent.addListener(dir, 'load', onDirSuccess);
GEvent.addListener(dir, 'error', onDirFailure);
var query = "from: 北京 to: 天津";
dir.load(query, {
getPolyline : true
});
11. 如果得到当前的位置?
取当前的位置，需要使用google ajax api
代码示例:
var loc = google.loader.ClientLocation;
loc.latitude && loc.longitude
12. google地图支持多个地址同时搜索么?
建议的办法是一个一个的同步发送请求，
不要异步同时请求多个，这样有可能导到请求失败。