百度地图Api

最近开发的一个平台中需要用到百度地图,一开始经理跟我说的时候有点懵,不知道怎么弄(本人是个代码小菜鸟,哈哈),在问过度娘之后才知道需要先申请一个密钥,才能调用地图。申请完成后开始在http://lbsyun.baidu.com/jsdemo.htm#a1_2中看示例,讲真的,示例还是挺全的也通俗易懂。但是作为一个刚做开发不久的程序猿来说,有的时候总容易走一些弯路,明明一行代码可以解决的问题非要纠结个半天,还在百度上不停的问度娘,到最后也没有实现功能。

就在刚才,昨天几乎困扰我一下午的问题终于解决了,我不停的修改代码,查询资料都没能解决的问题突然解决了,真是很激动,哈哈哈(一行代码就解决了,可见我有多菜,哎~)

总结一下:

第一步:确认地图的中心点

map = new BMap.Map("allmap");
           map.enableScrollWheelZoom();   //启用滚轮放大缩小,默认禁用
           map.enableContinuousZoom();    //启用地图惯性拖拽,默认禁用
           map.centerAndZoom(new BMap.Point(120.149959, 32.491424), 10);

第二步:创建标注

var marker = new BMap.Marker(118.149959, 32.491424);  // 创建标注

第三步:在地图上添加标注

marker.setTitle(text1);                      //为标注添加文字,鼠标放在上面就会显示
            map.addOverlay(marker);               // 将标注添加到地图中

这是基本的三个步骤,还可以添加标注的点击事件

var content = "百度地图";

 function addClickHandler(content, marker) {
            marker.addEventListener("click", function (e) {
                openInfo(content, e)
            }
            );
        }

        function openInfo(content, e) {
            var p = e.target;
            var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
            var infoWindow = new BMap.InfoWindow(content, opts);  // 创建信息窗口对象
            map.openInfoWindow(infoWindow, point); //开启信息窗口
        }

可以添加的效果有很多,我就不仔细介绍了。大家可以参考:http://lbsyun.baidu.com/jsdemo.htm#a1_2

(我要继续去写代码了,好多坑啊,555555)

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值