百度地图JavaScript开发入门教程

简介:         自从openGPS.cn小编在2011年的一个WEB项目中用到了百度地图做售楼数量分布显示功能之后,就一发不可收拾,在位置服务的领域一路走了5年之久。今天难得时间充裕,给WEB开发者分享一点自己的经验,希望能够给到新接触百度地图JavaScript开发的朋友们一些帮助。         百度地图JavaScript开发第一步,得会看资料。很多新手,是因为连

        自从openGPS.cn小编在2011年的一个WEB项目中用到了百度地图做售楼数量分布显示功能之后,就一发不可收拾,在位置服务的领域一路走了5年之久。今天难得时间充裕,给WEB开发者分享一点自己的经验,希望能够给到新接触百度地图JavaScript开发的朋友们一些帮助。


        百度地图JavaScript开发第一步,得会看资料。很多新手,是因为连基本的页面怎么打开都不知道,重度依赖搜索引擎去搜出来百度地图开发官方站点,从而记不住操作过程,回头却找不到用过的页面,不会操作。而且忘记了过程。导致开发过程重重受阻。这里建议新手们记住以下步骤:

        1,打开百度首页 (www.baidu.com

        2,右上角点击地图标签,切换到百度地图页面(http://map.baidu.com/

        3,左下角点击“地图开放平台”,进入地图开放平台首页(http://lbsyun.baidu.com/

        4,菜单栏一次选择“开发”>“Web开发”>“JavaScript API”,进入百度地图JavaScript API开发引导页(http://lbsyun.baidu.com/index.php?title=jspopular)这里要注意,这里才是入口。为了方便以后的开发,建议把这个页面额URL存入浏览器书签,以后的操作从这里开始,跳过前面介绍的1、2、3步骤。

        5,百度地图JavaScript API开发引导页。这个页面中,首次接触百度地图开发的朋友,先仔细阅读右侧内容。这里介绍了入门必备的ak参数,ak是入门必备,新手务必仔细阅读,按照官方提示去申请ak。其次,需要重点记住左侧菜单栏的两个栏目“类参考”和“示例DEMO”。对于项目上使用要求简单的工作,几乎完全参照“示例DEMO”就可以完成工作需求。如果有稍微复杂的需求,则使用“类参考”栏目进阶。“类参考”就是百度地图JavaScript API开发的技术文档,通过这个文档就可以使用百度地图开发出自己想要的功能了。


        百度地图JavaScript开发第二步:熟悉坐标系。

        首先纠正一个新手入门可能存在的认识错误,GPS是美国研制的全球卫星定位系统。经纬度是坐标,地理信息科学(GIS)上规定的对地球位置标注的一套坐标体系。坐标不是GPS所独有,而是GPS使用了地理坐标的经纬度来表示位置。国际上通用的一套标准是WGS-84,这套坐标系作为标杆,被全球各国所接受。GPS终端或获取的原始坐标,均为WGS-84标准的坐标系。之所以先介绍WGS84坐标,原因在于中国有个明文规定:严禁出版物、在线服务等使用WGS84坐标。因此新手在不清楚这个规定的前提下,很容易进入误区,发现自己的坐标画到地图上发现位置不准确。国家指定了一套坐标系,在WGS84基础上增加了非线性偏移量,简称“GCJ-02”。非线性偏移量,决定了该坐标系理论上不可逆运算,而且不能使用简单的经纬度增加固定值得方式转换。一般出版物,在线地图,至少使用此标准发行。

        百度地图所采用的坐标系,在GCJ-02的基础上再次增加了非线性偏移量,从而诞生百度地图体系里所独有的坐标系“百度经纬度坐标(bd09ll)”和“百度米制经纬度坐标(bd09mc)”。百度的各项服务,均使用百度重新制定的坐标系表示。百度JavaScript API中,提供了方法转换坐标,实际使用时候调用即可(坐标转换实例:http://lbsyun.baidu.com/jsdemo.htm#a5_2)。另外百度也提供了坐标转换的webapi,API文档地址:(http://lbsyun.baidu.com/index.php?title=webapi/guide/changeposition)。目前使用gcj02的在线地图:高德地图,腾讯地图,谷歌地图中国区域等。采用自定义坐标系的在线地图:百度地图,天地图,搜狗地图等。


        百度地图JavaScript开发第三步:腾飞。知道了前面两步之后,剩下的便是对照“类参考”进行快速开发的过程了。实现各种自定义功能。例如汽车位置平台厂家的功能:“汽车地位”、“车辆跟踪”、“轨迹回放”、“拥堵路况”、“海量位置展示”等等功能。这个过程,便是飞起来的过程。根据需求组合各种各样的炫酷的功能,就可以玩出花来了。


        原文链接:https://www.opengps.cn/Share/Article/View.aspx?id=14,内容更新以此链接为准。



目录
相关文章
|
9天前
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
103 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
3月前
|
Web App开发 JavaScript 前端开发
Node.js开发
Node.js开发
90 13
|
4月前
|
存储 JavaScript 前端开发
深入浅出Node.js后端开发
在数字化时代的浪潮中,后端开发作为连接用户与数据的桥梁,扮演着至关重要的角色。本文将以Node.js为例,深入探讨其背后的哲学思想、核心特性以及在实际项目中的应用,旨在为读者揭示Node.js如何优雅地处理高并发请求,并通过实践案例加深理解。无论你是初学者还是有一定经验的开发者,这篇文章都将为你提供新的视角和思考。
|
4月前
|
Web App开发 开发框架 JavaScript
深入浅出Node.js后端开发
本文将带你领略Node.js的魅力,从基础概念到实践应用,一步步深入理解并掌握Node.js在后端开发中的运用。我们将通过实例学习如何搭建一个基本的Web服务,探讨Node.js的事件驱动和非阻塞I/O模型,以及如何利用其强大的生态系统进行高效的后端开发。无论你是前端开发者还是后端新手,这篇文章都会为你打开一扇通往全栈开发的大门。
|
4月前
|
Web App开发 开发框架 JavaScript
深入浅出Node.js后端开发
在这篇文章中,我们将一起探索Node.js的奇妙世界。无论你是刚接触后端开发的新手,还是希望深化理解的老手,这篇文章都适合你。我们将从基础概念开始,逐步深入到实际应用,最后通过一个代码示例来巩固所学知识。让我们一起开启这段旅程吧!
|
3月前
|
Web App开发 JavaScript 前端开发
深入浅出Node.js后端开发
本文将带领读者从零基础开始,一步步深入到Node.js后端开发的精髓。我们将通过通俗易懂的语言和实际代码示例,探索Node.js的强大功能及其在现代Web开发中的应用。无论你是初学者还是有一定经验的开发者,这篇文章都将为你提供新的见解和技巧,让你的后端开发技能更上一层楼。
|
4月前
|
JavaScript 前端开发 API
深入理解Node.js事件循环及其在后端开发中的应用
本文旨在揭示Node.js的核心特性之一——事件循环,并探讨其对后端开发实践的深远影响。通过剖析事件循环的工作原理和关键组件,我们不仅能够更好地理解Node.js的非阻塞I/O模型,还能学会如何优化我们的后端应用以提高性能和响应能力。文章将结合实例分析事件循环在处理大量并发请求时的优势,以及如何避免常见的编程陷阱,从而为读者提供从理论到实践的全面指导。
|
4月前
|
Web App开发 JavaScript 前端开发
深入浅出Node.js后端开发
本文将带你走进Node.js的世界,从基础到进阶,逐步解析Node.js在后端开发中的应用。我们将通过实例来理解Node.js的异步特性、事件驱动模型以及如何利用它处理高并发请求。此外,文章还会介绍如何搭建一个基本的Node.js服务器,并探讨如何利用现代前端框架与Node.js进行交互,实现全栈式开发。无论你是初学者还是有一定经验的开发者,这篇文章都将为你提供新的视角和深入的理解。
120 4
|
4月前
|
前端开发 JavaScript 关系型数据库
基于 Vue2.0 + Nest.js 全栈开发的后台应用
Vue2 Admin 是一个基于 Vue2 和 Ant Design Pro 开发的前端项目,配合 Nest.js 构建的后端,提供了一个完整的全栈后台应用解决方案。该项目支持动态国际化、用户权限管理、操作日志记录等功能,适合全栈开发者学习参考。线上预览地址:https://vue2.baiwumm.com/,用户名:Admin,密码:abc123456。
|
4月前
|
开发框架 JavaScript 前端开发
TypeScript 是一种静态类型的编程语言,它扩展了 JavaScript,为 Web 开发带来了强大的类型系统、组件化开发支持、与主流框架的无缝集成、大型项目管理能力和提升开发体验等多方面优势
TypeScript 是一种静态类型的编程语言,它扩展了 JavaScript,为 Web 开发带来了强大的类型系统、组件化开发支持、与主流框架的无缝集成、大型项目管理能力和提升开发体验等多方面优势。通过明确的类型定义,TypeScript 能够在编码阶段发现潜在错误,提高代码质量;支持组件的清晰定义与复用,增强代码的可维护性;与 React、Vue 等框架结合,提供更佳的开发体验;适用于大型项目,优化代码结构和性能。随着 Web 技术的发展,TypeScript 的应用前景广阔,将继续引领 Web 开发的新趋势。
82 2

热门文章

最新文章