Movable Type Data API連携！店舗情報を地図に表示させよう！
2 likes1,134 views
【Swift&Movable Typeコラボ！】Swiftビギナーズ勉強会 第２０回 at 日本マイクロソフト株式会社で登壇させていただいた際のスライドです。 https://swift-beginners.doorkeeper.jp/events/55403 Movable Type Data APIに緯度経度情報を蓄積して、API経由データを取得、iPhoneに表示させるサンプルアプリを作成して、実装方法を共有しました。
![全国書店販売中！
~Swiftではじめるプログラミングの第⼀歩~
これからつくるiPhoneアプリ開発⼊⾨
[ Swift3 &Xcode8対応 ]
Swiftビギナーズ倶楽部から⽣まれた！
https://swiftbg.github.io/swiftbook/
書籍公式サイト
執筆しました🤗
サンプルアプリ
Tips公開](https://image.slidesharecdn.com/vol20movabletypedataapi-170114071617/85/Movable-Type-Data-API-4-320.jpg)
![// Cellが選択された際に呼び出されるdelegateメソッド
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
// 地図に渡す値を取得
map_latitude = Double(recipeList[indexPath.row].shop_latitude)!
map_longitude = Double(recipeList[indexPath.row].shop_longtude)!
shop_info = recipeList[indexPath.row].name
// 地図に画⾯遷移
performSegue(withIdentifier: "goMap", sender: nil)
}
// 地図に渡す値をセットするメソッド
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
let MapViewController:MapViewController = segue.destination as! MapViewController
MapViewController.latitude = map_latitude
MapViewController.longitude = map_longitude
MapViewController.shop_info = shop_info
}
検索画⾯から、地図に情報を引き渡す
３）位置情報からマップにピンを⽴てる！](https://image.slidesharecdn.com/vol20movabletypedataapi-170114071617/85/Movable-Type-Data-API-19-320.jpg)
![全国書店販売中！
~Swiftではじめるプログラミングの第⼀歩~
これからつくるiPhoneアプリ開発⼊⾨
[ Swift3 &Xcode8対応 ]
この本の機能を組み合わせてます😆
https://swiftbg.github.io/swiftbook/
書籍公式サイト
サンプルアプリ
Tips公開](https://image.slidesharecdn.com/vol20movabletypedataapi-170114071617/85/Movable-Type-Data-API-20-320.jpg)
Movable Type Data API連携！店舗情報を地図に表示させよう！
- 1. Movable Type Data API連携！ 店舗情報を地図に表⽰させよう！ 【Swift&Movable Typeコラボ！】 Swiftビギナーズ勉強会 第２０回 at ⽇本マイクロソフト株式会社
- 4. 全国書店販売中！ ~Swiftではじめるプログラミングの第⼀歩~ これからつくるiPhoneアプリ開発⼊⾨ [ Swift3 &Xcode8対応 ] Swiftビギナーズ倶楽部から⽣まれた！ https://swiftbg.github.io/swiftbook/ 書籍公式サイト 執筆しました🤗 サンプルアプリ Tips公開
- 9. DEMO
- 14. Data APIにアクセス // URLオブジェクトの⽣成 var URL = Foundation.URL(string: "http://(mtHost)/(mtPath)/mt-data-api.cgi/v3/search?search= (keyword_encode!)") ・・・省略 // リンクオブジェクトの⽣成 let req = URLRequest(url: URL!) // セッション情報を取り出し let session = URLSession(configuration: configuration, delegate: nil, delegateQueue: OperationQueue.main) // リクエストをタスクとして登録 let task = session.dataTask(with: req, completionHandler: { (data , request , error) in ・・・・取得した店舗情報をセットする処理 }) // ダウンロード開始 task.resume() エンドポイントを指定
- 15. ２）現在位置からの距離を計算 // 現在位置情報 let now_point: CLLocation = CLLocation(latitude: now_latitude, longitude: now_longitude) // ⾏き先位置情報 let go_point: CLLocation = CLLocation(latitude: go_latitude, longitude: go_longitude) // 現在地から⾏き先までの距離 distance = go_point.distance(from: now_point) CLLocationクラスを利⽤して 現在位置と⾏き先の距離を計算 🔰注意するポイント：緯度経度情報はDouble型で 取り扱う必要があります。
- 17. ３）位置情報からマップにピンを⽴てる！ // 位置情報や電⼦コンパスの機能を使いたい場合は CLLocationManagerクラスを使⽤ let locationManager = CLLocationManager() // 位置情報は、CLLocationDegrees型で保持 // 緯度 var latitude: CLLocationDegrees = 0 // 経度 var longitude: CLLocationDegrees = 0
- 18. // 位置情報を設定 let coordinate = CLLocationCoordinate2DMake(latitude, longitude) // 表⽰領域を設定 let span = MKCoordinateSpanMake(0.005, 0.005) let region = MKCoordinateRegionMake(coordinate, span) // ピンを利⽤するには、MKPointAnnotation let annotation = MKPointAnnotation() annotation.coordinate = CLLocationCoordinate2DMake(latitude, longitude) // 店舗情報をセット annotation.title = shop_info // ピンを⽴てる self.dispMap.setRegion(region, animated:true) self.dispMap.addAnnotation(annotation) CLLocationCoordinate2DMakeクラスを 利⽤してピンを⽴てる ３）位置情報からマップにピンを⽴てる！ 📱iOS9以降は、⾃由に⾊を変更可能
- 19. // Cellが選択された際に呼び出されるdelegateメソッド func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) { // 地図に渡す値を取得 map_latitude = Double(recipeList[indexPath.row].shop_latitude)! map_longitude = Double(recipeList[indexPath.row].shop_longtude)! shop_info = recipeList[indexPath.row].name // 地図に画⾯遷移 performSegue(withIdentifier: "goMap", sender: nil) } // 地図に渡す値をセットするメソッド override func prepare(for segue: UIStoryboardSegue, sender: Any?) { let MapViewController:MapViewController = segue.destination as! MapViewController MapViewController.latitude = map_latitude MapViewController.longitude = map_longitude MapViewController.shop_info = shop_info } 検索画⾯から、地図に情報を引き渡す ３）位置情報からマップにピンを⽴てる！
- 20. 全国書店販売中！ ~Swiftではじめるプログラミングの第⼀歩~ これからつくるiPhoneアプリ開発⼊⾨ [ Swift3 &Xcode8対応 ] この本の機能を組み合わせてます😆 https://swiftbg.github.io/swiftbook/ 書籍公式サイト サンプルアプリ Tips公開
- 23. Let's study together！ Thank you :)