2009-08-12

iPhone アプリケーション

iPad アプリケーション

Windows 8 Store アプリケーション

クックパッド by COOKPAD Inc.

共著

2009-08-12

MapKitでルート案内をするライブラリを公開しました。

iPhone, Cocoa, Objective-C

MapKitフレームワーク単体では、標準のマップアプリのようなナビは作れないのですが、Google Maps APIと組み合わせることで、似たような機能を実現してみました。

GitHubのリポジトリで公開しています。

kishikawakatsumi/MapKit-Route-Directions ? GitHub

仕組みは、裏でJavascriptを実行して、Google Maps APIを叩いています。

結果としてルートの座標が緯度経度として返ってくるので、その値を使用して、MapViewの上にルートのラインを描画します。

Javascriptの実行エンジンにUIWebViewを使用します。

Google Maps APIのラッパーと、ラインをマップビューの上に描画する拡張から構成されています。

ラインの描画は下記の記事を参考にしました。

The Reluctant Blogger : Drawing polyines or routes on a MKMapView (Using Map Kit on the iPhone)

The Reluctant Blogger : Using MKAnnotation, MKPinAnnotationView and creating a custom MKAnnotationView in an MKMapView

使い方は下記のような感じです。

UICGDirectionsやUICGDirectionsOptionsというクラスがGoogle Maps APIのラッパーです。

APIの実行、および結果の取得に使用します。

NSString *startPoint = [NSString stringWithUTF8String:"セルリアンタワー"]
NSString *endPoint = [NSString stringWithUTF8String:"東京ディズニーランド"];

UICGDirections *diretions = [UICGDirections sharedDirections];
diretions.delegate = self;
UICGDirectionsOptions *options = [[[UICGDirectionsOptions alloc] init] autorelease];

[diretions loadWithStartPoint:startPoint endPoint:endPoint options:options];

以下のデリゲート・メソッドを用意しています。

オブジェクトの初期化の終了時、および結果を取得するたびに呼ばれるメソッドです。

- (void)directionsDidFinishInitialize:(UICGDirections *)directions;
- (void)directions:(UICGDirections *)directions didFailInitializeWithError:(NSError *)error;
- (void)directionsDidUpdateDirections:(UICGDirections *)directions;
- (void)directions:(UICGDirections *)directions didFailWithMessage:(NSString *)message;

マップビューに線を引くには次のようにします。

- (void)directionsDidUpdateDirections:(UICGDirections *)directions {
    // Overlay polylines
    UICGPolyline *polyline = [directions polyline];
    NSArray *routePoints = [polyline routePoints];

    routeOverlayView = [[UICRouteOverlayMapView alloc] initWithMapView:routeMapView];
    [routeOverlayView setRoutes:routePoints];

UICGDirectionsオブジェクトからUICGPolylineオブジェクトを取得します。

UICGPolylineオブジェクトからルートの頂点座標を取り出し、UICRouteOverlayMapViewクラスに渡します。

UICRouteOverlayMapViewクラスが、マップビューの上に線を描画します。

ちょっと面白いところでは３箇所以上のルートを検索できます。

下の例は、「セルリアンタワー」「東京ドーム」「品川駅」「東京ディズニーランド」を経由するルートです。