如何使用地图API
2021-09-23 17:47
枯木逢春我逢您
地图API
开始学习地图API最简单的方式是看一个简单的示例。以下代码创建了一个520x340大小的地图区域并以天安门作为地图的中心:
1. <>
2. <head>
3. <meta http-equiv="Content-Type" content="text/; charset=utf-8" />
4. <title>Hello, World</title>
5. <script type="text/javascript" src="链接"></script>
6. </head>
7. <body>
8. <div id="container"></div>
9. </body>
10. </>
1
1.
1
2.
<>
<head>
<meta http-equiv="Content-Type" content="text/; charset=utf-8" />
<title>Hello, World</title>
<script type="text/javascript" src="链接"></script>
</head>
<body>
<div id="container"></div>
</body>
</>
1. <script type="text/javascript">
2. var map = new BMap.Map("container"); // 创建地图实例
3. var nt = new BMap.Point(11
6.404, 3
9.915); // 创建点坐标
4. map.centerAndZoom(nt, 15); // 初始化地图，设置中心点坐标和地图级别
5. </script>
6.
<script type="text/javascript">
var map = new BMap.Map("container"); // 创建地图实例
var nt = new BMap.Point(11
6.404, 3
9.915); // 创建点坐标
map.centerAndZoom(nt, 15); // 初始化地图，设置中心点坐标和地图级别
</script>
引用地图API文件
当您引用地图API文件时，需要使用自己申请的API密钥。
1. <script type="text/javascript" src="链接"></script>
<script type="text/javascript" src="链接"></script>
创建地图容器元素
1. <div id="container"></div>
<div 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 nt = new BMap.Point(11
6.404, 3
9.915);
var nt = new BMap.Point(11
6.404, 3
9.915);
这里我们使用BMap命名空间下的Point类来创建一个坐标点。Point类描述了一个地理坐标点，其中11
6.404表示经度，3
9.915表示纬度。
地图初始化
1. map.centerAndZoom(nt,15);
map.centerAndZoom(nt,15);
在创建地图实例后，我们需要对其进行初始化，BMap.Map.centerAndZoom()方法要求设置中心点坐标和地图级别。
地图必须经过初始化才可以执行其他操作。
地图操作
地图被实例化并完成初始化以后，就可以与其进行交互了。API中的地图对象的外观与行为与地图网站上交互的地图非常相似。它支持鼠标拖拽、滚轮缩放、双击放大等交互功能。您也可以修改配置来改变这些功能。
您还可以通过编程的方式与地图交互。Map类提供了若干修改地图状态的方法。例如：setCenter()、panTo()、zoomTo()等等。
下面示例显示一个地图，等待两秒钟后，它会移动到新中心点。panTo()方法将让地图平滑移动至新中心点，如果移动距离超过了当前地图区域大小，则地图会直跳到该点。
1. var map = new BMap.Map("container");
2. var nt = new BMap.Point(11
6.404, 3
9.915);
3. map.centerAndZoom(nt, 15);
4. window.setTimeout(function(){
5. map.panTo(new BMap.Point(11
6.409, 3
9.918));
6. }, 2000);
var map = new BMap.Map("container");
var nt = new BMap.Point(11
6.404, 3
9.915);
map.centerAndZoom(nt, 15);
window.setTimeout(function(){
map.panTo(new BMap.Point(11
6.409, 3
9.918));
}, 2000);
原文：链接
2021-09-23 18:07:41
相关问答
•﹏•
打开地图并登录。点击右上角商户免费标注，进入商户中心。需要标注的指路人地图标注服务中心铺是否存在，如果存在可以直接认领。如果不存在可以在地图上填写信息，上传各种证明资料新增商户。提交申请后，需要5-7天的审核期，审核通过即可在地图查看到标注的商户。
2021-09-23 17:41:06 1121查看 1回答
Wendydydydy
打开大地图！！点鼠标左键或者右键！忘了！有个小圆点的！呵呵现在都不用精灵或者了！我是自己在网上下散装的了！
2021-09-23 17:42:09 495查看 1回答
锦色
要去code.google//maps--signup.这个地方输入你的Key的MD5码，就会得到一个密钥。使用GoogleMapApi是去服务器得到GoogleMap等着收件验证就可以了，之前还电话验证呢现在不电话验证了你还是填好地址耐心等待...
2021-09-23 17:42:33 577查看 2回答
此生
在搜索框输入“地图”查找到地图的网站。如下图：进入到上图的地图首页。如下图：把网页滚动到下面可以看见“申请密钥”功能，如下图：点击“申请密钥”按钮，进入登陆界面。没有帐号则注册一个。注册后继续跳到登录界面。如下图：成功登录则进入后台管理界面。...
2021-09-23 17:47:03 475查看 3回答
奕奕
如果想在自己的网页上面加入地图的话，可以用地图的.具体使用方法如下：第一步：进入创建地图的网站，搜索出自己要展示的位置。第二步：设置地图，大家可以对网站显示地图的宽高进行设置，其余选项不动。第三步：添加标注。点击第一个图标后，在右侧找到自己的位置，单击鼠标左键可...
2021-09-23 17:47:07 483查看 2回答
晶晶
链接
2021-09-23 17:47:11 455查看 2回答
milusky
首先现在手机上面安装地图，你可以在手机上面直接，或者是在电脑上面好，然后同步安装到手机上面；想要使用免费的地图，那么你就需要提前离线地图，那么就可以实现即使在没有网络的情况下，你也可以使用地图导航方向；打开地图点击“我”，在里面找到“离线地图”；点击进入“...
2021-09-23 17:51:43 727查看 1回答
邢小二
首先上手机商场一个地图，然后打开主页，如下图所示：方法/步骤2:在搜索栏上搜索你要想去的地方，比如我要“人和”，如下图所示：方法/步骤3:如下图所示就可以看到去人和的路线：方法/步骤4:还可以直接查到去人和的公交的信息，如下图所示：方法/步骤5:开始直接导航，如下图所示：...
2021-09-23 17:53:57 484查看 2回答
李鲤
1、首先，打开地图手机app，点击主界面下方的“路线”按钮。2、在弹出界面的最上方，我们要输入自己的出发地和目的地，然后在中间选项中找到适合自己的交通工具，驾车、公交或者骑行都可以。3、当我们选择驾车的时候，就会在界面上半部分出现地图路线，下半部分出现三种不同的路线供我们选择.....
2021-09-23 17:53:57 569查看 1回答
更多问答
最新知识
公司地址认领搜狗地图标注多久审核？公司地址认领地图标注多久审核？
小编为您整理我在地图上标注审核认领需要多久、我在地图上标注审核认领需要多久y、我在地图上标注审核认领需要多久i、我在地图上标注审核认领需要多久Y、搜狗地图标注要多久才显示相关地图标注知识，详情可查看下方正文！
2023-01-17
公司地址如何入驻花小猪打车地图标记？指路人地图标注服务中心铺如何入驻花小猪打车地图标记？
小编为您整理美团商家如何入驻，商家入驻教程、商家如何入驻地图、如何入驻地:、养殖营业执照如何入驻地图、家政公司如何入驻美团相关地图标注知识，详情可查看下方正文！
2023-01-17
门指路人地图标注服务中心如何做花小猪打车地图位置标记？门指路人地图标注服务中心花小猪打车地图位置地址标记？
小编为您整理如何做地图标记、地图如何做标记、so搜街景中如何做标记、360e启花贷款申请通过了是要去到门指路人地图标注服务中心办理手续的吗、哪些软件能实现在地图上标记门指路人地图标注服务中心位置相关地图标注知识，详情可查看下方正文！
2023-01-17
门指路人地图标注服务中心地图位置地址标记？门指路人地图标注服务中心苹果地图位置地址标记？
小编为您整理哪些软件能实现在地图上标记门指路人地图标注服务中心位置、门指路人地图标注服务中心地址标注、如何创建门指路人地图标注服务中心定位地址、如何创建门指路人地图标注服务中心定位地址、服装门指路人地图标注服务中心地址标注上地图怎么弄相关地图标注知识，详情可查看下方正文！
2023-01-17
凯立德地图位置定位怎么设置自己的指路人地图标注服务中心名？凯立德地图位置定位怎么设置公司地址？
小编为您整理凯立德怎么定位自己的位置啊、手机凯立德地图定位怎么设置往上走、地图位置定位怎么设置自己的指路人地图标注服务中心名、凯立德手机版如何定位自己的位置，求助、凯立德导航怎么设置指路人地图标注服务中心铺招牌相关地图标注知识，详情可查看下方正文！
2023-01-17