深入浅出百度地图API开发系列(2):创建地图
上一篇文章里,先介绍了一下百度地图API开发所涉及到的一些基础概念,包括投影,坐标系等基础概念,再有了这些基础后,我们可以开始开发自己的web地图了。先来个代码示例(建议大家都是用百度地图API大众版2.0。大众版2.0对移动端的适配也进行了优化)
<!DOCTYPE html>
<html> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title>Map Coordinate</title>
<style type="text/css">
/*<![CDATA[*/ html {
height: 100%;
}
body {
height: 100%;
margin: 0px;
padding: 0px;
}
#map_container {
height: 100%;
}
/*]]>*/
</style> </head> <body>
<div id="map_container"></div>
</body>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=wWy2A8K94nhntYTYUHS19RXW"></script>
<script type="text/javascript">
var mp = new BMap.Map('map_container', {
enableHighResolution: true
});
mp.centerAndZoom('北京', 15);
</script> </html>
上面的代码非常简单,首先定义个一定大小的div,然后将div的id传入BMap.Map类生成map示例。最后map示例调用centerAndZoom设置地图中心点和缩放级别,设置完之后就可以显示一幅地图了,最简单的地图展示就完成。new一个Map实例的时候,第二个参数可以传入一些配置属性,上面的例子中就是开启了高清图配置。这样在Mac的高清屏下会加载高清图。当然默认值也是true,开启高清图的,所以不设置enableHighResolution也没关系。最后centerAndZoom的时候第一个参数可以是一个BMap.Point对象,也可以是一个字符串,字符串必需是一个地址名,如果传入的是字符串地址,API内部会首先拿这个地址名去调用后台服务获取地址名相关的属性,包括了地址所属区域的中心点坐标和一些附属信息。整个过程是异步获取的。所以相对于直接传入Point对象,字符串参数会多一次网络请求,当然整个的出图时间也就相对慢一些。
还需要注意的是,如果开发者需要使用百度地图api, ak这个东西是必须的,上面例子中的ak也是我在百度地图上面申请的,如果没有ak的话,使用地图API百度鉴权的时候是不能通过的,也就无法使用地图API的服务,申请ak的地址:申请ak. 申请ak的时候选择应用类型是浏览器端,勾选上Javascript API。 下面白名单表示你想对这个ak的使用地方进行限制,比如你只想这个ak在*.mysite.com 这样的域名下使用,那你就把*.mysite.com加入到refer白名单中,那么所有其他不属于这个refer的网站使用你的ak也是鉴权不通过的,如果你什么都不填,就无任何限制。申请ak如下图:
结语:所以说使用百度地图API非常简单,首先申请ak,按照ak去加载api脚本文件,http://api.map.baidu.com/api?v=2.0&ak=****。获取文件之后通过BMap.Map类生成相应的map对象,因为百度地图API中map对象是接管一切的,很多方法都是通过map对象去执行的。所以使用也非常简单。
深入浅出百度地图API开发系列(2):创建地图的更多相关文章
- 深入浅出百度地图API开发系列(1):前言
百度地图API目前在地图API领域越来越受到众多开发者的关注,许多应用都使用到了百度地图API服务,包括博主me,我自己使用做的是Javascript API,根据经验,我想整理出一份系列教程,如果能 ...
- 深入浅出百度地图API开发系列(3):模块化设计
在前面两张简单介绍了百度地图API的基础知识和使用之后,我们来分析一下百度地图API的基本架构,了解一下基本架构可以帮助我们更清晰的了解API的功能和调用过程,也就可以帮助我们在实际开发中可以更方便的 ...
- 百度地图API开发指南
简介什么是百度地图API? 百度地图API是一套由JavaScript语言编写的应用程序接口,它能够帮助您在网站中构建功能丰富.交互性强的地图应用.百度地图API包含了构建地图基本功能的各种接口,提供 ...
- 基于MFC与第三方类CWebPage的百度地图API开发范例
在进行百度地图API开发之前你需要到http://developer.baidu.com/map申请密匙 密匙申请之后就可以进行百度地图API的开发了. 下面我们以在visual c++6.0里进行地 ...
- 【百度地图API】如何快速创建带有标注的地图?——快速创建地图工具+如何标注商家
原文:[百度地图API]如何快速创建带有标注的地图?--快速创建地图工具+如何标注商家 摘要: 如果你不会程序,如果你不想写代码. 如果你想拥有一张自己的地图,如果你想在该地图上标注出你商店的位置. ...
- Arcgis for Androd API开发系列教程(一)——地图显示与GPS定位
序:最近呢,工作鸭梨不是怎么大,对于自己爱折腾的想法又冒出了水面,开始自己的android开发的学习之旅.但是呢,本人是做GIS的,所以呢,就打算从这方面入手看看,是不是有什么比较好玩的玩意呢,这才导 ...
- 使用react全家桶制作博客后台管理系统 网站PWA升级 移动端常见问题处理 循序渐进学.Net Core Web Api开发系列【4】:前端访问WebApi [Abp 源码分析]四、模块配置 [Abp 源码分析]三、依赖注入
使用react全家桶制作博客后台管理系统 前面的话 笔者在做一个完整的博客上线项目,包括前台.后台.后端接口和服务器配置.本文将详细介绍使用react全家桶制作的博客后台管理系统 概述 该项目是基 ...
- 【百度地图API】如何制作商圈地图?行政地图?
原文:[百度地图API]如何制作商圈地图?行政地图? 摘要: 想要显示某一个区域,并且鼠标放上去,该区域就会变色.这时,你就需要巧用多边形覆盖物,和它的鼠标事件了! 快来看看去哪儿网的实例吧:http ...
- 循序渐进学.Net Core Web Api开发系列【11】:依赖注入
系列目录 循序渐进学.Net Core Web Api开发系列目录 本系列涉及到的源码下载地址:https://github.com/seabluescn/Blog_WebApi 一.概述 本篇介绍如 ...
随机推荐
- Servlet & JSP - 转发与重定向的区别
本文转载自:http://blog.csdn.net/kobejayandy/article/details/13762043 转发 转发的原理,可以通过下图展示: 浏览器的请求发送给组件 1,组件 ...
- Nginx - Additional Modules, Content and Encoding
The following set of modules provides functionalities having an effect on the contents served to the ...
- spark集成hive遭遇mysql check失败的问题
问题: spark集成hive,启动spark-shell或者spark-sql的时候,报错: INFO MetaStoreDirectSql: MySQL check failed, assumin ...
- 为EditText设置OnTouchListener事件监听
在项目中需要在EditText输入前,判断某个值是否已经有值,有才可以输入,为NULL值则提示不让输入,先填写指定的编辑框 自己试过监听获取焦点事件,来设置setFocusable(true)或者se ...
- cv::mat转换成QImage的问题
在进行cv::mat转换为QImage过程中,经常出现问题: cv::Mat image; ...QImage img=QImage((const unsigned char*)(image.data ...
- Aliyun OSS SDK 异步分块上传导致应用异常退出
问题描述: 使用Aliyun OSS SDK的BeginUploadPart/EndUploadPart执行异步分块上传操作,程序出现错误并异常退出! 原因分析: Using .NET Framewo ...
- asp.net中Repeater控件用法笔记
大家可能都对datagrid比较熟悉,但是如果在数据量大的时候,我们就得考虑使用 repeater作为我们的数据绑定控件了.Repeater控件与DataGrid (以及DataList)控件的主要区 ...
- 【转帖】error C2296: “^”: 非法,左操作数包含“double”类型
想要实现 ,写的C++程序为 double x; x=2^3; 结果程序总是出现这样的错误:error C2296: “^”: 非法,左操作数包含“double”类型 后来才发现操作符“^”,在C++ ...
- 1_jz2440在linux下烧写裸机程序
常用的烧写方法有: 1.使用并口工具烧写:接线(参考百问网JZ2440V2开发板使用手册),使用oflash烧写(速度比较慢),可烧写.bin文件,从新上电观察效果.可烧写u_boot. 2.使用op ...
- C# Oracle海量数据瞬间插入到数据库的方法
C# 海量数据瞬间插入到数据库的方法 当我们在数据库中进行大量的数据追加时,是不是经常因为数据量过大而苦恼呢?而所谓的海量数据,一般也是上万级的数据,比如我们要添加一百万条数据,应该如何提高它的效率呢 ...