如何使用百度地图API

如题所述

第1个回答  2017-10-25
百度地图API

开始学习百度地图API最简单的方式是看一个简单的示例。以下代码创建了一个520x340大小的地图区域并以天安门作为地图的中心:

1. <html>

2. <head>

3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

4. <title>Hello, World</title>

5. <script type="text/javascript" src="http://api.map.baidu.com/api?key=46ce9d0614bf7aefe0ba562f8cf87194&v=1.0&services=false"></script>

6. </head>

7. <body>

8. <div style="width:520px;height:340px;border:1px solid gray" id="container"></div>

9. </body>

10. </html>

11.

12.

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Hello, World</title>

<script type="text/javascript" src="http://api.map.baidu.com/api?key=46ce9d0614bf7aefe0ba562f8cf87194&v=1.0&services=false"></script>

</head>

<body>

<div style="width:520px;height:340px;border:1px solid gray" id="container"></div>

</body>

</html>

1. <script type="text/javascript">

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

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

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

5. </script>

6.

<script type="text/javascript">

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

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

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

</script>

引用百度地图API文件

当您引用地图API文件时,需要使用自己申请的API密钥。

1. <script type="text/javascript" src="http://api.map.baidu.com/api?key=46ce9d0614bf7aefe0ba562f8cf87194&v=1.0&services=false"></script>

<script type="text/javascript" src="http://api.map.baidu.com/api?key=46ce9d0614bf7aefe0ba562f8cf87194&v=1.0&services=false"></script>

创建地图容器元素

1. <div style="width:520px;height:340px;border:1px solid #000" id="container"></div>

<div style="width:520px;height:340px;border:1px solid #000" id="container"></div>

地图需要一个HTML元素作为容器,这样才能展现到页面上。这里我们创建了一个div元素并制定它的大小。地图会根据容器大小调整自身尺寸。

命名空间

API使用BMap作为命名空间,所有类均在该命名空间之下,比如:BMap.Map、BMap.Control、BMap.Overlay。

创建地图实例

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

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

位于BMap命名空间下的Map类表示地图,通过new操作符可以创建一个地图实例。其参数可以是元素id也可以是元素对象。
注意在调用此构造函数时应确保容器元素已经添加到地图上。

创建点坐标

1. var point = new BMap.Point(116.404, 39.915);

var point = new BMap.Point(116.404, 39.915);

这里我们使用BMap命名空间下的Point类来创建一个坐标点。Point类描述了一个地理坐标点,其中116.404表示经度,39.915表示纬度。

地图初始化

1. map.centerAndZoom(point,15);

map.centerAndZoom(point,15);

在创建地图实例后,我们需要对其进行初始化,BMap.Map.centerAndZoom()方法要求设置中心点坐标和地图级别。
地图必须经过初始化才可以执行其他操作。

地图操作

地图被实例化并完成初始化以后,就可以与其进行交互了。API中的地图对象的外观与行为与百度地图网站上交互的地图非常相似。它支持鼠标拖拽、滚轮缩放、双击放大等交互功能。您也可以修改配置来改变这些功能。

您还可以通过编程的方式与地图交互。Map类提供了若干修改地图状态的方法。例如:setCenter()、panTo()、zoomTo()等等。

下面示例显示一个地图,等待两秒钟后,它会移动到新中心点。panTo()方法将让地图平滑移动至新中心点,如果移动距离超过了当前地图区域大小,则地图会直跳到该点。

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

2. var point = new BMap.Point(116.404, 39.915);

3. map.centerAndZoom(point, 15);

4. window.setTimeout(function(){

5. map.panTo(new BMap.Point(116.409, 39.918));

6. }, 2000);

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

var point = new BMap.Point(116.404, 39.915);

map.centerAndZoom(point, 15);

window.setTimeout(function(){

map.panTo(new BMap.Point(116.409, 39.918));

}, 2000);

原文:http://www.cnblogs.com/xuhongfei/archive/2013/04/10/3011964.html

