百度地图2

百度地图(2)

核心类Map:画地图必须调用的var map = new BMap.Map("allmap");其中allmap是想要画地图的dom节点的id。其中map可以控制整个地图的缩放、移动、以及是否加入一些自定义的图片,以及添加点击事件等等操作都需要这个对象,map是整个地图的核心对象。

定位

定位的方式有浏览器自带的方式Geolocation,还有根据详细地址或者经纬度来定位Geocoder

  • Geolocation:是调用了浏览器自带的定位接口,如果浏览器不支持会返回null
  • Geocoder:支持经纬度getLocation(point: Point, callback: Function, options: LocationOptions)以及地址的方式getPoint(address: String, callback: Function, city: String)

经纬度的定位的坐标是百度的坐标,如果是其他的经纬度可以掉调用百度的逆地址解析成百度坐标,但是这样定位就会有偏差。

最好的方式是先根据经纬度定位(画地图),如果不准确,让用户自己输入地址或者用户自己操作地图,来定位。其中地址定位是很准确的。调用Geocoder定位的结果会返回一个GeocoderResult对象,其中的包含了经纬度,省市区,以及周边的一些地方点surroundingPois,周边可以做个列表给用户选择。

可以说和定位相关的离不开这个对象Geocoder,可以去官方文档好好研究一番Geocoder文档

控件类

控件类就是在现画出的地图上添加一些操作面板(按钮等),操作地图的缩放,移动,以及切换全景模式等操作。如果要通过代码的方式操作,完全可以在map这个对象中操作。添加的时候也要通过addControl(control: Control),其实操作这些控件本质上是调用map中的方法。

覆盖物

覆盖物最常见的是红色水滴状的图标,或者一些公交的路线,这些就是覆盖物,而且这些覆盖物可以定义事件,点击这些覆盖物后可以有后续的操作。而且可以自定义覆盖物(图片覆盖物)

IconPoint是一些接口需要用到的参数,用这些构造函数生成的数据符合哪些接口的要求,其实类似接口interface

最后

地图的接口大多都集成在map这个对象中了,除了定位这些服务类,其他的类都是辅助map中的接口的。百度有哪些功能,看map服务类

如果想获取地图中某个点的信息,如我想知道地图中那个点的经纬度,可以通过给map定义一个点击事件,点击事件会返回当前点的信息给回调函数。记录这些经纬度点,你可以画路线图等等

在微信公众号中用百度地图:先用的微信的定位获取经纬度,再用百度的逆地址转为百度经纬度,最后用转化后的经纬度去定位以及画地图(居中当前定位点),最后的精准定位交给用户去决定,因为经纬度定位的效果会有误差,这很有必要。最好下方出现个周边的列表让用户去选择比较接近的地址,毕竟这些周边是大众都知道的。上方一个地址搜索框,根据输入的地址去定位以及移动地图的中心点,并且生成一个水滴覆盖物,当用户点击这个水滴覆盖物,确定最终的定位。其实根据地址去定位是最准确的,但是如果经纬度误差比较小效果是最好的。

效果:经纬度定位效果最好、如果有误差根据搜索栏地址去定位、最重要的是用户可以操作地图,自主定位。

原文地址:https://www.cnblogs.com/lantuoxie/p/9650394.html

时间: 2024-08-07 12:55:31

百度地图2的相关文章

百度地图API实现批量地址解析

1.前言 写这篇文章的原因是最近做一个GIS项目在网上爬取了一些数据,无奈只有地址的文字信息没有坐标信息,如何把信息显现在地图上呢?很纠结啊,查看了一下百度地图API惊奇的发现百度提供了地址解析的API,然后查看了他的Demo后豁然开朗,所以动手将自己的文字信息数据进行解析坐标信息.下面开始讲解. 2.方案 (1)自己数据库中的数据 (2)百度地图API Demo <!DOCTYPE html> <html> <head> <meta http-equiv=&qu

js中实现高德地图坐标经纬度转百度地图坐标

1 function tobdMap(x, y) { 2 var x_pi = 3.14159265358979324 * 3000.0 / 180.0; 3 var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * x_pi); 4 var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * x_pi); 5 var bd_lon = z * Math.cos(theta) + 0.00

