Poniższe dema nie zostały dokładnie przetestowane na wielu przeglądarkach.

Jeśli któryś z nich nie działa, spróbuj użyć najnowszej wersji przeglądarki Chrome lub Firefox.

Kostka o pojedynczej rozdzielczości

Wyświetlaj obraz sześcienny o pojedynczej rozdzielczości za pomocą Marzipano.

Wypróbuj demo Pokaż źródło

Kostka w wielu rozdzielczościach

Wyświetlaj gigapikselowy obraz sześcienny w wielu rozdzielczościach za pomocą Marzipano.

Wypróbuj demo Pokaż źródło

Mieszkanie w wielu rozdzielczościach

Wyświetlaj płaski, gigapikselowy obraz w wielu rozdzielczościach za pomocą Marzipano.

Wypróbuj demo Pokaż źródło

Równokątny

Wyświetl prostokątny obraz za pomocą Marzipano.

Wypróbuj demo Pokaż źródło

Wideo

Odtwórz wideo 360° w formacie równoprostokątnym z Marzipano. Możliwe jest przełączanie między różnymi rozdzielczościami wideo. Marzipano nie posiada żadnego specjalnego kodu do obsługi wideo 360°. To demo pokazuje, jak można go wdrożyć.

Wypróbuj demo Pokaż źródło

Wygenerowana kostka

Marzipano umożliwia proceduralną generację mediów. To demo wyświetla kostkę o wielu rozdzielczościach, która jest generowana w taki sposób. Po poziomie 16 (co odpowiada sześcianom o wielkości ~280 terapikseli) można zauważyć problemy z brakiem precyzji w typach liczb.

Wypróbuj demo Pokaż źródło

Style Hotspot

Przedstawia niektóre style i efekty hotspotów, które można utworzyć za pomocą CSS.

Wypróbuj demo Pokaż źródło

Wbudowane hotspoty

Użyj osadzonych hotspotów, aby nałożyć treści z różnych źródeł na obraz 360º (np. YouTube, Mapy Google, Twitter).

Wypróbuj demo Pokaż źródło

Orientacja urządzenia

Kontroluj panoramę za pomocą interfejsu DeviceOrientation API (żyroskop), wdrażając niestandardową metodę ControlMethod.

Wypróbuj demo Pokaż źródło

Dodatkowe gesty dotykowe

Galeria zdjęć 360º, która łączy się z Hammer.js, aby dodać dodatkowe gesty dotykowe (i myszy): podwójne kliknięcie/dotknij, aby powiększyć, przesuń dwoma palcami, aby zmienić panoramę i naciśnij punkt, aby dodać komentarz.

Wypróbuj demo Pokaż źródło

Przejścia

Przedstawia niektóre przejścia, które można osiągnąć za pomocą niestandardowej funkcji transitionUpdate() i biblioteki easing.js library.

Wypróbuj demo Pokaż źródło

Warstwy

Wyświetlaj warstwowe obrazy równoprostokątne, ładując je z plików na lokalnym dysku twardym. Manipuluj parametrem efektów na każdym z obrazów.

Wypróbuj demo Pokaż źródło

Edytowalny

Edytuj obraz równoprostokątny i wyeksportuj go.

Wypróbuj demo Pokaż źródło

Anaglif

Wyświetlaj panoramę stereoskopową jako anaglif, dodając transformację kolorów i zmieniając tryb mieszania WebGL. Zawiera wiele typów anaglifów.

Wypróbuj demo Pokaż źródło

Renderowanie obok siebie

Wyświetlaj obok siebie stereoskopową panoramę.

Wypróbuj demo Pokaż źródło

WebVR

Wyświetlaj stereoskopowy obraz za pomocą interfejsu API WebVR. Wymaga przeglądarki z obsługą WebVR.

Wypróbuj demo Pokaż źródło

Hotspoty z efektem prostokąta

Wyświetla wiele warstw zawierających punkty aktywne z innym efektem prostokąta.

Wypróbuj demo Pokaż źródło