如何使用地图api查询位置?
1、打开百度首页,点击右上角“地图”连接。2、在打开的百度地图页面,点击右上角的“地图API”。3、在打开的百度地图API-首页,下拉找到”插件与工具“,点击“坐标拾取工具”。4、在拾取坐标系统页面,点击“更换城市”,选择自己需要的城市。5、在拾取坐标系统页面,点击地图上某个位置,可以在“当前...

如何使用百度地图查找地点的经纬度
1、首先进入【百度地图】,在右上角可以看到【地图API】   2、进入后,拉到最下面,在【插件与工具】,选择【坐标拾取工具】   3、然后进入拾取坐标系统,在搜索框输入要找的地点    4、然后选择地点,就可以看到地点的经纬度了 其他方法:...

百度地图api怎么开通
1、首先打开百度地图,右上方找到“地图API”栏目。2、点开之后是百度开放平台,往下拉一点点,看到“申请密匙”点击进去。这个时候需要登录各位的百度账号才能进去。3、进入之后会看到百度地图LBS开放平台。选择“创建应用”;“应用名称”可以自己随意编辑,既然是百度地图,建议大家就写“地图”;“IP白...

如何调试百度地图 API?附上使用教程
百度地图 API 的在线地址为:baidumap.apifox.cn\/,你可以在 Apifox中克隆此项目进行调试。首先,需要注册开发者账号并获取API Key。若已注册,这步可跳过。创建应用后,即可在左侧的“应用管理->我的应用”中找到并创建应用,成功后会显示API Key(AK)。打开Apifox,将百度地图API项目克隆出来。将获取...

如何用百度地图api实现地图查询功能?
注册百度地图开放平台账号并完成认证后,即可使用百度地图API,实现地图查询功能。百度地图开放平台提供了丰富功能,其中搜索API特别适合快速便捷地从地图中获取所需数据。服务文档中详细说明了每个接口的功能、请求格式、参数及返回值。其中,行政区域检索接口能根据指定关键词和行政区划搜索内容。该接口请求格式...

百度地图API基本使用(一)
1. 登录开发者平台,点击"创建应用",选择与项目相关的应用类型,如Web项目,并设置Referer白名单。完成创建后,你会看到你的AK。实现百度地图的关键步骤如下:创建HTML文件,如Hello.html,引用API并替换AK。在HTML中创建地图容器元素,并设置样式。实例化地图,如`var map = new BMap.Map('container'...

百度地图SDK API使用教程
首先,注册百度账号用户,登录百度地图开放平台官网,输入账号密码完成登录。若非开发者用户,点击立即注册,按照流程完成开发者注册。接着,登录后进行个人或企业认证,提升免费配额和并发。然后,获取服务密钥(AK),步骤包括:登录API控制台,创建应用,配置SHA1和包名,提交生成AK。最后,使用相关服务,开发...

百度地图API基本使用(二)
本文专注于百度地图API中的覆盖物模块,特别是点覆盖物、矢量图形覆盖物、叠加层、信息窗口、右键菜单以及轨迹运动等内容。将详细介绍如何使用百度地图API创建、配置和操作各种类型的覆盖物。首先,覆盖物的添加和删除方法是通用的,可以应用于各种类型的覆盖物。在获取容器后,创建覆盖物对象并使用容器对象的...

玩转百度地图API
在百度地图Place API中,通过向指定URL地址发送GET请求即可获取数据。请求参数包括城市名称、检索关键字、分类偏好等。此外,API还提供其他检索方式,具体可参考lbsyun.baidu.com\/index...中的服务文档。获取北京市的公园数据的代码示例如下:输出结果为:接下来,获取所有拥有公园的城市,数据存储到txt文本中...

百度地图API如何使用
1)下载百度地图移动版API(Android)开发包 要在Android应用中使用百度地图API,就需要在工程中引用百度地图API开发包,这个开发包包含两个文件:baidumapapi.jar和libBMapApiEngine.so。2)申请API Key 和使用Google map api一样,在使用百度地图API之前也需要获取相应的API Key。百度地图API Key与你...

相似回答