XDL_NO.16 基于LBS开发

基于LBS开发

LBS 基于位置的服务,它是通过电信移动运营商的无线电通讯网络(如GSM网、CDMA网)或外部定位方式(如GPS)获取移动终端用户的位置信息(地理坐标,或大地坐标),在地理信息系统(外语缩写:GIS、外语全称:Geographic Information System)平台的支持下,为用户提供相应服务的一种增值业务。

这里我们使用百度地图API

百度地图API

百度地图API简单使用

百度地图API是由JavaScript语言编写的,在使用之前需要将API引用到页面中: 需要提供密钥

(1)插入JavaScript API
(2)插入地图块
(3)插入JS代码创建地图应用

插入JavaScript API
<!-- baidu Map api -->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=秘钥"></script>

特别注意,以上代码中的ak=秘钥处,秘钥即为准备工作中申请的秘钥,对应复制替换秘钥二字即可。

另外为了提高网页的加载速度,我们可以将上述代码放在<body></body>标签对中的最后。这样会提升页面的加载速度,但是地图应用的加载时间同样会依赖于以上文件的载入速度。

插入地图块

我们只需要在插入地图应用的位置,插入一个div块即可,同时设定一个id供后续使用,方式如下:

 <div id="baiduMap"><div>
插入JS代码创建地图应用

在<body></body>的末尾插入以下JavaScript代码段:

<script type="text/javascript">
  var map = new BMap.Map("baiduMap");  //创建Map实例
  var point = new BMap.Point(114.419915,30.513719);  //创建Point位置实例
  map.centerAndZoom(point, 19);  //设置地图中心点及缩放级别
  map.addControl(new BMap.MapTypeControl());  //添加地图类型控件
  var marker = new BMap.Marker(point);  //创建一个Marker点
  map.addOverlay(marker);  //将Marker点覆盖到地图上
  marker.setAnimation(BMAP_ANIMATION_BOUNCE);  //使Marker点跳动起来
  map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
</script>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • LBS 位置服务 基于位置的服务,它是通过电信移动运营商的无线电通讯网络(如GSM网、CDMA网)或外部定位方式(...
    景岳阅读 4,562评论 1 0
  • 各位小伙伴们大家好,今天我向大家介绍一下苹果百度地图的使用方法,因为做过一些想关的APP,感觉百度地图还是挺方便的...
    Lee0528阅读 14,958评论 18 46
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,807评论 25 709
  • 立秋,二游长江,望江山如画,遂作。 一叶红遍一江秋, 一江秋水一扁舟。 峡束九派游汗漫, 水牵仙桡下汀洲。
    常也无常阅读 676评论 3 3
  • 我不是那天涯的沦落人,却是你海内的知己!所以,请至少给我一次约你的机会! 相约:6月7日,突然寂静...
    小幸甫阅读 4,538评论 2 12