今天一个项目用到地图，因为是基于微信公众号网页，因此选用腾讯地图。
优点：腾讯地图申请权限简单 只要有QQ号 填写基本的开发者认证资料即可 而且可以立刻获得秘钥 无需人工审核 经过验证，在实际项目中，即使不使用秘钥也可以开发项目，但腾讯官方的声明是不保证之后永久有效。
项目是网页开发模式,JDK选择 WEB开发 JavascriptAPI。前面获取点击位置，添加覆盖物等操作均没有问题，不过在进行为覆盖物添加点击事件的时候出现了问题。为一个覆盖物添加点击事件，OK没有问题，但在进行多个覆盖物的点击事件添加后。会出现每个覆盖物的事件都被覆盖（重写）成最后一个事件，也就是所有覆盖物出发的事件都是一个而且是最后一个添加的点击事件。
data是商铺数组信息
一开始，读了腾讯官方文档 写了如下代码，这是用单一插点 模拟的多个插点。
for(var i in data){
shop = data[i];
x = shop.shop_position.split(',')[0];
y = shop.shop_position.split(',')[1];
//--插点
marker = new qq.maps.Marker({
position: new qq.maps.LatLng(x,y),
animation: qq.maps.MarkerAnimation.BOUNCE,
map: map,
draggable: true,
icon: new qq.maps.MarkerImage("img/point.png"),
visible: true,
});
//--插点点击事件
qq.maps.event.addListener(marker[i], 'click', function() {
//--事件函数
});
//--跳转到最后一个搜索结果的位置
map.panTo(new qq.maps.LatLng(x,y));
}
结果是插点成功，但绑定的事件不成功，事件被最后一个覆盖。
之后看到有多个覆盖物的插点文档：http://lbs.qq.com/javascript_v2/case-run.html#sample-event-closure
for(var i in data){
shop = data[i];
x = shop.shop_position.split(',')[0];
y = shop.shop_position.split(',')[1];
//--标记插点
marker[i] = new qq.maps.Marker({
position: new qq.maps.LatLng(x,y),
animation: qq.maps.MarkerAnimation.BOUNCE,
map: map,
draggable: true,
icon: new qq.maps.MarkerImage("img/point.png"),
visible: true,
});
var infoWin = new qq.maps.InfoWindow({
map: map
});
latlngs[i] = new qq.maps.LatLng(x,y);
//添加到提示窗
info[i] = new qq.maps.InfoWindow({
map: map
});
//--插点点击事件1
qq.maps.event.addListener(marker[i], 'click', function() {
info[i].open();
info[i].setContent('
');
info[i].setPosition(new qq.maps.LatLng(x,y));
});
//--插点点击事件2
qq.maps.event.addListener(marker[i], 'click', function() {
//--点击事件内容
});
//--跳转到最后一个搜索结果的位置
map.panTo(new qq.maps.LatLng(x,y));
}
这次注意上面已经使用数组进行创建覆盖物和点击事件，插点点击事件1是弹出腾讯默认给出的提示框（蛮不错），插点点击事件2是项目需要的逻辑。又一次失败！但是再一次接近了真相！当时已经卡了一个多小时了，郁闷！
经过本大神冥思苦相，果然真相只有一个！说多了都是废话，还是上码吧，同志！
for(var i in data){
shop[i] = data[i];
x = shop[i].shop_position.split(',')[0];
y = shop[i].shop_position.split(',')[1];
var infoWin = new qq.maps.InfoWindow({
map: map
});
latlngs[i] = new qq.maps.LatLng(x,y);
//--创建marker以及点击事件
(function(i){
var marker = new qq.maps.Marker({
position: new qq.maps.LatLng(x,y),
animation: qq.maps.MarkerAnimation.BOUNCE,
icon: new qq.maps.MarkerImage("img/point.png"),
map: map
});
qq.maps.event.addListener(marker, 'click', function() {
//--业务逻辑 顺便加了一个腾讯自带提示框 加了一张图片
});
})(i);
//--跳转到最后一个搜索结果的位置
map.panTo(new qq.maps.LatLng(x,y));
}
最后发现：腾讯地图中覆盖物点击事件触发时，调用的时JS在内存中储存的变量信息，我本以为既然官方文档中的marker既然是重复使用的，那么在创建覆盖物点击事件的时候，函数的内容已经固定（函数内部函数已经赋值），由此看到腾讯地图的开发者的习性！
而我的习惯是在元素创建时为其创建点击方法，在元素创建的时候，函数内容已经确定。比较起来，如果数据量大，创建元素众多的情况下，腾讯开发者的思路会减少浏览器储存的信息，占用的空间等于函数+变量（覆盖物信息数组）；而我的方法是创建一个函数数组（函数内含有数组信息）。
腾讯文档地址：http://lbs.qq.com/javascript_v2/demo.html