百度地图API的第一次接触
因为项目的需求,第一次接触了百度API。
第一步:引用百度地图API的脚本
如果在局域网环境中,要把地图文件和js文件都要下载下来
<script type="text/javascript" src="http://api.map.baidu.com/api?key=*****************&v=1.0&services=false"></script>
这个要去百度开发者中心申请KEY

第二步:建立一个你随便取名的div来放地图
<div style="width: 520px; height: 340px; border: 1px solid gray" id="container"></div>
第三步:使用百度地图API来构建地图
//初始化地图,把地图放在第二步的div中
var map = new BMap.Map("container");
//依据经纬度,确定一个点
var point = new BMap.Point(116.404, 39.915);
//地图中心就是这个点,并且规定地图的放大级数是15
map.centerAndZoom(point, 15);
//界面2s后中心移动到一个新点
window.setTimeout(function(){
map.panTo(new BMap.Point(116.409, 39.918));
}, 2000);
//加载一些界面上的控件:缩放控件、比例尺控件、全局控件
map.addControl(new BMap.NavigationControl());
map.addControl(new BMap.ScaleControl());
map.addControl(new BMap.OverviewMapControl());
//在一个点上加一个标识
var marker = new BMap.Marker(point);
map.addOverlay(marker);
第四步:连网,用浏览器打开

百度地图API的第一次接触的更多相关文章
- 百度地图API的第一次接触——地图事件
0.初始化地图 var map = new BMap.Map("container"); var point = new BMap.Point(116.404, 39.915); ...
- 百度地图API的第一次接触——标注和信息窗的使用
1.定义js函数,用于在指定位置添加标注,在标注位置添加并打开信息窗口 function addMarker(point, index){ // 创建图标对象 var myIcon = new BMa ...
- 百度地图API的第一次接触——热区
1.代码很简单 var map = new BMap.Map("container"); var point = new BMap.Point(116.404, 39.915); ...
- 百度地图API的第一次接触——右键菜单
1.初始化地图 var map = new BMap.Map("container"); var point = new BMap.Point(116.404, 39.915); ...
- 百度地图API的第一次接触——自定义控件
1.定义一个控件类,即function function ZoomControl(){ // 设置默认停靠位置和偏移量 this.defaultAnchor = BMAP_ANCHOR_TOP_LEF ...
- 百度地图API位置偏移的校准算法
转自极客人原文 百度地图API位置偏移的校准算法 在开始使用百度地图API进行开发时可能会遇到一件相当奇怪的事情,使用百度定位的经纬度在地图上显示相当不准确,这一问题我在微信开发和安卓开始时都遇到过. ...
- 百度地图api简单使用方法
百度地图API的使用方法 百度地图API 开始学习百度地图API最简单的方式是看一个简单的示例.以下代码创建了一个520x340大小的地图区域并以天安门作为地图的中心: 1. <html&g ...
- C#调用百度地图API经验分享(一)
最近客户提了一个需求,要在网站中添加百度地图的显示,其实原来是有谷歌地图的,但由于谷歌在大陆遭到封杀,只好再给用户增加一个选择了. 下面我将自己最近整理的一些知识分享给大家. 如何使用百度地图API: ...
- 百度地图API的使用方法
百度地图API 开始学习百度地图API最简单的方式是看一个简单的示例.以下代码创建了一个520x340大小的地图区域并以天安门作为地图的中心: 1. <html> 2. <head& ...
随机推荐
- CentOS下安装python3.x版本
现在python都到了3.x版本,但是centos中自带的python仍然是2.7版本的,所以想把python换成3.x版本的. 但是这个地方有个坑,你要是直接编译安装了python3.x之后,估计你 ...
- JQuery如何获取按键的unicode编码?
$("selector").keyup(function(xxx){ var myEvent = xxx; var code = myEvent.keyCode; alert(co ...
- Tiny语言编译器简单介绍
1.简单介绍:编译器是将一种语言翻译成还有一种语言的程序.编译器将源程序的代码作为输出,从而产生用目标语言编写的等价程序.比如源码为C/C++等高级语言,那么目标语言就是目标机器的机器代码.也就是能够 ...
- NVR硬件录像机web无插件播放方案功能实现之相关接口注意事项说明
该篇博文主要用来说明EasyNVR硬件录像回放版本的相关接口说明和调用的demo: 方便用户的二次开发和集成. 软件根目录会包含接口文档的,因此,本文主要是对一些特定接口的说明和接口实现功能的讲解以及 ...
- Windows 下Nexus搭建Maven私服
nexus下载地址: http://www.sonatype.org/nexus/archived/#step2top 1. 为什么使用Nexus 如果没有私服,我们所需的所有构件都需要通过maven ...
- php调用短网址接口
<?php $ch=curl_init(); curl_setopt($ch,CURLOPT_URL,"http://dwz.cn/create.php"); curl_se ...
- Linux就该这么学--了解Shell脚本
有人曾经将Shell形容是人与计算机硬件的“翻译官”,Shell作为用户与Linux系统通讯的媒介.自身也定义了各种变量和参数,并提供了诸如循环.分支等高级语言才有的控制结构特性.如何正确的使用这些功 ...
- 20170326 ABAP调用外部webservice实例
调用外部webservice 使用Tcode: SICF SPROXSET 设置创建proxy 的权限 SE80 SOAMANAGER 一.目的:调用外部SRM系统的 webservice: ...
- python仪表盘
1.在这里可以看到pyecharts中有定义好的各种图标类. 复制上面代码,会出现“ModuleNotFoundError: No module named 'pyecharts'”. pip ins ...
- High Performance Browser Networking
Chapter 1. Primer on Latency and Bandwidth As a result, to improve performance of our applications, ...