tablueau地图标记圆形_高德地图实现自定义小蓝点 自定义点标记 绘制多边形/圆形区域 根据地图的移动显示或者隐藏自定义点标记的相关实现...
最近項(xiàng)目中有需要應(yīng)用到高德地圖的模塊,在參考別的app地圖相關(guān)模塊實(shí)現(xiàn)過(guò)程中,自己產(chǎn)生了一些想法。首先說(shuō)明要實(shí)現(xiàn)的功能需求。類似支付寶app內(nèi)的跑腿功能,在全市的所有商鋪,電梯廣告等任意地點(diǎn)發(fā)布任務(wù),參與者要根據(jù)地圖上的標(biāo)記接取任務(wù)后到達(dá)指定地點(diǎn),完成任務(wù),獲取報(bào)酬。
首先我想到的是共享單車app的找附近的車功能。
4011528126383_.pic_hd.jpg
分析其實(shí)現(xiàn)原理應(yīng)該是獲取用戶當(dāng)前坐標(biāo),然后將坐標(biāo)發(fā)送至服務(wù)器,服務(wù)器計(jì)算這個(gè)用戶周圍1公里范圍內(nèi)空閑的單車,然后將坐標(biāo)繪制在地圖上,最后導(dǎo)航引導(dǎo)用戶找到該車。但是共享單車數(shù)量龐大,一個(gè)城市或許會(huì)有幾百萬(wàn)輛或者幾千萬(wàn)輛,但是我們所做的體量比較小,或許有另外的方式實(shí)現(xiàn)此功能。
使用高德地圖SDK,具體集成方法和相關(guān)配置請(qǐng)參考官方文檔,這里不做介紹。首先我們需要1000個(gè)模擬數(shù)據(jù) 沈陽(yáng)市的經(jīng)緯度范圍是 東經(jīng)122° 25′ --- 123° 48′, 北緯41°12′ --- 42° 17′
我們根據(jù)這個(gè)范圍隨機(jī)生成1萬(wàn)個(gè)坐標(biāo),然后先在地圖上自定義視圖標(biāo)記出來(lái),但是不要顯示,這里先全部顯示看一下 ps:此圖手抖多打個(gè)0,是1萬(wàn)個(gè)坐標(biāo)點(diǎn)...
3991528126362_.pic_hd.jpg
然后在當(dāng)前地圖的中心點(diǎn)繪制一個(gè)半徑為3km的圓形, 在地圖移動(dòng)的時(shí)候,這個(gè)圓心也隨之變化,這個(gè)時(shí)候遍歷這些數(shù)據(jù),如果這個(gè)數(shù)據(jù)的坐標(biāo)在圓的范圍內(nèi)那么就顯示,反之就隱藏。
4031528126386_.pic_hd.jpg
這樣做的好處是只需要從服務(wù)器拿取一次數(shù)據(jù),數(shù)據(jù)量小的時(shí)候也很流暢,減輕了服務(wù)器的運(yùn)算,但是弊端就是數(shù)據(jù)量龐大的時(shí)候會(huì)非常占用手機(jī)的內(nèi)存,這也是我最開(kāi)始沒(méi)有考慮到的一點(diǎn),
屏幕快照 2018-06-05 上午12.01.55.png
為了穩(wěn)定不建議這樣處理,除非數(shù)據(jù)量小的時(shí)候,我用iphone6測(cè)試 數(shù)據(jù)量達(dá)到500就開(kāi)始卡頓,用iphoneX 數(shù)據(jù)量1000還可以接受,為了向下兼容不建議這種做法,還是老實(shí)向服務(wù)器請(qǐng)求數(shù)據(jù)比較好些。寫(xiě)這個(gè)文章主要還是想多了解下高德的API,加深下理解,以后再使用高德SDK的時(shí)候更加熟練。如果哪位大神看到這篇文章有好的優(yōu)化方案請(qǐng)賜教,十分感謝,如果感覺(jué)垃圾,求輕噴。下面就開(kāi)始代碼部分
創(chuàng)建地圖視圖
//初始化地圖
_mapView = [[MAMapView alloc] initWithFrame:self.view.bounds];
_mapView.userTrackingMode = MAUserTrackingModeFollow;
//如果您需要進(jìn)入地圖就顯示定位小藍(lán)點(diǎn)，則需要下面兩行代碼
_mapView.showsUserLocation = YES;
_mapView.showsScale = NO;
_mapView.zoomLevel = 13;
_mapView.showTraffic = YES;
_mapView.showsCompass = NO;
_mapView.delegate = self;
//_mapView.desiredAccuracy = 100;
///把地圖添加至view
[self.view addSubview:_mapView];
//自定義定位小藍(lán)點(diǎn)
//初始化 MAUserLocationRepresentation 對(duì)象
MAUserLocationRepresentation *r = [[MAUserLocationRepresentation alloc] init];
r.showsAccuracyRing = NO;///精度圈是否顯示，默認(rèn)YES
r.showsHeadingIndicator = YES;///是否顯示方向指示 (MAUserTrackingModeFollowWithHeading模式開(kāi)啟)。默認(rèn)為YES
//r.fillColor = [UIColor redColor];///精度圈 填充顏色, 默認(rèn) kAccuracyCircleDefaultColor
r.image = [UIImage imageNamed:@"endPoint"];
//定位圖標(biāo), 與藍(lán)色原點(diǎn)互斥
// [_mapView updateUserLocationRepresentation:r];`
CLLocationCoordinate2D coor = _mapView.centerCoordinate;
//以初始地圖中心點(diǎn)為圓心 繪制半徑為3km米的圓
_circleView = [MACircle circleWithCenterCoordinate:coor radius:3000];
[self.mapView addOverlay:_circleView];
獲取模擬數(shù)據(jù)
//沈陽(yáng)位于東經(jīng)122゜25'---123゜48’，北緯41゜12’，---42゜17’，之間
self.annotations = [NSMutableArray array];
for (int i = 0; i < 1000; i ++) {
CGFloat ls = [self randomBetween:41 AndBigNum:42 AndPrecision:1000000];
CGFloat lw = [self randomBetween:123 AndBigNum:124 AndPrecision:1000000];
MAPointAnnotation *a1 = [[MAPointAnnotation alloc] init];
a1.coordinate = (CLLocationCoordinate2D){ls,lw};
a1.title = [NSString stringWithFormat:@"anno: %d", i];
a1.subtitle = [NSString stringWithFormat:@"自定義點(diǎn)標(biāo)記內(nèi)容: %d",I];
[self.annotations addObject:a1];
}
獲取指定范圍內(nèi)坐標(biāo)點(diǎn)的函數(shù)
- (float)randomBetween:(float)smallNum AndBigNum:(float)bigNum AndPrecision:(NSInteger)precision{
//求兩數(shù)之間的差值
float subtraction = bigNum - smallNum;
//取絕對(duì)值
subtraction = ABS(subtraction);
//乘以精度的位數(shù)
subtraction *= precision;
//在差值間隨機(jī)
float randomNumber = arc4random() % ((int) subtraction + 1);
//隨機(jī)的結(jié)果除以精度的位數(shù)
randomNumber /= precision;
//將隨機(jī)的值加到較小的值上
float result = MIN(smallNum, bigNum) + randomNumber;
//返回結(jié)果
return result;
}
#pragma mark - MAMapViewDelegate
//繪制區(qū)域圖形的相關(guān)屬性配置 可以是矩形 多邊形 圓形
- (MAOverlayRenderer *)mapView:(MAMapView *)mapView rendererForOverlay:(id )overlay
{
if ([overlay isKindOfClass:[MACircle class]]) {
MACircleRenderer * polygonRenderer = [[MACircleRenderer alloc]initWithCircle:overlay];
polygonRenderer.lineWidth = 1.f;
// polygonRenderer.strokeColor = [UIColor yellowColor];
polygonRenderer.fillColor = [UIColor colorWithRed:0.73 green:0.73 blue:0.73 alpha:0.2];
return polygonRenderer;
}
return nil;
}
/*!
@brief 根據(jù)anntation生成對(duì)應(yīng)的View
@param mapView 地圖View
@param annotation 指定的標(biāo)注
@return 生成的標(biāo)注View
*/
- (MAAnnotationView*)mapView:(MAMapView *)mapView viewForAnnotation:(id )annotation {
//定位藍(lán)點(diǎn) 如果不在此判斷 自身的定位點(diǎn)樣式會(huì)被其他自定義的樣式修改
if ([annotation isKindOfClass:[MAUserLocation class]]) {
return nil;
}
if ([annotation isKindOfClass:[MAPointAnnotation class]]){
static NSString *reuseIndetifier = @"annotationReuseIndetifier";
MAAnnotationView *annotationView = (MAAnnotationView *)[mapView dequeueReusableAnnotationViewWithIdentifier:reuseIndetifier];
if (annotationView == nil){
annotationView = [[MAAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:reuseIndetifier];
}
annotationView.image = [UIImage imageNamed:@"qwuh"];
annotationView.canShowCallout = YES;
annotationView.draggable = YES;
annotationView.rightCalloutAccessoryView = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
//設(shè)置中心點(diǎn)偏移，使得標(biāo)注底部中間點(diǎn)成為經(jīng)緯度對(duì)應(yīng)點(diǎn)
annotationView.centerOffset = CGPointMake(0, -18);
return annotationView;
}
return nil;
}
//點(diǎn)擊屏幕獲取經(jīng)緯度 (手動(dòng)獲取模擬數(shù)據(jù)使用)
- (void)mapView:(MAMapView *)mapView didSingleTappedAtCoordinate:(CLLocationCoordinate2D)coordinate{
NSLog(@"%f ---- %f",coordinate.latitude,coordinate.longitude);
//41.737987 ---- 123.422523
//41.765668 ---- 123.434932
//41.794761 ---- 123.409902
}
/**
* @brief 地圖區(qū)域改變過(guò)程中會(huì)調(diào)用此接口 since 4.6.0
* @param mapView 地圖View
*/
- (void)mapViewRegionChanged:(MAMapView *)mapView{
//移動(dòng)地圖 根據(jù)新的中心點(diǎn)坐標(biāo) 改變所繪制圖形的位置
[self.circleView setCircleWithCenterCoordinate:mapView.centerCoordinate radius:3000];
//遍歷所有的自定義坐標(biāo)點(diǎn)
for (int i = 0; i < self.annotations.count; i ++) {
MAPointAnnotation *a1 = self.annotations[I];
CLLocationCoordinate2D loc1 = a1.coordinate;
// [self.mapView addAnnotation:a1];
if(MACircleContainsCoordinate(loc1, self.circleView.coordinate, 3000)) {
NSLog(@"在區(qū)域內(nèi) 新增自定義坐標(biāo)點(diǎn)");
[self.mapView addAnnotation:a1];
} else {
NSLog(@"不在區(qū)域內(nèi) 移除自定義坐標(biāo)點(diǎn)");
[self.mapView removeAnnotation:a1];
}
}
}
或許會(huì)用到的相關(guān)代理方法
/**
* @brief 地圖移動(dòng)結(jié)束后調(diào)用此接口
* @param mapView 地圖view
* @param wasUserAction 標(biāo)識(shí)是否是用戶動(dòng)作
*/
- (void)mapView:(MAMapView *)mapView mapDidMoveByUser:(BOOL)wasUserAction{
if (wasUserAction) {
//當(dāng)前地圖的中心點(diǎn)，改變?cè)撝禃r(shí)，地圖的比例尺級(jí)別不會(huì)發(fā)生變化
}
}
/**
* @brief 定位失敗后，會(huì)調(diào)用此函數(shù)
* @param mapView 地圖View
* @param error 錯(cuò)誤號(hào)，參考CLError.h中定義的錯(cuò)誤號(hào)
*/
- (void)mapView:(MAMapView *)mapView didFailToLocateUserWithError:(NSError *)error{
NSLog(@"定位失敗");
}
/**
* @brief 地圖初始化完成(在此之后，可以進(jìn)行坐標(biāo)計(jì)算)
* @param mapView 地圖View
*/
- (void)mapInitComplete:(MAMapView *)mapView{
// NSLog(@"當(dāng)前經(jīng)緯度%lf--%lf",mapView.userLocation.coordinate.latitude,mapView.userLocation.coordinate.longitude);
}
/*!
@brief 當(dāng)mapView新添加annotation views時(shí)調(diào)用此接口
@param mapView 地圖View
@param views 新添加的annotation views
*/
- (void)mapView:(MAMapView *)mapView didAddAnnotationViews:(NSArray *)views {
}
/*!
@brief 當(dāng)選中一個(gè)annotation views時(shí)調(diào)用此接口
@param mapView 地圖View
@param views 選中的annotation views
*/
- (void)mapView:(MAMapView *)mapView didSelectAnnotationView:(MAAnnotationView *)view {
}
/*!
@brief 當(dāng)取消選中一個(gè)annotation views時(shí)調(diào)用此接口
@param mapView 地圖View
@param views 取消選中的annotation views
*/
- (void)mapView:(MAMapView *)mapView didDeselectAnnotationView:(MAAnnotationView *)view {
}
/*!
@brief 標(biāo)注view的accessory view(必須繼承自UIControl)被點(diǎn)擊時(shí)調(diào)用此接口
@param mapView 地圖View
@param annotationView callout所屬的標(biāo)注view
@param control 對(duì)應(yīng)的control
*/
- (void)mapView:(MAMapView *)mapView annotationView:(MAAnnotationView *)view calloutAccessoryControlTapped:(UIControl *)control {
}
https://github.com/ReReReReReRe/GDMapDemo/tree/master/PaiPaiPai
總結(jié)
以上是生活随笔為你收集整理的tablueau地图标记圆形_高德地图实现自定义小蓝点 自定义点标记 绘制多边形/圆形区域 根据地图的移动显示或者隐藏自定义点标记的相关实现...的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： url中 斜杠如何传输_如何在父子页面中
- 下一篇： 语言条件语序心得_教师心得：提高34岁幼