map | NARA NEARBY COMMONS

SwiftでMKMapView上にピン（MKPointAnnotation）置いてみた

Posted on 2014/07/172014/12/27 by guest

はじめまして！

iPhoneアプリ開発歴約３年であるCokaholicのTKと申します！

私がAppStoreにリリースしたアプリは以下のサイトをチェックしてみてください！
https://itunes.apple.com/us/artist/keisuke-tatsumi/id574246116

さてさて、最近はAppleが新言語「Swift」を発表しやがりましたので、Swift漬けの毎日を送っている私ですが、以下のリンクにて、今回の表題と同じタイトルの記事を投稿しましたので、Swiftプログラマーの同士たちはぜひチェックしてみてください！

http://qiita.com/Nietzsche/items/03eb06d407178e97bb2e

AppDelegate.swift

//
//
func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: NSDictionary?) ->Bool {
        self.window = UIWindow(frame: UIScreen.mainScreen().bounds)
        // Override point for customization after application launch.
        self.window!.backgroundColor = UIColor.whiteColor()
        self.window!.makeKeyAndVisible()

        //-----------------------ここから--------------------------//

        //FirstViewControllerをRootViewに設定する
        var fvc = FirstViewController(nibName:nil,bundle:nil);
        self.window!.rootViewController = fvc;

        //-----------------------ここまで--------------------------//

        return true
    };

func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: NSDictionary?) ->Bool {

self.window = UIWindow(frame: UIScreen.mainScreen().bounds)

// Override point for customization after application launch.

self.window!.backgroundColor = UIColor.whiteColor()

self.window!.makeKeyAndVisible()

//-----------------------ここから--------------------------//

//FirstViewControllerをRootViewに設定する

var fvc = FirstViewController(nibName:nil,bundle:nil);

self.window!.rootViewController = fvc;

//-----------------------ここまで--------------------------//

return true

};

MapViewController.swift

import UIKit
import MapKit  //MapKit.frameworkをインポート

class MapViewController: UIViewController , MKMapViewDelegate{  //MKMapViewDelegateを宣言

    //マップ
    var mapView: MKMapView = MKMapView()
    //長押し検知器
    var longtapGesture: UILongPressGestureRecognizer = UILongPressGestureRecognizer()

    init(nibName nibNameOrNil: String?, bundle nibBundleOrNil: NSBundle?) {
        super.init(nibName: nibNameOrNil, bundle: nibBundleOrNil)
        // Custom initialization
    }

