300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > 百度地图API制作类似 百度地图的路线导航界面并实现简单的路线规划功能

百度地图API制作类似 百度地图的路线导航界面并实现简单的路线规划功能

时间:2020-09-23 08:37:41

相关推荐

百度地图API制作类似 百度地图的路线导航界面并实现简单的路线规划功能

之前我们讲了怎么在百度地图上设置Marker(如A点。。) 和弹出框(跟随Marker的,Marker移动的时候也是会跟着移动的),接着又觉得百度地图自带的放大缩小不(fei)是(chang)很(de)漂(chou)亮,我们自定义了放大缩小的控件,本篇我们将制作类似百度地图API制作类似百度地图的公交/驾车/行走/查询界面并实现简单的路线规划功能。

先来张截图:

这个界面的实现其实是使用的SlidingUpPanelLayout 开源库从而使得可以跟随手指下拉上划:

其实布局也没什么好讲的,自己到百度地图的APK包里扒拉扒拉图片就都有了,哈哈

<?xml version="1.0" encoding="utf-8"?><com.jsbtclient.cusViews.SlidingUpPanelLayout xmlns:android="/apk/res/android"xmlns:tools="/tools"xmlns:sothree="/apk/res-auto"android:id="@+id/map_sliding_layout"android:layout_width="match_parent"android:layout_height="match_parent"android:gravity="bottom"sothree:umanoPanelHeight="60dp"sothree:umanoShadowHeight="4dp" ><RelativeLayoutandroid:layout_width="match_parent"android:layout_height="match_parent" ><com.baidu.mapapi.map.MapViewandroid:id="@+id/map_mapView"android:layout_width="match_parent"android:layout_height="match_parent"android:apiKey="vNQtC8sQSODsLGBk01HYaBQt"android:clickable="true" /><FrameLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:layout_alignParentBottom="true"android:layout_alignParentLeft="true" ><com.jsbtclient.cusViews.ZoomControlViewandroid:id="@+id/map_zoomcontrol"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="right"android:layout_marginBottom="20dp"android:layout_marginRight="15dp" ></com.jsbtclient.cusViews.ZoomControlView><ImageViewandroid:id="@+id/map_relocation"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="left|top"android:layout_marginLeft="15dp"android:layout_marginTop="5dp"android:background="@drawable/map_relocation_bg"android:src="@drawable/baidu_map_relocation" /></FrameLayout></RelativeLayout><LinearLayoutandroid:id="@+id/map_slidePanel"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"android:padding="10dp" ><LinearLayoutandroid:id="@+id/slidingdrawer_menu"android:layout_width="match_parent"android:layout_height="wrap_content"android:orientation="horizontal"android:padding="10dp" ><ImageViewandroid:id="@+id/map_route_bus"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_weight="1"android:src="@drawable/map_route_bus_selector" /><ImageViewandroid:id="@+id/map_route_car"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_weight="1"android:src="@drawable/map_route_car_selector" /><ImageViewandroid:id="@+id/map_route_walk"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_weight="1"android:src="@drawable/map_route_walk_selector" /><TextViewandroid:id="@+id/map_route_search"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="@string/map_route_search"android:textColor="@color/call_fragment_bg_color"android:textSize="16sp" /></LinearLayout><Viewandroid:layout_width="match_parent"android:layout_height="0.1dp"android:background="@color/lightgray" /><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:background="@drawable/white_shadow_bg"android:orientation="horizontal"android:padding="10dp" ><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_weight="1"android:layout_gravity="center_vertical"android:orientation="vertical"><ImageViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:src="@drawable/map_route_start" /><ImageViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:src="@drawable/map_route_end" /></LinearLayout><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_weight="8"android:orientation="vertical"android:padding="10dp" ><EditTextandroid:id="@+id/map_my_address"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:background="@null"android:text="@string/map_my_address"android:textColor="@color/lightgrey"android:textSize="16sp" /><Viewandroid:layout_width="match_parent"android:layout_height="0.1dp"android:layout_marginBottom="20dp"android:layout_marginTop="20dp"android:background="@color/lightgray" /><EditTextandroid:id="@+id/map_target_address"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:background="@null"android:text="@string/map_company_address"android:textColor="@color/call_fragment_bg_color"android:textSize="16sp" /></LinearLayout><ImageViewandroid:id="@+id/map_route_exchange"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:layout_weight="1"android:src="@drawable/route_exchange" /></LinearLayout></LinearLayout></com.jsbtclient.cusViews.SlidingUpPanelLayout>

UI上的事就不重点说了,功能实现才是重点:

我们来理一下思路用户当前的位置是使用百度地图定位获取的,而目标位置则应该是用户自己输入的,我这里的实现比较简单,目的地或者出发地点是固定的就是公司地址,

但是原理是相同的只不过少一次网络请求而已。 现在假设用户目的地是指定地点(已知经纬度),那么我们需要查询的就是用户当前的位置,所以首先要定位用户当前位置。

