Pano2VR одна из программ позволяющих осуществлять авторинг панорам, то есть создавать панорамы в удобном для просмотра виде, имеющем эффект присутствия. Кроме этого вид может быть оснащен интерфейсом для навигации, картами и другими инструментами. В ней можно создавать как одиночные панорамы, так и виртуальные туры, представляющие собой несколько панорам, связанных между собой переходами. В данном цикле статей будет рассматриваться версия 4.5.3 Pro. Для удобства я решил разбить обзор на несколько частей.
Теоретическая часть:
- Создание проекта;
- Экспорт во Flash;
- Экспорт в HTML5;
- Преобразования проекции;
- Редактор шаблона (Компоненты, Сценарии, Функции редактора).
Практическая часть:
- Создание шаблона;
- Создание панорамы;
- Создание виртуального тура;
- Другие возможности Pano2VR.
Рисунок 1. Главное окно Pano2VR.
Импорт панорамы
Рисунок 2. Секция «Импорт».
Исходное изображение панорамы добавляется в секции «Импорт» (рис. 2). Загрузить изображение можно путем перетаскивания файла с изображением панорамы из файлового менеджера в обозначенную область (в виде развертки куба). Если исходная проекция панорамы типа «Стороны куба» для её загрузки достаточно перетащить файл изображения одной из сторон. Также исходное изображение можно загрузить, нажав кнопку «Выбрать». При этом будет показано окно «Импорт» (рис. 3).
Рисунок 3. Окно «Импорт».
В окне (рис. 2) указываются тип панорамы и файлы изображений. С помощью кнопки «Открыть» для строки ввода с меткой «Панорама» выбирается файл изображения панорамы. Тип панорамы можно установить в «Авто». При этом программа сама проанализирует изображение и определит тип проекции. Для загрузки проекции «Стороны куба» достаточно выбрать файл изображения одной из сторон. Есть возможность пользователю самому выбирать тип загружаемой проекции (рис. 4, 5).
Рисунок 4. Импорт эквидистантной проекции.
Рисунок 5. Импорт проекции «стороны куба».
Список поддерживаемых проекций: эквидистантная, стороны куба, цилиндрическая, плоский образ, стрип куба (горизонтальный, вертикальный), крест куба (горизонтальный, вертикальный), Т-образная куба (горизонтальная, вертикальная), QuickTime VR.
Корректировка текстуры
Не всегда удается собрать панораму, чтобы она выглядела идеально, без каких-либо дефектов. Под дефектами подразумеваются нестыковки, засечки и детали, которых на панораме быть не должно (частей штатива, тени людей (при отсутствии самих людей), штатива). Если на панораме имеются описанные выше дефекты, с помощью инструмента «Коррекция текстуры» можно извлечь дефектную область панорамы в изображение в нормальной проекции для правки (ретуши) в графическом редакторе, а после завершения правки заменить эту область на исправленную. Часто возникает необходимость ретуши надира.
Рисунок 6. Дефект области надира.
Окно «Корректировка текстуры» нажатием кнопки «Корректор» в секции «Импорт». В этом окно содержит список корректировок текстуры для текущей панорамы (рис. 7). Для добавления новой корректировки служит кнопка «Добавить».
Рисунок 7. Окно «Корректировка текстуры».
После нажатия кнопки «Добавить» откроется окно, в котором задаются параметры корректировки (рис. 8) для настройки параметров области коррекции и извлечения изображения.
Рисунок 8. Окно «Коррекция текстуры».
Параметры позиции Pan/Tilt/Roll/FoV можно задать вручную или установить с помощью перемещения мышью панорамы в окне предпросмотра (кроме параметра Roll). Для удобства позиционирования можно включить отображение сетки. В поле ввода задается количество линий сетки по горизонтали или вертикали.
Например, если нужно извлечь корректировку надира, параметру Tilt задаем значение -90°, оставляя без изменения остальные параметры (рис. 9).
Рисунок 9. Окно «Коррекция текстуры».
В секции «Экспорт» указываем тип «Изображение», выбираем требуемый формат и качество изображения (только для формата JPG).
Имя файла генерируется автоматически на основе имени исходного файла путем добавления суффикса «_patch_N», где N – номер корректировки (начинающийся с нуля). Программа позволяет сформировать имя файла путем добавления к исходному имени файла корректировки позицию в формате _p(Pan)_t(Tilt)_r(Roll)_f(FoV), где вместо обозначений параметров в скобках используются цифры соответствующие параметру. Для этого в поле ввода «Файл» указывается системная переменная $c. Например, если указать имя lctn_2_$c, то в соответствии с настройками позиции, которые представлены на рис. 9, в результате получится имя файла lctn_2_p0_t-90_r0_f90.tif.
Чтобы не вводить при каждом извлечении корректировки переменную $c, в настройках программы предусмотрена соответсвующая опция (рис. 10). Окно настроек программы открывается через меню «Файл -> Настройки». Чтобы переменная $c добавлялась автоматически, нужно активировать пункт «Добавить позицию к имени файла" (выделен прямоугольником).
Рисунок 10. Окно «Настройки».
Чтобы извлечь корректировку нажимаем на кнопку «Извлечь» и дождаться завершения процедуры извлечения корректировки, после чего в списке корректировок появится запись (рис. 11), содержащая имя файла и параметры позиции, а в папке с проектом будет находиться и сам файл.
Рисунок 11. Окно «Корректировка текстуры».
Каждая запись списка текстур имеет пять кнопок управления «Параметры корректировки», «Открыть экспортированный файл», «Переместить выше», «Переместить ниже», «Удалить корректировку».
Кнопка «Параметры корректировки» служит для открытия окна (рис. 8) и внесения изменений в позицию корректировки. Кнопка «Открыть экспортированный файл» открывает файл в установленном по умолчанию просмотрщике изображений. Кнопки «Переместить выше» и «Переместить ниже» изменяют очередность применения корректировок. «Удалить корректировку» удаляет запись из списка корректировок и связанный с ней файл корректировки.
После извлечения всех необходимых корректировок нажимаем кнопку OK и не соглашаемся с применением корректировок – они еще не готовы. (Можно не закрывать это окно и нажать OK после завершения правок. Тогда можно согласиться с применением корректировок). Дальнейшие действия с корректировками проводятся в одном графических редакторов, которыми вы владеете.
Рисунок 12. До и после правки извлеченной корректировки
Извлечение областей текстуры используется не только для проведения их коррекции, но и для создания кликабельных областей панорамы. Как это делается, я расскажу в статьях практической части, посвященной Pano2VR.
Преобразование текстуры
Исходную проекцию панорамы можно изменить или сохранить с применением всех корректировок текстуры. Для этого служит кнопка «Изменить», которая вызывает окно «Преобразование структуры». Примеры видов окон для случаев преобразования проекции в эквидистантную и в стороны куба представленные на (рис. 13, 14).
Рисунок 13. Преобразование в эквидистантную проекцию.
В данном случае выполняется замена исходной проекции на аналогичную с учетом сделанных корректировок.
Рисунок 14. Преобразование в кубическую проекцию.
В данном случае выполняется замена исходной проекции на аналогичную с учетом сделанных корректировок.
Установка параметров проекции
Рисунок 15. Секция «Параметры проекции».
В секции «Параметры проекции» (рис. 15) устанавливаются параметры первоначального вида панорамы, который будет показан после загрузки, а также ограничения просмотра. Кнопка «Изменить» отображает окно «Параметры просмотра панорамы» (рис. 16). Установка этих параметров не является обязательной и производится, когда есть необходимость задать другой первоначальный вид или ограничить просмотр панорамы при приближении или отдалении и в направлениях влево, вправо, вверх, вниз.
Установки / ограничения можно вводить вручную или путем перетаскивания проекции в правой части окна. После перетаскивания проекции необходимо будет нажать кнопку «Установить», которая есть у каждой настройки. Кнопка «Сброс» восстанавливает первоначальные значения. Кнопка «Назад» возвращает просмотр в состояние определенное параметрами Pan/Tilt/FoV.
Рисунок 16. Окно «Параметры просмотра панорамы».
Установка «Pan» определяет угол горизонтальной плоскости, на который будет повернута панорама относительно своего центра. Задание отрицательного значения поворачивает панораму вправо, установка положительного значения – влево.
Установка «Tilt» устанавливает наклон панорамы по отношению к горизонту. Допустимые значения Tilt находятся в пределах от -90° до +90°.
Если выбран переключатель «Показать параметры ограничения», то в окне предпросмотра появятся поля ввода ограничительных значений для четырех направлений (рис. 17). Чтобы установить ограничения поворота (Pan), нужно задать значения в полях «Левый» и «Правый». Значения задаются в градусах относительно центра панорамы. Положительные значения находятся левее центра, отрицательные – правее. Например, если в поле «Левый» будет задано значение 200, а в поле «Правый» − -100, то поворот панорамы будет возможен влево на 200° и вправо на 100°. Чтобы установить ограничения наклона (Tilt), нужно задать значения в полях «Верх» и «Низ». Значения задаются в градусах относительно горизонта. Например, если в поле «Верх» будет задано значение 70, а в поле «Правый» − -70, то наклон панорамы будет возможен вверх на 70° и вниз на 70°.
Если включен переключатель «Игнорировать лимит превью», то заданные установки ограничений не будут применяться для окна предварительного просмотра.
Рисунок 17. Окно «Параметры просмотра панорамы».
Ограничение «Лимит FoV» определяет максимальный и минимальный горизонтальный угол обзора. Минимальный угол обзора определяет насколько близко можно приблизить просмотр, а максимальный – насколько можно отдалить просмотр. Рекомендуемые значения от 30 до 130. Ограничение «Минимальный FoV» можно устанавливать в градусах (по умолчанию) или в пикселах, «Максимальный FoV» – только в градусах.
Установка «Север», позволяет указать направление на север в градусах относительно центра панорамы. Задание отрицательного значения смещает направление на север вправо, установка положительного значения – влево. Переключатель «Показать Север» включает/отключает отображение стрелок с направлениями у горизонта и в надире. Установка обязательна, если вы создаете виртуальный тур (для правильности расстановки точек перехода) и если в туре будет использоваться карта, например Google Maps (для правильной ориентации радара).
Заполнение информации о проекте
Рисунок 18. Секция «Информация о проекте».
Кнопка «Изменить» в секции «Информация о проекте» (рис. 18) вызывает окно для ввода пользовательских данных проекта, таких как заголовок, описание, автор, дата и время, географические координаты, теги и другие (рис. 19). Заполнение информации может быть необязательным, если введенная информация нигде не будет использоваться. Например, нет необходимости указывать географические координаты, если в проекте не будет отображаться карта Google Maps.
Рисунок 19. Окно «Пользовательские метаданные».
Если в проекте используются несколько панорам (виртуальный тур), не лишним будет указать теги. Во-первых, они позволят фильтровать список панорам в браузере тура, во-вторых, с помощью тегов удобно делать навигацию, например по нескольким этажам здания.
Заполненную информацию можно выводить в оформлении панорамы (тура), например, в текстовых полях. Для этого предусмотрен целый ряд заменителей (табл. 1). Возможно использование простейших HTML-тегов для придания стиля введенному тексту, например, <p>, <font>, <b>, <i>, <u> (рис. 20).
Рисунок 20. Пример использования HTML-тегов.
Если изображение панорамы имеет EXIF гео-данные, то значения широты и долготы будут взяты из EXIF.
Таблица 1. Заменители, используемые в редакторе оформления.
| Обозначение | Описание | Место использования |
| Ход загрузки | ||
| $b | Байт загружено | В текстовом поле |
| $t | Байт всего | В текстовом поле |
| $B | Килобайт загружено | В текстовом поле |
| $T | Килобайт всего | В текстовом поле |
| $p | Процентов загружено | В текстовом поле |
| $n | Статус загрузки 0.000 .. 1.000 | В текстовом поле |
| Позиция | ||
| $ap | Текущий угол поворота (Pan) | При указании целевого значения (target) при открытии другой панорамы (в виртуальном туре), а также в текстовом поле |
| $an | Текущий угол поворота (Pan) с учетом Севера | При указании целевого значения (target) при открытии другой панорамы (в виртуальном туре), а также в текстовом поле |
| $at | Текущий угол наклона (Tilt) | При указании целевого значения (target) при открытии другой панорамы (в виртуальном туре), а также в текстовом поле |
| $af | Текущий угол обзора (FoV) | При указании целевого значения (target) при открытии другой панорамы (в виртуальном туре), а также в текстовом поле |
| $cur | Текущие значения pan/tilt/fov | При указании целевого значения (target) при открытии другой панорамы (в виртуальном туре), а также в текстовом поле |
| Точки перехода (Хотспоты) | ||
| $hs | Заголовок | В текстовом поле |
| $hu | Ссылка на URL или на панораму тура | При указании ссылки поле URL в методе Go to URL (Перейти к URL), также ссылки на другую панораму тура в методе Open next panorama (Открыть следующую панораму) |
| $ht | Целевые параметры ссылки | При указании целевого значения (target) ссылки (_blank, _top, _parent, _self) или значения target (Pan/Tilt/FoV) точки перехода в методе Open next panorama (Открыть следующую панораму) |
| Пользовательские метаданные | ||
| $ut | Заголовок | В текстовом поле или переменных. |
| $ud | Описание | |
| $ua | Автор | |
| $ue | Дата / время | |
| $uc | Копирайт | |
| $us | Источник | |
| $ui | Информация | |
| $uo | Комментарий | |
| $lat | Широта | |
| $lng | Долгота | |
Установка географического положения и ориентация на север
Нажатие на кнопку со значком маркера
открывает окно «Координаты» (рис. 21). Окно разделено на две части: карта и предпросмотр. Если значения координат уже были заданы, то на карте появится маркер с радаром. В противном случае нужно будет выполнить поиск местоположения точки съемки на карте и нажатием правой кнопки мыши установить маркер. Для быстрого поиска можно воспользоваться строкой ввода адреса, где можно указать, например, город. Изменение положения маркера осуществляется при помощи захвата и перемещения левой кнопкой мыши. По умолчанию карта находится в обычном режиме. Для точности установки маркера рекомендуется включить режим «Спутник».
Рисунок 21. Окно «Координаты».
После установки маркера необходимо ориентировать панораму на Север. Это можно сделать двумя способами.
В первом способе (рис. 22) поворачиваем панораму в окне предварительного просмотра так, чтобы вертикальная линия совпала с направлением на север, ориентируясь по карте (на ней север всегда вверху). После поворота панорамы в нужном направлении необходимо нажать на кнопку «Установить Север».
Рисунок 22. Первый способ установки на Север
Второй способ (рис. 23) заключается в поиске ориентиров на карте и панораме. Для этого должен быть активирован режим «Pick Landmark». Панорама в окне предварительного просмотра поворачивается так, чтобы вертикальная линия совпала с направлением на ориентир. Затем в окне карты нужно нажать правой кнопкой мыши по этому ориентиру.
Рисунок 23. Второй способ установки на Север
Добавление активных зон
Рисунок 24. Секция «Активные зоны».
Существуют два вида активных зон: точечная и полигональная. Точечная активная зона используется для создания точек перехода между панорамами, также других точечных объектов, шаблоны которых определены в файле оформления. Этот файл создается в редакторе шаблона. Рассмотрение редактора не входит в рамки данной статьи. Я обязательно расскажу о нем в одной следующей статей о Pano2VR. Полигональную активную зону можно использовать для создания области перехода, а также для выделения объектов панораме, чтобы затем можно было отображать текстовую подсказку, появляющуюся при наведении курсора на область полигональной активной зоны.
Добавление активных зон осуществляется в секции «Активные зоны» (рис. 24). Кнопка «Изменить» откроет редактор активных зон. Окно редактора показано на рис. 25.
Точечная активная зона
Рисунок 25. Редактор активных зон. Выделена точечная активная зона
Чтобы добавить точечную активную зону, нужно в редакторе активировать кнопку с изображением мишени после чего осуществить двойное нажатие правой кнопкой мыши области просмотра в определенном месте. Расположение активной зоны можно изменить либо перетаскиванием объекта в виде мишени, либо редактированием в листинге хотспотов значений Pan и Tilt.
Для точечной активной зоны можно указать ID шаблона, определенного в оформлении элемента. Таким образом, можно повлиять на вид и поведение активной зоны при нажатии.
На рис. 26 представлены определенные в оформлении типы шаблонов для точечных активных зон. Шаблон с ID «hotspot» используется для стрелки перехода, другой шаблон с ID «hs_info» используется для отображения информации. Шаблоны представлены в качестве примеров. Это не единственные возможные варианты применения элемента «Активная зона». Подробнее об этом я расскажу в практической части.
Рисунок 26. Шаблоны активных зон.
Полигональная активная зона
Рисунок 27. Редактор активных зон. Выделена полигональная активная зона
Для добавления полигональной активной зоны активируется кнопка с пиктограммой синего пятиугольника. Затем определяется место расположения первой точки и двойным нажатием левой кнопки мыши и производится её установка. После этого одиночным нажатием левой кнопки мыши расставляются остальные точки. После завершения расстановки всех необходимых точек нажатием правой кнопки мыши осуществляется выход из режима редактирования полигональной зоны.
При необходимости внесения изменений в форму полигональной зоны для начала нажатием в пределах зоны производится её активизация, т.е. зона становится доступной для редактирования. При этом она сменит цвет с синего на красный. Добавление новой точки осуществляется нажатием левой кнопки мыши на границе зоны. Для удаления точки потребуется нажать на нее правой кнопкой мыши. Нажатие левой кнопкой мыши и перемещение курсора изменяет положение точки.
Поведение активной зоны при наведении на него курсора, цвет рамки и цвет фона определяются в настройках экспорта панорамы во Flash или HTML5.
Редактор шаблона оформления не определяет элемент для полигональной активной зоны. Поэтому задавать ID шаблона не имеет смысла. ID зоны назначается автоматически и менять его не стоит, если в этом нет необходимости.
Для обоих видов активных зон
Текст заголовка будет выводиться при наведении курсора, если в настройках экспорта включена опция «Текстовые модули для активных зон».
В строке ввода URL указывается веб-ссылка или ссылка на панораму (если собирается виртуальный тур). При нажатии на активную зону будет либо открыт интернет-браузер (используемый по умолчанию) и осуществлен переход по указанной ссылке, либо будет осуществлен переход в другую панораму тура.
Свойство Target для веб ссылок принимает значения _blank, _parent, _self, _top. Для панорам это свойство записано в формате Pan/Tilt/FoV, что определяет целевые параметры просмотра панорамы, в которую будет осуществлён переход. Например, если в Target записано 70/-20/90, то после перехода на панораму она будет повернута на 70° влево относительно своего центра, наклонена вниз на 20° относительно горизонта и угол обзора установится в 90°. Если свойство Target пусто будут использоваться параметры, установленные по умолчанию в параметрах проекции.
Значения Pan, Tilt, FoV, зависят от ограничений, которые устанавливаются в окне «Параметры проекции».
Добавление медиаданных
В панораму можно добавить различные медиа данные аудио, видео, изображения. Редактор медиа открывается после нажатия на кнопку «Изменить» в секции «Медиа». Добавить медиаданные можно одним из следующих способов:
- Перетаскиванием медиафайла в область предпросмотра;
- Выполнением двойного нажатия в области предпросмотра, а затем выбора медиафайла в появившемся диалоговом окне;
- Нажатием кнопки «Открыть» в секции «Настройки медиа» и выбором медиафайла в появившемся диалоговом окне.
В первых двух случаях тип медиафайла (аудио, видео, изображение) будет автоматически распознан и создан элемент управления положением, ориентацией и размером. Удаление осуществляется выбором элемента и последующим нажатием кнопки Delete на клавиатуре.
Добавление фонового звука
Чтобы добавить фоновый звук нужно воспользоваться третьим способом. В секции «Медиа настройки» (рис. 28) выбираем файл аудиоформата (*.mp3, *.ogg). Далее задаем желаемый уровень громкости, и количество повторений (0 - количество повторений не ограничено). Опция «Внешним файлом" касается экспорта во Flash. Если опция не будет активирована, то аудиофайл будет встроен в swf-файл.
Рисунок 29. Редактор медиа.
На этом подготовка проекта завершена. Далее можно переходить к экспорту в формат Flash или HTML5.
Полезные ссылки
Домашняя страница Pano2VR: ggnome.com/pano2vr