Layerpin logo
画質とスケール

Deep Zoom (DZI) とギガピクセル画像

最大250MB・2.5億画素の図面や空撮写真をアップロード。ぼやけやラグなく滑らかにズームできるよう自動最適化する仕組みを解説します。

ズーム時に通常の画像が壊れる理由

標準の静的画像 (通常の JPEG や PNG など) を Web サイトに埋め込み、訪問者にズームインしてもらうと、2 つの大きな問題が発生します。画像が標準サイズの場合、細部がすぐにぼやけてピクセル化してしまいます。画像が大きい場合、訪問者は読み込みに数秒かかる巨大なファイルをダウンロードする必要があり、モバイル デバイスが頻繁にクラッシュします。

標準静止画像
  • ぼやけと途切れ: ズームインすると、テキスト、部屋番号、細い線がピクセル化されたブロックに変わります。
  • 重いファイルのダウンロード: 訪問者は、何かを見る前に、元のファイル全体を事前にダウンロードする必要があります。
  • モバイルメモリがクラッシュする: メモリの急増により携帯電話がフリーズし、Safari や Chrome のタブがクラッシュします。
レイヤーピンディープズーム
  • 常に鋭い: キャンパス全体の概要から小さなオフィスのラベルに至るまで、詳細が鮮明なままです。
  • 1 秒未満の瞬時ロード: 正確なビューポート スライスのみがストリーミングされるため、時間と携帯データが節約されます。
  • シルクのように滑らかな 60fps: ハードウェア アクセラレーションによるパンとピンチ ズームにより、ブラウザのメモリ クラッシュが発生しません。

Layerpin がマップを自動的に最適化する方法

複雑なグラフィック ソフトウェア、タイル ツール、技術的なスクリプトは必要ありません。 Layerpin は、最適化パイプライン全体をクラウドで自動的に処理します。

  1. 1
    高解像度の地図ファイルをアップロードする
    平面図、建築設計図、スタジアム図、またはドローン空撮写真をエディターに直接アップロードするだけです。
  2. 2
    自動クラウドマルチレベル処理
    Layerpin は画像の解像度を分析し、バックグラウンドで最適化されたマルチ解像度ズーム レベルを構築し、タイルを圧縮してピーク速度を実現しながら完全な視覚的な鮮明さを維持します。
  3. 3
    アダプティブ オンデマンド ストリーミング
    訪問者がマップを開くと、Layerpin は現在の画面とビューポートに一致する正確なタイルのみを提供します。ズームインすると、より詳細なタイルがシームレスに表示されます。
  4. 4
    スムーズで途切れのないパフォーマンス
    訪問者は、iPhone、Android デバイス、タブレット、デスクトップ ディスプレイ全体でハードウェア アクセラレーションを使用して、滑らかな 60fps のパンおよびピンチ ナビゲーションを楽しんでいます。

画像の制限とサポートされている形式

Layerpin は、すべての主要なベクターおよびラスター グラフィック形式を受け入れます。標準的なフロア プランまたは大規模なギガピクセル マップをアップロードできます。

受け入れられる形式
SVG, JPEG, PNG, WEBP, AVIF, BMP

完全なベクター サポート (SVG) に加えて、すべての標準ラスター Web 形式。

標準地図画像
最大 10MB

バックグラウンドキューなしで即座にロードされます。毎日の間取りに最適です。

大きな画像とギガピクセル画像
まで 250 MB & 250 MP

Pro は最大 100 MB / 100 MP に対応し、Premium は最大 250 MB / 250 MP に対応します。

推奨スケール
3,000px to 16,000px+

ネイティブ解像度が高くなると、部屋の細かいラベルや小さなアイコンが鮮明に表示されます。

自動ディープズーム処理

タイリングを手動で設定する必要はありません。画像が標準サイズ内であればすぐに使えます。250 MB、250 MP までの大きな画像をアップロードすると、Layerpin が Deep Zoom のバックグラウンド処理を自動的に有効化し、マップの高速表示を保ちます。

非常に鮮明な地図のためのベスト プラクティス

トゥルーネイティブ解像度でエクスポート

CAD、Revit、Illustrator、または Figma から幅 4,000 ピクセル以上で直接エクスポートします。サイズ変更では失われた細部を復元できないため、Photoshop で低解像度の画像をアップスケールすることは避けてください。

フォーマットをコンテンツタイプに合わせる

シャープな罫線やテキストの設計図・線画には PNG または SVG を使います。ドローン空撮写真や 3D レンダーには JPEG、WebP、AVIF を使い、アップロード帯域を抑えましょう。

未使用の余白を切り取る

アップロードする前に、余分な用紙の余白、表題欄、凡例をトリミングしてください。これにより、マップ訪問者がインタラクティブにナビゲートできるエリアが最大化されます。

クリック可能なインタラクティブな要素を追加する

アップロードしたら、Layerpin を使用します マーカー, ポリゴン, および ラインとコネクタ ピン、ポップアップ、ルートを使用してマップを生き生きとさせるツール。