私はあなたのためのデモとしてこれの多くを行うために簡単な実装を一緒に投げました。ストリートビューのアマチュアバージョンを非常にシンプルにする優れたオープンソースライブラリがいくつかあります。私のデモはGitHubで確認できます:https ://github.com/ocrickard/StreetViewDemo
GoogleストリートビューAPIの見出しとピッチのパラメータを使用して、タイルを生成できます。これらのタイルは、BilalとGeraud.chの両方が示唆しているように、UIScrollViewに配置できます。ただし、JCTiledScrollViewには、Googleのように画像の上にピンを追加するための非常に優れた注釈システムが含まれており、そのデータソース/デリゲート構造により、非常に簡単な画像処理が可能になるため、私は本当に気に入っています。
私の実装の重要な部分は次のとおりです。
- (UIImage *)tiledScrollView:(JCTiledScrollView *)scrollView imageForRow:(NSInteger)row column:(NSInteger)column scale:(NSInteger)scale
{
float fov = 45.f / scale;
float heading = fmodf(column*fov, 360.f);
float pitch = (scale - row)*fov;
if(lastRequestDate) {
while(fabsf([lastRequestDate timeIntervalSinceNow]) < 0.1f) {
//continue only if the time interval is greater than 0.1 seconds
}
}
lastRequestDate = [NSDate date];
int resolution = (scale > 1.f) ? 640 : 200;
NSString *path = [NSString stringWithFormat:@"http://maps.googleapis.com/maps/api/streetview?size=%dx%d&location=40.720032,-73.988354&fov=%f&heading=%f&pitch=%f&sensor=false", resolution, resolution, fov, heading, pitch];
NSError *error = nil;
NSData *data = [NSData dataWithContentsOfURL:[NSURL URLWithString:path] options:0 error:&error];
if(error) {
NSLog(@"Error downloading image:%@", error);
}
UIImage *image = [UIImage imageWithData:data];
//Distort image using GPUImage
{
//This is where you should try to transform the image. I messed around
//with the math for awhile, and couldn't get it. Therefore, this is left
//as an exercise for the reader... :)
/*
GPUImagePicture *stillImageSource = [[GPUImagePicture alloc] initWithImage:image];
GPUImageTransformFilter *stillImageFilter = [[GPUImageTransformFilter alloc] init];
[stillImageFilter forceProcessingAtSize:image.size];
//This is actually based on some math, but doesn't work...
//float xOffset = 200.f;
//CATransform3D transform = [ViewController rectToQuad:CGRectMake(0, 0, image.size.width, image.size.height) quadTLX:-xOffset quadTLY:0 quadTRX:(image.size.width+xOffset) quadTRY:0.f quadBLX:0.f quadBLY:image.size.height quadBRX:image.size.width quadBRY:image.size.height];
//[(GPUImageTransformFilter *)stillImageFilter setTransform3D:transform];
//This is me playing guess and check...
CATransform3D transform = CATransform3DIdentity;
transform.m34 = fabsf(pitch) / 60.f * 0.3f;
transform = CATransform3DRotate(transform, pitch*M_PI/180.f, 1.f, 0.f, 0.f);
transform = CATransform3DScale(transform, 1.f/cosf(pitch*M_PI/180.f), sinf(pitch*M_PI/180.f) + 1.f, 1.f);
transform = CATransform3DTranslate(transform, 0.f, 0.1f * sinf(pitch*M_PI/180.f), 0.f);
[stillImageFilter setTransform3D:transform];
[stillImageSource addTarget:stillImageFilter];
[stillImageFilter prepareForImageCapture];
[stillImageSource processImage];
image = [stillImageFilter imageFromCurrentlyProcessedOutput];
*/
}
return image;
}
ここで、Googleが持つ完全な360度の無限スクロール効果を得るには、UIScrollViewのcontentOffsetを監視するobserveValueForKeyPathメソッドでいくつかのトリックを実行する必要があります。私はこれを実装し始めましたが、それを終了しませんでした。ユーザーがビューの左側または右側に到達するcontentOffset
と、scrollViewのプロパティがscrollViewの反対側にプッシュされるという考え方です。コンテンツを適切に配置でき、contentSizeを適切に設定できれば、これは機能するはずです。
最後に、Googleストリートビューシステムには1秒あたり10画像の制限があるため、リクエストを調整する必要があります。そうしないと、デバイスのIPアドレスが一定期間ブラックリストに登録されます(自宅のインターネットはブラックアウトされます)次の数時間のストリートビューリクエストから'最初はこれを理解していなかったため)。