【Pannellum】360度パノラマ画像ビューアーを複数設置する

[ ID : 5569 ]
シルバー
【Pannellum】360度パノラマ画像ビューアーを複数設置する
実装目安
3分

概要

「Pannellum」を使用して360度パノラマ画像ビューアーを複数設置する実装方法を紹介。

用途・要件

  • ビューアーを同一ページに複数設置したい場合に利用。
  • ページによって設置数が変わる場合。
  • iframeではなくjavascript APIを使用。
  • オプションの情報をHTMLのdata属性に設定する。DEMOでは「360度パノラマ画像」「タイトル」「プレビュー画像」のオプション情報をdata属性に設定。(同様に他のオプションも設定可能)
  • Pannellum バージョン2.5.6使用。
  • jQuery バージョン3.6.0使用。

検証ブラウザ

  • Google Chrome(最新)
  • Safari(最新)
  • Firefox(最新)
  • Microsoft Edge(最新)
  • IE11
  • 注)iOSではfullscreen APIがサポートされていないため、フルスクリーン表示できない。(Can I use)

実装

このコンテンツの続きを閲覧するにはログインが必要です。 新規会員登録

この記事をシェアする

関連記事

新着記事

全ての記事を見る

KONOCODEのメリット 無料会員登録