5

iOS5 / 6（iPhone）に非常にカスタムなタイルマップレイヤー/ビューを実装する必要があります。これは、サーバーから画像やデータ（JSON）としてタイルをロードします。これはグーグルマップに似ていますが、特定の時点で非常に具体的であるため、次のようなソリューションを 簡単に使用することはできません。

  1. グーグルマップまたは
  2. route-me（MapBoxで使用）
  3. CATiledLayerと組み合わせてUIScrollView

重要なのは、私の特定の仕様のために、そこにあるソリューションのどれも実際には私を助けません。あなたが考えるなら、適切な解決策があります、教えてください!!!

そうでない場合：
私の場合に最適な解決策を見つけるのを手伝ってください!!!

「しかし、なぜ私はこれらの美しいソリューションを使用できないのですか？」
知っておく必要のあるいくつかの制限があります。

  1. 3つのズームレベル（0、1、2）のみを使用します

  2. すべてのタイルには、次のズームレベル（=ズームファクター3）に9つのサブタイルがあります（他のキットのほとんどが4つのサブタイル=ズームファクター2で行うのとは異なります）

  3. 最初のレイヤーの初期サイズは（ピクセル/ポイントで言えば半分です）768*1024です。
    2番目のレイヤーは3倍広くて高い（zoomfactor 3 !!!）-> 2304 * 30723番目のレイヤーは2番目のレイヤー
    よりも同じように広くて高い->6912* 9216

  4. サーバーからの各タイルは256x256ピクセルです

  5. したがって、すべてのサブレイヤーはタイル数の9倍になります（1番目のレイヤーに12、2番目に108、3番目に972）

  6. すべてのタイルには、背景画像（約6KBのサイズ）（サーバーから画像として読み込まれる）と前景情報（サーバーからすべてのタイルのJSONとして読み込まれる-10〜15KBのサイズ）
    ->前景情報JSONには次のいずれかが含まれますオーバーレイ画像（Googleのトラフィックなど）またはローカルタイルの座標空間に描画されるローカルタイル情報（注釈など、タイルごと）

  7. 背景タイル全体をディスクにキャッシュしたいのですが、変更されることはありません。

  8. タイルが再度リロードされるまで、各タイルのoverlay-tile-images/overlay-tile-informationを一定時間キャッシュしたい

  9. ズームはピンチとダブルタップで行う必要があります

私の考慮事項のいくつか：

  1. キャッシングは問題ではありません。CoreDataなどを介して行います

  2. スムーズなスクロールを表示するために、UIScrollViewを考えました

  3. ピンチを使用したいので、次のズームレベルを突破するたびに、次のズームレベルのタイルを描画する必要があります

  4. コンテンツは表示領域にのみ描画する必要があります（iPhone 5 320x500の場合）

  5. メモリ効率を高めるために、表示されていないタイルは削除する必要があります。ただし、タイルが表示されている中心から一定量のピクセル/ポイント離れている場合にのみ、すぐに削除しないでください。ロードされて表示されたばかりのタイルを即座に表示するには、「display-cache」が必要です。それとも、もっと良いテクニックがありますか？

  6. どのタイルが表示されているかがわかっているので、ディスクまたはサーバーから非同期でバックグラウンドを即座にロードできます。タイルで私もそうします-JSON。次に、タイルのJSON情報を抽出し（「オーバーレイは直接の画像または都市名などの情報であり、タイルに描画する必要があります」）、オーバーレイを描画またはロードします（DB /ディスクまたはサーバーから）

  7. UIScrollViewは、タイルビューの最大サイズを処理するのに十分効率的ですか

  8. CALayerをサブレイヤーとして使用して描画する必要がありますか？Quartzを使用して、大きな「キャンバス」を直接描画する必要がありますか？

今ではあなたの番です ！！！

4

3 に答える 3

4

Apple には、1 つの画像を非常に深くズームインする例があります。これには CATiledLayer を使用します。

