【Swift】MapKitで経由地点を含めたルートディレクションの表示方法

この記事ではMapKitを使ってGoogle Mapのようにwaypoints(経由地点)を含めたルートをマップ上に絵画する方法を書いていきます。

Google Mapのように経由地点も含めて一括でルート計算出来れば楽なのですが、2019年9月時点では出発地点と目標地点のルートしか計算することが出来ません(私が知らないだけかもしれませんが)。

ですので、A、B、C地点がある場合、まず

①A → Bへのルートを計算。マップに絵画
②B → Cへのルートを計算。マップに絵画

 

上記のように、ルートを繋げて完成させていく形になります。

1. 準備

今回は皇居を回るようなルートを例に使っていきます。Google Mapでルート表示した際には下記の画像のようになります。

それぞれの地点の座標は以下です。

東京駅(A地点)   : 35.68124, 139.76672
皇居外苑(B地点): 35.68026, 139.75801
国立劇場(C地点): 35.6818, 139.74326
九段下駅(D地点): 35.69555, 139.75074

2. ピンを立てる

まずはマップにピンを立てるところから始めます。

 

配列の一番最初の座標の「東京駅」を中心に、それぞれの座標に赤いピンが立ちます。

 

3. ルート計算せずに線で繋げた場合

次に、それぞれのピンを地形に関係なく、ただ直線に結んで行きます。

 

人が通る道を考慮していないため、建物や水場の上に線が表示されています。

 

4. ルート計算した場合

次はちゃんと人が通れる道の上に線を引いていきしょう。

 

先ほどのような直線的なルートではなく、道路上にルートが絵画されています。

 

記事冒頭に貼ったGoogle Mapと見比べてみると少々ルートは異なるみたいですが、概ね同じですね。

ちなみに、移動手段は

  1. Any (なんでも)
  2. Automobile(車)
  3. Transit(バスなどの交通機関)
  4. Walking(徒歩)

から選ぶことができます。

おまけ:ルートがマップに収まるように

一番最初に立てるピンがマップの中心地点になっているため、のちに立てるピンの位置によってはマップが収まりきらないことがあるかもしれません。

なので、ピンを立てた後にルートがマップ無いに収まるように調整しましょう。

func makeMap()に以下を追加します。

最終的なMapViewControllerは以下です。

参考URL