初めに
YOLPの気象関連機能(雨雲レーダー情報、気象情報API)を利用したアプリ・サービスの実装例を今までもいくつかご紹介してきました。今回はYahoo! JavaScriptマップAPIではなく、Yahoo! iOSマップSDK(以下、iOSマップSDK)を使って、雨雲レーダー情報を表示するネイティブアプリの作成方法を入門的にご紹介します。
参考:Yahoo! JavaScriptマップAPIでの実装例
- ルートを探しながら雨雲をチェック!YOLPで作る簡単便利地図アプリ
- 地図をタッチして雨の強さをチェック!YOLPで作る簡単便利地図アプリ
- 状況に応じて地図の様子が自動で変わる!YOLPで作る簡単地図アプリ「今っぷ!」
環境の準備
アプリケーションIDの取得
これまでの記事でも書かれていますが、YOLPで提供されているAPIを利用するためには、アプリケーションIDが必要になります。すでにアプリケーションIDをお持ちの方はそちらを利用していただき、アプリケーションIDをお持ちでない方、新しいアプリケーションIDの登録を希望する方は、以下のページを参考にアプリケーションIDを登録してください。
なお、アプリケーションIDを登録するためには、Yahoo! JAPAN IDでログインする必要があります。
iOSアプリ開発環境の準備
開発にはXcodeを使います。XcodeはiOS Dev Centerのサイト、もしくはApp Storeから入手できます。Xcodeの入手にはApple ID、Xcodeの利用にはMacが必要です。
なお、本稿のサンプルコードは、Xcode 4.6.2、iOS6で開発しています。
地図の表示
まずはiOSマップSDKのチュートリアルを参考に、地図を表示するところまで開発します。
※参考:チュートリアル
新規プロジェクトの作成
Xcodeの[File]-[New]-[Project]を選択します。今回は[Single View Application]を選択します。
「WeatherView」という名前でプロジェクトを作成します。今回は[Use Storyboards][Use Automatic Reference Counting]にチェックし、[Devices]-[iPhone]で作成します。
チュートリアルの利用準備にある[YMapKit.framework]とフレームワーク、リソースファイルを追加します。
チュートリアルの地図を表示するを参考に、コードを修正します。
#import <UIKit/UIKit.h>
#import <YMapKit/YMapKit.h> //YMapKit.frameworkのヘッダーファイルをインポート
//デリゲートの追加
@interface ViewController : UIViewController <YMKMapViewDelegate> {
    YMKMapView *map; //YMKMapViewインスタンス用ポインタ
}
@end
  
#import "ViewController.h"
@interface ViewController ()
@end
@implementation ViewController
- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    CGFloat width  = self.view.frame.size.width;
    CGFloat height = self.view.frame.size.height;
    //YMKMapViewのインスタンスを作成
    map = [[YMKMapView alloc] initWithFrame:CGRectMake(0, 0, width, height) appid:@"あなたのアプリケーションID" ];
    
    //地図のタイプを指定 標準の地図を指定
    map.mapType = YMKMapTypeStandard;
    
    //YMKMapViewを追加
    [self.view addSubview:map];
    //YMKMapViewDelegateを登録
    map.delegate = self;
    
    //地図の位置と縮尺を設定
    CLLocationCoordinate2D center;
    center.latitude = 35.6657214;
    center.longitude = 139.7310058;
    map.region = YMKCoordinateRegionMake(center, YMKCoordinateSpanMake(0.015, 0.015));
}
- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}
@end
  
 
              
               
                          
                           
                          
                           
                          
                           
                          
                           
                          
                           
                          
                           
                          
                           
                          
                           
                          
                           
                          
                           
                          
                           
                          
                           
                              
                               
                              
                               
                              
                               
                              
                               
                              
                               
                      
                     
                      
                     
                      
                     
                      
                     
                      
                     
                      
                     
                      
                     
															
														 
															
														.png) 
     
     
     
     
     
													 
													 
													 
													 
													 
										
									




 
                    