Документация: Классические 360° панорамы

Импорт панорам, настройка хотспотов и публикация/экспорт проекта (без 3D‑модели).

Обзор

Эта инструкция описывает классический сценарий: вы загружаете 360° изображения (обычно equirectangular 2:1), создаёте переходы между сценами через хотспоты и публикуете проект.

Импорт: 1 панорама

  1. Откройте проект (Панель → Проект).
  2. Нажмите Новая панорама.
  3. Загрузите изображение 360°.
  4. После создания вы попадёте на страницу редактирования панорамы, где можно добавить хотспоты.

Импорт: мультипанорамы

Если у вас много сцен, используйте Создать мультипанорамы. Внутри приложение сначала загружает файлы, а затем создаёт отдельную панораму для каждого изображения.

  • Название панорамы обычно берётся из имени файла (его можно изменить позже).
  • Лучше заранее называть файлы понятным образом: kitchen.jpg, hall.jpg

Редактирование панорамы

Откройте панораму из списка сцен. На странице редактирования вы можете:

  • изменить название/описание и слаг (URL);
  • настроить стартовый взгляд (yaw/pitch) и FOV;
  • добавить/редактировать хотспоты (переходы и информация);
  • перетаскивать хотспоты мышью прямо в viewer.

Стартовый взгляд (yaw/pitch)

По умолчанию стартовое направление может наследоваться автоматически. Если вы хотите зафиксировать стартовый взгляд:

  1. Включите режим ручного стартового направления (если доступен).
  2. Поверните панораму на нужный ракурс.
  3. Нажмите кнопку «Зафиксировать направление» в правом верхнем углу viewer.
Важно
В редакторе направление вычисляется из реального направления камеры, чтобы сохранённые значения initialYaw/initialPitch совпадали с экспортированным viewer.

Хотспоты

Хотспот — это кликабельная точка на панораме. В VPano есть два основных типа:

  • NAVIGATION — переход на другую панораму.
  • INFO — информационная точка (подсказка/текст).

Добавление: в режиме редактирования кликните по сцене (или правой кнопкой мыши) → выберите тип.

Хотспот NAVIGATION (переход)

  • Выберите целевую панораму (куда ведёт переход).
  • Настройте иконку (preset или пользовательская), масштаб и поворот.
  • При необходимости настройте depthOffset (глубина/выталкивание из поверхности).

Хотспот INFO (информация)

  • Задайте заголовок и текст.
  • INFO хотспоты могут показывать подпись при наведении в viewer.

Перетаскивание и поворот хотспотов

  • Перемещение: зажмите хотспот и перетащите мышью.
  • Поворот иконки: удерживайте Ctrl и тяните хотспот влево/вправо.
  • Чтобы избежать случайного создания хотспота на mouseup, viewer подавляет следующий клик после перетаскивания.
Подсказка для точного позиционирования
При большом количестве хотспотов перетаскивание может казаться «тяжёлым». Внутри hover‑пикинг специально ограничен по частоте, чтобы drag работал плавно.

Публикация и экспорт

Откройте страницу проекта → нажмите Настройки проекта (иконка ⚙️).

Публичный доступ
Включите Публичный доступ, чтобы ссылка проекта стала доступна.
Открыть проект
Кнопка Открыть проект запускает экспорт и переводит на viewer по URL/{userSlug}/{profileSlug}.
ZIP‑экспорт
В «Экспорт» нажмите Экспорт панорамы — будет сформирован ZIP, который можно разместить на вашем хостинге.

Советы и ошибки

  • Формат изображения: лучше использовать equirectangular 2:1 (например 6000×3000). Для мобильных часто достаточно 4096×2048.
  • Если панорамы очень большие, включайте ограничения качества в настройках проекта (2k/4k), чтобы экспорт работал быстрее.
  • Не забывайте выбрать стартовую сцену: первая панорама в списке считается стартовой (можно поменять порядок стрелками или кнопкой ⭐).
  • INFO‑хотспоты показывают подпись при наведении в viewer (в редакторе используется hover‑подсказка).