1

私の目標は、GoogleストリートビューAPIを使用して、本格的なパノラマスクロール可能なストリートビュー画像をユーザーに表示することです。基本的に、APIは、方向、高さ、ズーム、位置などを変更できる多くの画像を提供します。これらすべてを取得して、それらをつなぎ合わせて表示したいと考えています。最初の質問は、この完全なグーグルストリートビューデモが機能することをデモするリソースを知っていますか?ユーザーがスワイプしてストリートビューを移動できる場所は、昔のiOS 5 Mapストリートビューのように、私たち全員が見逃していると確信しています...

そうでなければ、私は基本的に垂直方向と水平方向が異なる何百枚もの写真をダウンロードします。これらすべての写真をつなぎ合わせて大きなパノラマを作成し、ユーザーがスワイプして小さなiPhone画面で大きなパノラマを表示できるようにするライブラリ、API、リソース、またはメソッドはありますか?

みんなありがとう!

4

3 に答える 3

4

私はあなたのためのデモとしてこれの多くを行うために簡単な実装を一緒に投げました。ストリートビューのアマチュアバージョンを非常にシンプルにする優れたオープンソースライブラリがいくつかあります。私のデモは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アドレスが一定期間ブラックリストに登録されます(自宅のインターネットはブラックアウトされます)次の数時間のストリートビューリクエストから'最初はこれを理解していなかったため)。

于 2012-11-05T01:58:48.577 に答える
1

UIScrollViewを使用し、そのclipSubviewsプロパティをtrueに設定し、画像に従ってすべての画像をUIScrollViewとUIScrollViewのcontentsOffsetに追加する必要があります。

于 2012-10-31T13:12:06.613 に答える
1

この投稿で説明されている方法を使用する必要があります:http://mobiledevelopertips.com/user-interface/creating-circular-and-infinite-uiscrollviews.html

画像を適切なサイズとビューポート(iPhone / iPad)に変換するには、いくつかのファクトリを作成する必要があります。次に、クリックして次の場所に移動できるボタンをいくつか追加します。

残念ながら、(チューブバージョンではなく)グローブバージョンに移行する場合は、この3Dサーフェスに画像を表示するには、完全なopenGLに移行する必要があると思います。

于 2012-10-31T13:20:24.350 に答える