/*** 开启定位,回调接口为MyLocationListener类 /接口*/private void StartLocation(){LocationClientOption option = new LocationClientOption();option.setLocationMode(LocationMode.Hight_Accuracy);//设置定位模式option.setCoorType("gcj02");//返回的定位结果是百度经纬度option.setScanSpan(1000);//设置发起定位请求的间隔时间为1000msoption.setIsNeedAddress(true); //是否需要返回地址mLocationClient.setLocOption(option);mLocationClient.start();//发起定位请求}

接着看回调接口:

/*** 定位回调监听* */public class MyLocationListener implements BDLocationListener {@Overridepublic void onReceiveLocation(BDLocation location) {//回调返回对象对象里包含多个属性,这里我们只需要经纬度userLatLng = new LatLng(location.getLatitude(), location.getLongitude());//这句代码可以忽略,我不知道定位可以拿到具体的地址,所以使用了 详细地址与经纬度转化的接口//其实location.getAddrStr();就可以拿到地址if(userLatLng != null){mGeoCoder.reverseGeoCode(new ReverseGeoCodeOption().location(userLatLng));}mLocationClient.stop();}}

接着看将经纬度转化为具体详细地址的回调接口:

@Overridepublic void onGetReverseGeoCodeResult(ReverseGeoCodeResult result) {if (result == null || result.error != SearchResult.ERRORNO.NO_ERROR) {Host.showToast(R.string.map_result_error);return;}baiduMap.addOverlay(new MarkerOptions().position(result.getLocation()).icon(BitmapDescriptorFactory.fromResource(R.drawable.baidu_map_marka)));baiduMap.setMapStatus(MapStatusUpdateFactory.newLatLng(result.getLocation()));mPosition = result.getAddress().toString();//以上代码忽略,这里的mPosition就是具体的地址PlanNode stNode = null, enNode = null; //声明两个节点,stNote 起始节点, enNode目的地节点if(!IsExchanged) //这里的if else 可忽略,是为了实现目标地址与当前地址互换效果而做的{myAddress.setText(mPosition);stNode = PlanNode.withLocation(userLatLng);//将经纬度对象传入enNode = PlanNode.withLocation(latLng);}else {targetAddress.setText(mPosition);enNode = PlanNode.withLocation(userLatLng);stNode = PlanNode.withLocation(latLng);}StartRouteSearch(stNode, enNode); //开始搜索}

/*** 发起路线规划请求,获取路线* 回调接口为onGetTransitRouteResult/onGetWalkingRouteResult/onGetDrivingRouteResult* @param stNode* @param enNode*/private void StartRouteSearch(PlanNode stNode, PlanNode enNode) {route = null;baiduMap.clear(); //每次重新搜索都清空地图上的所有标记以及路线if (searchType == SearchType.BUS) {mSearch.drivingSearch((new DrivingRoutePlanOption()).from(stNode).to(enNode)); //搜索驾车路线} else if (searchType == SearchType.CAR) {mSearch.transitSearch((new TransitRoutePlanOption()).from(stNode).city("无锡").to(enNode));//搜索公交路线} else if (searchType == SearchType.WALK) {mSearch.walkingSearch((new WalkingRoutePlanOption()).from(stNode).to(enNode));//搜索行走路线}}

这里的三钟搜索方式对应三个不同的回调接口,分别是:

@Overridepublic void onGetDrivingRouteResult(DrivingRouteResult dRouteResult) {if (dRouteResult == null || dRouteResult.error != SearchResult.ERRORNO.NO_ERROR) {Host.showToast(R.string.map_result_error);}if (dRouteResult.error == SearchResult.ERRORNO.AMBIGUOUS_ROURE_ADDR) {// 起终点或途经点地址有岐义,通过以下接口获取建议查询信息// result.getSuggestAddrInfo()return;}if (dRouteResult.error == SearchResult.ERRORNO.NO_ERROR) {// nodeIndex = -1;route = dRouteResult.getRouteLines().get(0); //获取路线DrivingRouteOverlay overlay = new DrivingRouteOverlay(baiduMap); routeOverlay = overlay;baiduMap.setOnMarkerClickListener(overlay);overlay.setData(dRouteResult.getRouteLines().get(0));//overLay 为在地图上的路径 ,这里为它设置数据overlay.addToMap(); //添加到地图overlay.zoomToSpan(); }}@Overridepublic void onGetWalkingRouteResult(WalkingRouteResult result) { if (result == null || result.error != SearchResult.ERRORNO.NO_ERROR) {Host.showToast(R.string.map_result_error);}if (result.error == SearchResult.ERRORNO.AMBIGUOUS_ROURE_ADDR) {// 起终点或途经点地址有岐义,通过以下接口获取建议查询信息// result.getSuggestAddrInfo()return;}if (result.error == SearchResult.ERRORNO.NO_ERROR) { //同上route = result.getRouteLines().get(0);WalkingRouteOverlay overlay = new WalkingRouteOverlay(baiduMap);baiduMap.setOnMarkerClickListener(overlay);routeOverlay = overlay;overlay.setData(result.getRouteLines().get(0));overlay.addToMap();overlay.zoomToSpan();}}@Overridepublic void onGetTransitRouteResult(TransitRouteResult result) {if (result == null || result.error != SearchResult.ERRORNO.NO_ERROR) {Host.showToast(R.string.map_result_error);}if (result.error == SearchResult.ERRORNO.AMBIGUOUS_ROURE_ADDR) {// 起终点或途经点地址有岐义,通过以下接口获取建议查询信息// result.getSuggestAddrInfo()return;}if (result.error == SearchResult.ERRORNO.NO_ERROR) { //同上route = result.getRouteLines().get(0);TransitRouteOverlay overlay = new TransitRouteOverlay(baiduMap);baiduMap.setOnMarkerClickListener(overlay);routeOverlay = overlay;overlay.setData(result.getRouteLines().get(0));overlay.addToMap();overlay.zoomToSpan();}}

这样一个基本的百度地图路径搜索就完成了.

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。