Vue2.0与 [百度地图] 结合使用———vue+webpack+axios+百度地图实现组件之间的通信

Vue2.0与 [百度地图] 结合使用: 1.vue init webpack-simple vue-baidu-map 2.下载axios cnpm install axios; 3.在main.js中引入axios,并使用 import axios from 'axios' /* 把axios对象挂到Vue实例上面,其他组件在使用axios的时候直接 this.$http就可以了 */ Vue.prototype.$http = axios; 4.引入百度地图的js秘钥--->最好在inde

百度地图标注图标太小

1.1.1  现象 百度地图中,定位点的标注示意图标太小: 实际期望的图标是这样的: 1.1.2  原因 检查了很久,以为是打开地图时的设置问题,后来慢慢查找地图上的元素定位,终于发现原来这个图标大小是被CSS控制的,在地图元素的内部可以找到如下代码: 这个img元素就是用来显示定位图标的,可以修改这个元素的CSS属性来改变大小. 1.1.3  解决 如果要使用默认大小,则需要配置如下CSS: img {     max-width: inherit; } 原来图标变小,是因为其它CSS配置导致

Android 百度地图开发(一)--- 申请API Key和在项目中显示百度地图

标签: Android百度地图API Key  分类: Android 百度地图开发(2)  最近自己想研究下地图,本来想研究google Map,但是申请API key比较坑爹,于是从百度地图入手,其实他们的用法都差不多,本篇文章就带领大家在自己的Android项目中加入百度地图的功能,接下来我会写一系列关于百度地图的文章,欢迎大家到时候关注!   一 申请API key 在使用百度地图之前,我们必须去申请一个百度地图的API key,申请地址http://lbsyun.baidu.com/a

HTML5结合百度地图API创建地图应用

具体的百度地图API的使用方法查看百度地图API里的DEMO <style> #div1{ width:400px; height:400px; border:1px #000 solid;} </style> <script src="http://api.map.baidu.com/api?v=1.3"></script> <script> window.onload = function(){ var oInput =

百度地图SDK开发过程中遇到的问题解析

问题1. 在运行显示百度地图是出现如下错误,导致程序停止: 01-30 06:49:49.935: E/AndroidRuntime(9132): Caused by: java.lang.UnsatisfiedLinkError: Couldn't load BaiduMapSDK_v3_2_0_15 from loader dalvik.system.PathClassLoader[dexPath=/data/app/com.example.getsmsinfo-1.apk,libraryP

Android如何申请百度地图key

在开发过程中,有时候会使用到地图定位之类的功能,在使用百度地图之前,我们先要申请一个百度地图的key方才能使用,接下来,一步步教给大家如何去申请一个百度地图key 登录你的百度帐号,之后搜索---"百度地图api",如下图所示: 选择第一个,点击进去之后,往下拉,如图所示: 点击申请密钥,如图所示: 接下来如图所示: 接下去找Android SDK安全码,如图所示: 之后回到页面,将复制的东西拷贝到安全码那,之后写一个英文分号;   ,之后加上项目包名,就好,如下图: 点击提交之后,

Android百度地图开发(一)之初体验

转载请注明出处:http://blog.csdn.net/crazy1235/article/details/42614603 做关于位置或者定位的app的时候免不了使用地图功能,本人最近由于项目的需求需要使用百度地图的一些功能,所以这几天研究了一下,现写一下blog记录一下,欢迎大家评论指正! 一.申请AK(API Key) 要想使用百度地图sdk,就必须申请一个百度地图的api key.申请流程挺简单的. 首先注册成为百度的开发者,然后打开http://lbsyun.baidu.com/ap

Android应用中使用百度地图API定位自己的位置(二)

官方文档:http://developer.baidu.com/map/sdkandev-6.htm#.E7.AE.80.E4.BB.8B3 百度地图SDK为开发者们提供了如下类型的地图覆盖物: 我的位置图层(MyLocationOverlay):用于显示用户当前位置的图层(支持自定义位置图标): Poi搜索结果图层(PoiOverlay):用于显示兴趣点搜索结果的图层: 路线图层(RouteOverlay):公交.步行和驾车线路图层,将公交.步行和驾车出行方案的路线及关键点显示在地图上(起.终