    override func viewDidLoad() {
        super.viewDidLoad()

        //マップの設定
        //マップにフレームサイズを設定
        self.mapView.frame = CGRectMake(0,20,self.view.bounds.size.width,self.view.bounds.size.height)
        //マップのDelegateを設定（上記のMKMapDelegate）
        self.mapView.delegate = self
        self.view.addSubview(self.mapView)

        //初期位置を設定
        //経度、緯度からメルカトル図法の点に変換する
        var centerCoordinate : CLLocationCoordinate2D = CLLocationCoordinate2DMake(35.665213,139.730011)
        let span = MKCoordinateSpanMake(0.003, 0.003) //小さい値であるほど近づく
        //任意の場所を表示する場合、MKCoordinateRegionを使って表示する  (中心位置、表示領域)
        var centerPosition = MKCoordinateRegionMake(centerCoordinate, span)
        self.mapView.setRegion(centerPosition,animated:true)

        //長押し検知器の設定
        //長押し時に呼びだすメソッド
        self.longtapGesture.addTarget(self, action: "longPressed:")
        //マップに長押し検知器を追加
        self.mapView.addGestureRecognizer(self.longtapGesture)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    func longPressed(sender: UILongPressGestureRecognizer){

        //指を離したときだけ反応するようにする
        if(sender.state != .Began){
            return
        }

        //senderから長押しした地図上の座標を取得
        var location = sender.locationInView(self.mapView)
        //CLLocationCoordinate2Dに変換
        var mapPoint:CLLocationCoordinate2D = self.mapView.convertPoint(location, toCoordinateFromView: self.mapView)

        //ピンを生成
        var theRoppongiAnnotation = MKPointAnnotation()
        //ピンを置く場所を設定
        theRoppongiAnnotation.coordinate  = mapPoint
        //ピンのタイトルの設定
        theRoppongiAnnotation.title       = "ピン置いたぜぇ〜"
        //ピンのサブタイトルを設定
        theRoppongiAnnotation.subtitle    = "ワイルドだろぅ〜？"
        //ピンを地図上に追加
        self.mapView.addAnnotation(theRoppongiAnnotation)
    }

}

import UIKit

import MapKit //MapKit.frameworkをインポート

class MapViewController: UIViewController , MKMapViewDelegate{ //MKMapViewDelegateを宣言

//マップ

var mapView: MKMapView = MKMapView()

//長押し検知器

var longtapGesture: UILongPressGestureRecognizer = UILongPressGestureRecognizer()

init(nibName nibNameOrNil: String?, bundle nibBundleOrNil: NSBundle?) {

super.init(nibName: nibNameOrNil, bundle: nibBundleOrNil)

// Custom initialization

}

override func viewDidLoad() {

super.viewDidLoad()

//マップの設定

//マップにフレームサイズを設定

self.mapView.frame = CGRectMake(0,20,self.view.bounds.size.width,self.view.bounds.size.height)

//マップのDelegateを設定（上記のMKMapDelegate）

self.mapView.delegate = self

self.view.addSubview(self.mapView)

//初期位置を設定

//経度、緯度からメルカトル図法の点に変換する

var centerCoordinate : CLLocationCoordinate2D = CLLocationCoordinate2DMake(35.665213,139.730011)

let span = MKCoordinateSpanMake(0.003, 0.003) //小さい値であるほど近づく

//任意の場所を表示する場合、MKCoordinateRegionを使って表示する (中心位置、表示領域)

var centerPosition = MKCoordinateRegionMake(centerCoordinate, span)

self.mapView.setRegion(centerPosition,animated:true)

//長押し検知器の設定

//長押し時に呼びだすメソッド

self.longtapGesture.addTarget(self, action: "longPressed:")

//マップに長押し検知器を追加

self.mapView.addGestureRecognizer(self.longtapGesture)

}

override func didReceiveMemoryWarning() {

super.didReceiveMemoryWarning()

// Dispose of any resources that can be recreated.

}

func longPressed(sender: UILongPressGestureRecognizer){

//指を離したときだけ反応するようにする

if(sender.state != .Began){

return

}

//senderから長押しした地図上の座標を取得

var location = sender.locationInView(self.mapView)

//CLLocationCoordinate2Dに変換

var mapPoint:CLLocationCoordinate2D = self.mapView.convertPoint(location, toCoordinateFromView: self.mapView)

//ピンを生成

var theRoppongiAnnotation = MKPointAnnotation()

//ピンを置く場所を設定

theRoppongiAnnotation.coordinate = mapPoint

//ピンのタイトルの設定

theRoppongiAnnotation.title = "ピン置いたぜぇ〜"

//ピンのサブタイトルを設定

theRoppongiAnnotation.subtitle = "ワイルドだろぅ〜？"

//ピンを地図上に追加

self.mapView.addAnnotation(theRoppongiAnnotation)

}

灯台もと暗し＠開発日誌。

Posted on 2014/06/272014/12/27 by morimachi

まだ試していないけれど、自分のためのメモ。
インフォバブルのタブ間の値はまたげない。タブを切り替えると他のタブのDOMが取得できなくなる。切り替えるとDOMツリーも無くなるのかなあ。各タブごとにセーブボタンを配置したけれど、これだと他のタブでセーブしないままこっちでセーブしてしまうと向こう側のデータがリセットされてしまう。他人に使わせるとこまで考慮にいれると、ロバストではない。だから、ちょっと気持ち悪い。

どっかに各タブの値を退避させておけばいいんだけどなー。あ、マーカーがいた。各タブの値が変化する度にマーカーのプロパティをオーバーライドしてしまえばいいわけか。あたりまえといえばあたりまえ、なんだけど、試してみる価値はありそう。

ならねこ + infoBubble.js

Posted on 2014/06/262014/12/27 by morimachi

情報ウィンドウをタブ化したいなーと思っていて、だけど自分でやるのはしんどいなーと思っていて、ググってみたら、infoBubbleというライブラリに行き着いた。WebStormでこれのコードを見るに、ちょっと変数名にミスがあるような？地図オブジェクトの変数名をちょこっと修正すれば、導入自体はすんなりいけました。以下はその後のメモ。

・MVC配列に入れられる
・見かけは情報ウィンドウだが実態はオーバーレイ
・なのでマーカーとの連携は弱くなっている
・close()してもメモリ上に残っているのでsetMpap(null)できっちり消す
・そうしないとローカルストレージからのロード時に挙動がおかしくなる
・ウィンドウの裏にランドマークがあるとこれが反応してイラッとくる

ならねこ宣言 ver. 0.1001

Posted on 2014/06/222014/12/27 by morimachi

んー、アップルのmapkitのウィンドウはカスタムできるのかなあ。ピュア・swiftでつくりたいかも。さて、アプリの三原則である、データの編集、保存、復元をwebだけでやってみました。取材用のメモだけでなく、そのままGISにしてしまうことができます。マーカーこそ主人公であって、そのデザインをウィンドウのGUIで調整できる、という部分が私なりの発想の転換です。今後もこれをベースにいろいろ拡張していこうかなー、と思います。とりあえず、ならねこversion 0.1ということで。このアプリ、最終的には「つながる」がキーになっていくと思います。

てくにかる、のーと、すりい。

Posted on 2014/05/272014/12/27 by morimachi

ぐーぐるまっぷのマーカーの続き。要するにさあ、地図自体をOSみたいにしたいんだなあ。そのときにちゅうもくすべきなのが情報ウィンドウinfoWindow、あのふきだしのやつね。あれがもーほんとくせもので、いちばんはらたつのが、「ウィンドウ」のくせに吹き出しくりっくしても手前にでてこないんだなあ。

冒頭の画像のように、画面下にいくほど手前に表示されます。でもね、情報ウィンドウのプロパティzIndex:0を加えるだけで、ましになります。ウィンドウ自体にイベントが割り当てられていないので、ウィンドウをクリックしてもダメだけど、マーカーをワンクリックするだけで、手前に表示されるようになります。原理は、、、ようわからん。とりあえず、そうなる。

こんな状況でも･･･左下の水色のマーカーをクリックするとウィンドウが、、、