close
当前位置: 物联网在线 > 技术文库 > ios >

iOS-百度地图自定义气泡

iOS-百度地图自定义气泡

Paste_Image.png

文章简单实现百度地图添加标注和自定义气泡的功能,基本都是SDK 提供的方法,不做详细解释。

很久没有更新,具体教程请以官网文档为准,本文只提供设计思路。

1.添加多个标注和自定义气泡

添加自定义标注

[_mapView addAnnotations:array];

实现代理方法

#pragma mark -- BMKMapdelegate /** *根据anntation生成对应的View *@param mapView 地图View *@param annotation 指定的标注 *@return 生成的标注View */ -(BMKAnnotationView *)mapView:(BMKMapView *)mapView viewForAnnotation:(id <BMKAnnotation>)annotation { if ([annotation isKindOfClass:[BMKPointAnnotation class]]) { BMKPinAnnotationView *newAnnotationView = [[BMKPinAnnotationView alloc]initWithAnnotation:annotation reuseIdentifier:@"myAnnotation"]; newAnnotationView.animatesDrop = YES; newAnnotationView.annotation = annotation; //这里我根据自己需要,继承了BMKPointAnnotation,添加了标注的类型等需要的信息 MyBMKPointAnnotation *tt = (MyBMKPointAnnotation *)annotation; //判断类别,需要添加不同类别,来赋予不同的标注图片 if (tt.profNumber == 100000) { newAnnotationView.image = [UIImage imageNamed:@"ic_map_mode_category_merchants_normal.png"]; }else if (tt.profNumber == 100001){ } //设定popView的高度,根据是否含有缩略图 double popViewH = 60; if (annotation.subtitle == nil) { popViewH = 38; } UIView *popView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, ScreenWidth-100, popViewH)]; popView.backgroundColor = [UIColor whiteColor]; [popView.layer setMasksToBounds:YES]; [popView.layer setCornerRadius:3.0]; popView.alpha = 0.9; //自定义气泡的内容,添加子控件在popView上 UILabel *driverName = [[UILabel alloc]initWithFrame:CGRectMake(8, 4, 160, 30)]; driverName.text = annotation.title; driverName.numberOfLines = 0; driverName.backgroundColor = [UIColor clearColor]; driverName.font = [UIFont systemFontOfSize:15]; driverName.textColor = [UIColor blackColor]; driverName.textAlignment = NSTextAlignmentLeft; [popView addSubview:driverName]; UILabel *carName = [[UILabel alloc]initWithFrame:CGRectMake(8, 30, 180, 30)]; carName.text = annotation.subtitle; carName.backgroundColor = [UIColor clearColor]; carName.font = [UIFont systemFontOfSize:11]; carName.textColor = [UIColor lightGrayColor]; carName.textAlignment = NSTextAlignmentLeft; [popView addSubview:carName]; if (annotation.subtitle != nil) { UIButton *searchBn = [[UIButton alloc]initWithFrame:CGRectMake(170, 0, 50, 60)]; [searchBn setTitle:@"查看路线" forState:UIControlStateNormal]; searchBn.backgroundColor = mainColor; searchBn.titleLabel.numberOfLines = 0; [searchBn addTarget:self action:@selector(searchLine)]; [popView addSubview:searchBn]; } BMKActionPaopaoView *pView = [[BMKActionPaopaoView alloc]initWithCustomView:popView]; pView.frame = CGRectMake(0, 0, ScreenWidth-100, popViewH); ((BMKPinAnnotationView*)newAnnotationView).paopaoView = nil; ((BMKPinAnnotationView*)newAnnotationView).paopaoView = pView; return newAnnotationView; } return nil; }

实现点击标注和气泡协议

/** * 当选中一个annotation views时,调用此接口 * @param mapView 地图View * @param views 选中的annotation views */ - (void)mapView:(BMKMapView *)mapView didSelectAnnotationView:(BMKAnnotationView *)view { _shopCoor = view.annotation.coordinate; } /** * 选中气泡调用方法 * @param mapView 地图 * @param view annotation */ - (void)mapView:(BMKMapView *)mapView annotationViewForBubble:(BMKAnnotationView *)view { MyBMKPointAnnotation *tt = (MyBMKPointAnnotation *)view.annotation; if (tt.shopID) { BusinessIfonUVC *BusinessIfonVC = [[BusinessIfonUVC alloc]init]; BusinessIfonVC.shopId = tt.shopID; [self.navigationController pushViewController:BusinessIfonVC animated:YES]; } }

