en

hi, it seems you are using microsoft internet explorer. it doesn't match web standard and causes problems browsing this site. please please please use mozilla firefox or google chrome instead. thank you!

zh

哦哦!您正在使用Internet Explorer 瀏覽器,它與我們的網頁標準並不相容,可能會導致畫面顯示不正常。
請改用 Mozilla Firefox 或者 Google Chrome 才能正常瀏覽本網站,謝謝!

1.11.2011

MapView 上使用圖片取代原大頭針註解 Pin 圖示


延續上一篇 MapView 地圖註解大頭針 Pin 的相關設定的文章,由於原先的大頭針註解 Pin 只有三中顏色(紅、紫、綠)可選,為了能讓 MapView 能有更多的變化,這裡就是範如何使用圖片來取代原先的大頭針,其程式碼如下。

//建立MapPin時會呼叫的函式
- (MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id <mkannotation>)annotation {

    //判斷Pin如果是目前位置就不修改
    if ([annotation isKindOfClass:[MKUserLocation class]]) {
         return nil;
    }

    MKPinAnnotationView *pinView = [[MKPinAnnotationView alloc]
        initWithAnnotation:annotation reuseIdentifier:@"annotation"];

    UIImage *image = [UIImage imageNamed:@"MapPin.png"];
    UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
    [image release];

    //重設圖片大小與座標
    imageView.frame = CGRectMake(0, 0, 30, 30);

    //設定PinView圖片
    pinView.image = [UIImage imageNamed:@"MapPin.png"];

    //設定註解內的圖片
    pinView.rightCalloutAccessoryView = imageView;
    [imageView release];

    //點擊時是否出現註解
    pinView.canShowCallout = YES;

    return pinView;
}

在這裡有兩點非常重要,第一必須確保 MapView 的類型是在標準狀態,設定方式如下。

map.mapType = MKMapTypeStandard;
若 MapView 的類型是在標準狀態下,則全部的 PinView 將無法套用新的影像,只會維持原大頭真的圖示。

另一點就是在函式中最好不要設定可被拖曳 animatesDrop,如果做了此設定很有可能造成部份PinView將無法套用新的影像,只會維持原大頭真的圖示。






2 則留言:

  1. if ([annotation isKindOfClass:[MKUserLocation class]]) {
    //修改原來的藍點圖示
    return nil;
    }
    我在這改了圖示 但我移動座標 圖片卻不會跟移動
    請問我該如何編寫程式碼
    圖片才會跟著GPS坐標移動

    回覆刪除
    回覆
    1. 湯 鎮謙 您好:

      首先對文章的措詞造成您的誤會,非常抱歉。

      if ([annotation isKindOfClass:[MKUserLocation class]]) {
      return nil;
      }

      上述程式碼的原意是,如果目標 annotation 判斷是「當前位置這個藍點」的圖示,我們就不給予任何的更動,而這整個 function 只有在「建立MapPin時才會被呼叫」,意思就是它必不會隨著您 gps 的座標更動就被觸發,因此您自設的圖示當前座標標示自然不會耕著移動。

      至於當前位置的更新你可以參考此篇:
      http://furnacedigital.blogspot.tw/2010/12/mapkit.html

      或是其他相關文章
      http://furnacedigital.blogspot.tw/search/label/M_GoogleMap


      ps:這篇文章真的很久了,現在也已經不是 google map了,但是其中的函式庫其實差異不大,如果您也同時在尋找 google map 的 api,可以參考以下這篇:
      http://furnacedigital.blogspot.tw/2012/10/classicmap-google.html

      刪除