百度地图api

8 篇文章 0 订阅

今天做一个商城后天管理系统,增加店铺信息的时候需要通过百度地图来搜索地址添加位置信息。于是打开百度地图api地址:http://developer.baidu.com/map/,里面有4个选择菜单:web开发、服务接口、android开发、ios开发,你可以根据自己情况选择,这里我选择web开发,分大众版、极速版、开原版,根据情况选择版本进入。

在进行web页面使用百度地图开发之前还必须为项目申请密钥,点击获取密钥进入申请页面,填写应用名称,选择应用类型及要启用的服务......然后点击提交即可,有了密室就可以再自己的web页面使用百度地图。下边是一个简单的实例:

以下代码创建了一个地图并以天安门作为地图的中心:
<!DOCTYPE html>  
<html>  
<head>  
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>Hello, World</title>  
<style type="text/css">  
html{height:100%}  
body{height:100%;margin:0px;padding:0px}  
#container{height:100%}  
</style>  
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=您的密钥"></script>//此为v1.5版本的引用方式  
  // http://api.map.baidu.com/api?v=1.5&key=您的密钥&callback=initialize"; //此为v1.4版本及以前版本的引用方式  
</head>  
   
<body>  
<div id="container"></div>
<script type="text/javascript">

var map = new BMap.Map("container");          // 创建地图实例  

var point = new BMap.Point(116.404, 39.915);  // 创建点坐标  

map.centerAndZoom(point, 15);                 // 初始化地图,设置中心点坐标和地图级别  

</script>  
</body>  
</html>

创建地图容器元素 地图需要一个HTML元素作为容器,这样才能展现到页面上。这里我们创建了一个div元素。命名空间 API使用BMap作为命名空间,所有类均在该命名空间之下,比如:BMap.Map、BMap.Control、BMap.Overlay。
创建地图实例

var map = new BMap.Map("container");

创建点坐标
var point = new BMap.Point(116.404, 39.915);这里我们使用BMap命名空间下的Point类来创建一个坐标点。Point类描述了一个地理坐标点,其中116.404表示经度,39.915表示纬度。
地图初始化
map.centerAndZoom(point, 15);在创建地图实例后,我们需要对其进行初始化,BMap.Map.centerAndZoom()方法要求设置中心点坐标和地图级别。 地图必须经过初始化才可以执行其他操作。

然后就是地图的配置和操作咯,这里就没有必要再叙述。有问题多查api文档。


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值