2.实现路线搜索,路径规划,获取街道名称等功能

通过经纬度获取地址,逆地理编码

-(void)getStartAddress { //起点地址 CLGeocoder *Geocoder = [[CLGeocoder alloc]init]; CLGeocodeCompletionHandler handler = ^(NSArray *place,NSError *error){ for(CLPlacemark *placemark in place){ NSString *tmp = [[NSString alloc]init]; tmp = placemark.subThoroughfare; if (tmp == nil) { tmp = @""; } NSString *startAdr = [[NSString alloc]initWithFormat:@"%@%@",placemark.thoroughfare,tmp]; _startCityText.text = placemark.locality; if ([startAdr isEqualToString:@"(null)"]) { _startAddrText.text = @"获取地址失败"; }else{ _startAddrText.text = startAdr; } } }; CLLocation *loc = [[CLLocation alloc]initWithLatitude:self.startCoor.latitude longitude:self.startCoor.longitude]; [Geocoder reverseGeocodeLocation:loc completionHandler:handler]; }

路径检索

- (void)onGetTransitRouteResult:(BMKRouteSearch*)searcher result:(BMKTransitRouteResult*)result errorCode:(BMKSearchErrorCode)error { NSMutableArray *lineArr = [[NSMutableArray alloc]init]; NSArray* array = [NSArray arrayWithArray:_mapView.annotations]; [_mapView removeAnnotations:array]; array = [NSArray arrayWithArray:_mapView.overlays]; [_mapView removeOverlays:array]; if (error == BMK_SEARCH_NO_ERROR) { for(int j = 0; j < [result.routes count];j++) { NSMutableArray *busTitleArr = [[NSMutableArray alloc]init]; NSMutableArray *lineStepsArr = [[NSMutableArray alloc]init]; NSMutableArray *stepsArr = [[NSMutableArray alloc]init]; //生成数据模型 LineInfoModel *lineInfo = [[LineInfoModel alloc]init]; BMKTransitRouteLine* plan = (BMKTransitRouteLine*)[result.routes objectAtIndex:j]; //数据模型:获得路线长度 lineInfo.distance = plan.distance; //数据模型:获得路线消耗时间 lineInfo.dates = plan.duration.dates; lineInfo.hours = plan.duration.hours; lineInfo.minutes = plan.duration.minutes; lineInfo.seconds = plan.duration.seconds; // 获得轨迹点 lineInfo.planStepsArr = plan.steps; // 计算路线方案中的路段数目 int size = [plan.steps count]; int planPointCounts = 0; for (int i = 0; i < size; i++) { BMKTransitStep* transitStep = [plan.steps objectAtIndex:i]; //数据模型:获得乘坐公交数组 DLog(@"%@",transitStep.vehicleInfo.title); if (transitStep.vehicleInfo.title) { [busTitleArr addObject:transitStep.vehicleInfo.title]; } //数据模型:获取换乘信息 if (transitStep.instruction) { transitStep.instruction = [transitStep.instruction stringByReplacingOccurrencesOfString:@"<font color=\"#313233\">" withString:@""]; [lineStepsArr addObject:transitStep.instruction]; } DLog(@"%@ %@",transitStep.vehicleInfo.title,transitStep.instruction); if(i==0){ RouteAnnotation* item = [[RouteAnnotation alloc]init]; item.coordinate = plan.starting.location; item.title = @"起点"; item.type = 0; // [_mapView addAnnotation:item]; // 添加起点标注 // // [stepsArr addObject:item]; }else if(i==size-1){ RouteAnnotation* item = [[RouteAnnotation alloc]init]; item.coordinate = plan.terminal.location; item.title = @"终点"; item.type = 1; [stepsArr addObject:item]; // [_mapView addAnnotation:item]; // 添加起点标注 // } RouteAnnotation* item = [[RouteAnnotation alloc]init]; item.coordinate = transitStep.entrace.location; item.title = transitStep.instruction; transitStep.instruction = [transitStep.instruction stringByReplacingOccurrencesOfString:@"<font color=\"#313233\">" withString:@""]; item.type = 3; [stepsArr addObject:item]; // [_mapView addAnnotation:item]; // // // //轨迹点总数累计 planPointCounts += transitStep.pointsCount; } lineInfo.vehicleInfoArr = busTitleArr; lineInfo.lineStepsArr = lineStepsArr; lineInfo.stepsArr = stepsArr; lineInfo.planPointCounts = planPointCounts; [lineArr addObject:lineInfo]; // //轨迹点 // BMKMapPoint * temppoints = new BMKMapPoint[planPointCounts]; // int i = 0; // for (int j = 0; j < size; j++) { // BMKTransitStep* transitStep = [plan.steps objectAtIndex:j]; // int k=0; // for(k=0;k<transitStep.pointsCount;k++) { // temppoints[i].x = transitStep.points[k].x; // temppoints[i].y = transitStep.points[k].y; // i++; // } } self.lineStatusArr = lineArr; // 通过points构建BMKPolyline // BMKPolyline* polyLine = [BMKPolyline polylineWithPoints:temppoints count:planPointCounts]; // [_mapView addOverlay:polyLine]; // 添加路线overlay // delete []temppoints; // } [_tableView reloadData]; } } - (void)onGetDrivingRouteResult:(BMKRouteSearch*)searcher result:(BMKDrivingRouteResult*)result errorCode:(BMKSearchErrorCode)error { NSArray* array = [NSArray arrayWithArray:_mapView.annotations]; [_mapView removeAnnotations:array]; array = [NSArray arrayWithArray:_mapView.overlays]; [_mapView removeOverlays:array]; if (error == BMK_SEARCH_NO_ERROR) { BMKDrivingRouteLine* plan = (BMKDrivingRouteLine*)[result.routes objectAtIndex:0]; // 计算路线方案中的路段数目 int size = [plan.steps count]; int planPointCounts = 0; for (int i = 0; i < size; i++) { BMKDrivingStep* transitStep = [plan.steps objectAtIndex:i]; if(i==0){ RouteAnnotation* item = [[RouteAnnotation alloc]init]; item.coordinate = plan.starting.location; item.title = @"起点"; item.type = 0; [_mapView addAnnotation:item]; // 添加起点标注 }else if(i==size-1){ RouteAnnotation* item = [[RouteAnnotation alloc]init]; item.coordinate = plan.terminal.location; item.title = @"终点"; item.type = 1; [_mapView addAnnotation:item]; // 添加起点标注 } //添加annotation节点 RouteAnnotation* item = [[RouteAnnotation alloc]init]; item.coordinate = transitStep.entrace.location; item.title = transitStep.entraceInstruction; item.degree = transitStep.direction * 30; item.type = 4; [_mapView addAnnotation:item]; //轨迹点总数累计 planPointCounts += transitStep.pointsCount; } // 添加途经点 if (plan.wayPoints) { for (BMKPlanNode* tempNode in plan.wayPoints) { RouteAnnotation* item = [[RouteAnnotation alloc]init]; item = [[RouteAnnotation alloc]init]; item.coordinate = tempNode.pt; item.type = 5; item.title = tempNode.name; [_mapView addAnnotation:item]; } } //轨迹点 BMKMapPoint * temppoints = new BMKMapPoint[planPointCounts]; int i = 0; for (int j = 0; j < size; j++) { BMKDrivingStep* transitStep = [plan.steps objectAtIndex:j]; int k=0; for(k=0;k<transitStep.pointsCount;k++) { temppoints[i].x = transitStep.points[k].x; temppoints[i].y = transitStep.points[k].y; i++; } } // 通过points构建BMKPolyline BMKPolyline* polyLine = [BMKPolyline polylineWithPoints:temppoints count:planPointCounts]; [_mapView addOverlay:polyLine]; // 添加路线overlay delete []temppoints; } } - (void)onGetWalkingRouteResult:(BMKRouteSearch*)searcher result:(BMKWalkingRouteResult*)result errorCode:(BMKSearchErrorCode)error { NSArray* array = [NSArray arrayWithArray:_mapView.annotations]; [_mapView removeAnnotations:array]; array = [NSArray arrayWithArray:_mapView.overlays]; [_mapView removeOverlays:array]; if (error == BMK_SEARCH_NO_ERROR) { BMKWalkingRouteLine* plan = (BMKWalkingRouteLine*)[result.routes objectAtIndex:0]; int size = [plan.steps count]; int planPointCounts = 0; for (int i = 0; i < size; i++) { BMKWalkingStep* transitStep = [plan.steps objectAtIndex:i]; if(i==0){ RouteAnnotation* item = [[RouteAnnotation alloc]init]; item.coordinate = plan.starting.location; item.title = @"起点"; item.type = 0; [_mapView addAnnotation:item]; // 添加起点标注 }else if(i==size-1){ RouteAnnotation* item = [[RouteAnnotation alloc]init]; item.coordinate = plan.terminal.location; item.title = @"终点"; item.type = 1; [_mapView addAnnotation:item]; // 添加起点标注 } //添加annotation节点 RouteAnnotation* item = [[RouteAnnotation alloc]init]; item.coordinate = transitStep.entrace.location; item.title = transitStep.entraceInstruction; item.degree = transitStep.direction * 30; item.type = 4; [_mapView addAnnotation:item]; //轨迹点总数累计 planPointCounts += transitStep.pointsCount; } //轨迹点 BMKMapPoint * temppoints = new BMKMapPoint[planPointCounts]; int i = 0; for (int j = 0; j < size; j++) { BMKWalkingStep* transitStep = [plan.steps objectAtIndex:j]; int k=0; for(k=0;k<transitStep.pointsCount;k++) { temppoints[i].x = transitStep.points[k].x; temppoints[i].y = transitStep.points[k].y; i++; } } // 通过points构建BMKPolyline BMKPolyline* polyLine = [BMKPolyline polylineWithPoints:temppoints count:planPointCounts]; [_mapView addOverlay:polyLine]; // 添加路线overlay delete []temppoints; } }

3.路径规划


(责任编辑:ioter)

用户喜欢...

10 行 Python 代码创建可视化地图

作者:renwofei423 import vincent world_countries = r...


百度AMD合建GPU技术实验室

AMD全球副总裁兼大中华区总裁潘晓明表示:“AMD是同时拥有GPU和x86 CPU精深技术的公司,可以满足数据中心广泛需求,...


用Python画一个中国地图

为什么是Python 先来聊聊为什么做数据分析一定要用Python或R语言。编程语言这么多种,Java, PHP都很成熟,但是为什么...


大数据看七夕:单身地图出炉,高校软件园单身狗最多

作者:杨琳 今天是七夕,单身人士们做好准备回避恋人们的集体秀恩爱,又或者自己来一场邂逅遇见自己的命定情人...


AMD 携手百度 推动AMD Radeon Instinct GPU技术助力百度AI战略

今天,在北京召开的“迎接数据中心新纪元——AMD EYPC (霄龙)技术峰会”上,AMD公司(NASDAQ: AMD)与百度宣布双方将携...


展讯与百度达成车联网深度合作 助力百度Apollo生态

展讯通信(以下简称“展讯”),作为中国领先的2G、3G和4G无线通信终端的核心芯片供应商之一,近日在2017展讯全球...


大数据早报:百度或陷搜索漏洞危机 亚马逊开启全新智能购物链「无人驾驶」模式(8.22)

数据早知道,上36dsj看早报! 来源36大数据,作者:奥兰多 『百度』百度或陷搜索漏洞危机:新闻搜索结果极不稳定...


前百度首席科学家吴恩达的小目标:培养数百万人工智能熟练工人

顶级人工智能项目谷歌大脑和百度大脑的掌舵人,“降维竞争”转行开了一家人工智能“蓝翔技校”IT经理网...


无人驾驶 | 我在哪?怎么开?HERE HD Live地图让无人驾驶车辆成为最有洞察力的决策者

“从前人们认为“无人驾驶 ”、“机器驾驶员解放人类驾驶员”这样的概念还遥不可及,然而英特尔正在让这样的构想落地。为了驱动车轮上的数据中心,英特尔当前在无人驾驶领域的发力...


FPGA火力支持 百度强化机器学习布局

中国搜索引擎大厂百度已将人工智能、机器学习视为公司未来发展的主要方向,并对相关领域进行大量投资。为了强...