例はここにあります: http://developer.apple.com/library/ios/#samplecode/PhotoScroller/Introduction/Intro.html

この例は、電話に保存されているサブタイルで動作しますが、問題に適応できる可能性があります。

于 2013-02-22T09:55:42.687 に答える
2

私は独自の TiledLayer 実装を使用して、CATiledLayer がサポートしていないこれらのタイプの非標準のタイリングの問題を解決しました (CATiledLayer にはまだ未解決のバグがいくつかあるため)。

その実装はGithubで利用できるようになりました。

Fab1n: これは、すでに電子メールでお送りしたものと同じ実装です。

于 2013-03-01T15:23:38.563 に答える
2

私は非常にきちんとした素晴らしい解決策を思いつきました (カスタム TiledLayer 実装):

scrollView の contentView として CATiledLayer を使用しなくなりました。代わりに、CALayer サブクラスを追加し、タイルをサブレイヤーとして追加しました。各タイルには、コンテンツとしてタイル ビットマップが含まれています。スクロールビューでズームインするとき、現在のズームレベルに基づいてタイルを手動で切り替えます。それは最高です！！！

誰かが実装の詳細を知りたい場合 -> 問題ありません。コメントを書いて、ここに投稿します。

編集：

実装に関する詳細:

実際、実装は非常に簡単です。

  1. ビュー/コントローラー ビューに UIScrollView を追加します。
  2. UIView (以降 と呼ぶtileView) を contentView として ScrollView に追加します - ScrollView のサイズと同じサイズ (これは完全に縮小されたモードです - 係数 1)
  3. ズームを有効にします（ズーム係数は最小で 1、最大で 9 でした）
  4. 画像を に配置するとtileView、レベル 9 にズームすると、非常に不鮮明なピクセル化された画像になります。
  5. ズームインしたときにくっきりとした鮮明な画像が必要な場合は、CALayer インスタンス ( tiles)addSublayer:をtileView
  6. zoomFactor が 3 であると仮定します (つまり、レイヤー 0 の 1 つのタイル - zoomFactor 1はレイヤー 1 の3x3 = 9 タイルで構成されます- zoomFactor 3 )
    1. レイヤー 0に、243x243 (3 で割り切れる 3 倍) ピクセルの 3x4 タイルを (サブレイヤーとして にtileView) 配置するとします。と同じサイズのタイル画像を配置しますCALayer contents。zoomFactor 3にズームするとぼやけます (古い Google マップのように)
    2. zoomFactor 3をヒットすると、スーパーレイヤーから 12 レイヤーすべてが削除され、3 倍小さいレイヤー ( 81x81 ピクセル) に置き換えられます。全体で 9 倍のレイヤーが得られます。
    3. タイル レイヤーが 3 分の 1 になったので、トリックは の.contentsプロパティですCALayer。レイヤーが 81x81 であっても、コンテンツ (画像) はフル解像度のままです。つまり、243x243 ピクセルの画像を 81x81 ピクセルの CALayer タイルのコンテンツとして配置すると、zoomFactor 3 では 243x243 ピクセルのタイルのように見えます!!!

任意の zoomFactor (3,9,12) でそれを行うことができます。タイルはどんどん小さくなりますが、元の画像をコンテンツとして設定すると、配置された正確な zoomFactor でタイルがくっきりとシャープに見えます。

zoomFactors の間でもタイルがシャープに見えるようにしたい場合は、3 倍の高さの画像を に設定する必要があります.contents。次に、次の zoomLevel を通過する直前でも、タイルは鮮明でシャープです。

理解しなければならないことの 1 つは、zoomLevel ファクターを渡すときにレイヤー上のすべてのタイルを削除するのは効率的ではないということです。rect で表示されているタイルを更新するだけです。

すべてのソリューションの中で最も優れているわけではありませんが、機能し、誰かが適切に設計されたライブラリを作成した場合、これがクリーンなソリューションになる可能性があります。

于 2013-02-26T16:36:30.993 に答える