Коротко: krpano сделали новый редактор тура и добавили крутые комбо-боксы. Теперь расставлять переходы можно непосредственно при помощи krpano Tools, не прибегая к запуску html файла tour_editor, а в углу экрана можно без проблем разместить список панорам с картинками.
А если немного подробнее, то теперь krpano Tools при запуске покажет вам следующее окошко:
Новый редактор krpano
Прям в это окошко можно перетащить ваш tour.xml:
После загрузки тура вы увидите уже довольно привычный интерфейс, в котором можно (по порядку):
Load tour.xml — загрузить другой xml файл тура вместо текущего
Set as startup view — сделать текущий поворот панорамы стартовым
Add hotspot — добавить стрелку перехода (хотспот)
Edit tour.xml — править файлик вручную
Save tour.xml — сохранить tour.xml с заменой (будет сделан автоматический бекап предыдущей версии)
Open tour folder — открыть папку с туром
Интерфейс редактора тура
Из всего перечисленного радует, в основном, кнопка Save tour.xml, которая избавляет от множества лишних движений. Раньше её очень не хватало. А в остальном практически ничего не изменилось. Как пользоваться редактором тура, я рассказал в статье Первые шаги.
Наиболее важно в этих изменениях следующее:
krpano полностью отказались от старого flash редактора. Ура!
Теперь превьюшки панорам обновляются автоматически в соответствии со стартовым направлением. Больше не нужно морочиться с их ручной заменой. Ура ура ура!
Что ещё изменилось (важное для меня)
Новый плагин combobox.xml — теперь на чистом xml, да ещё и с настройками.
Настройки можно весьма недурственно менять, хоть вообще полностью. Вот пример с круглыми уголками (третий на изображении выше):
Заметил, что посетители попадают ко мне на сайт по запросу «Как сделать маленькую планету в виртуальном туре», но статьи, в которой было бы об этом подробно рассказано, у меня нет. А ведь создание заставки «маленькая планета» в krpano — совсем несложная затея, и отлично работает «из коробки».
Итак, чтобы сделать заставку в виде маленькой планеты, вам понадобится виртуальный тур, созданный в krpano. Если у вас пока что нет своего тура или лицензии krpano, можете использовать мой тур, скачав его на странице.
В статье вы найдете подробную инструкцию, как сделать виртуальный тур с планом или картой этажа.
Руководствуясь прошлыми уроками, вы уже можете собрать собственный виртуальный тур в krpano, можете расставить хотспоты, настроить внешний вид и даже сделать активные области. Однако, немаловажная часть любого виртуального тура — карта, и в этой статье вы узнаете, как добавить карту в ваш виртуальный тур.
В этом уроке вы узнаете, как сделать открывающиеся двери, шкафчики, а также анимировать любую часть виртуальной панорамы средствами krpano.
Эта статья расскажет вам о продвинутой вставке фрагментов панорамы в любую другую виртуальную панораму. Отличие этого способа от ручного заключается в высочайшей точности позиционирования фрагмента: вы можете спокойно вклеивать «открытые» двери и шкафчики, анимировать открытие диванов, окон и других элементов интерьера, добавлять в панораму исчезающих людей.
В этой статье вы узнаете, как изменить различные настройки скина krpano: сделать превьюшки открытыми или закрытыми по умолчанию, настроить их прокрутку, добавить логотип компании. Откройте ваш файл tour.xml и вглядитесь в его строки.
Важно понимать, что за основу для всех превью krpano берёт переднюю грань куба, после чего из неё с помощью кадрирования вырезается нужный фрагмент, который потом, к тому же, масштабируется.
Находится каждый файл в папке вашего тура vtour/panos/XXX.tiles/thumb.jpg
Настраивается отображение превью с помощью кадрирования (crop), указания размеров изображений и интервалов между ними. Все эти настройки задаются в блоке skin_settings вашего файла tour.xml.
ВНИМАНИЕ! С 21 сентября 2017 года большая часть этой информации вам уже не понадобится: теперь Vtour Editor встроен непосредственно в krpano tools, и превьюшки обновляются автоматически, при изменении стартового направления обзора в каждой панораме.
Вы создали виртуальный тур, добавили переходы, сделали подписи панорам, и теперь хотите немного «довести до ума» его внешний вид, чтобы он смотрелся подобающим образом для вашего сайта. Что ж, давайте сделаем это.
Прежде всего, почему я работаю с krpano 1.19, которая пока ещё официально находится на стадии Beta тестирования? Потому что в этой версии движка добавлено очень много классных вещей, о которых мы с вами чуть ниже поговорим.
За кадрирование в krpano отвечает переменная crop. В скобках после названия переменной указываю координаты кадрирования — отступ до целевого фрагмента от левого края (x), от верхнего края (y), а также ширину вырезаемой области (w) и высоту (h). Обозначенный таким способом прямоугольник выводится на экран, а вся остальная часть изображения обрезается.
Использование этого приема позволяет сократить число обращений к серверу и существенно увеличить скорость загрузки виртуального тура.
Консоль krpano по умолчанию скрыта, но её можно вызвать клавишей O в английской раскладке. Консоль нужна для отображения отладочной и служебной информации, версии движка, обладателя лицензии krpano. Например, вызвав в любой функции действие trace(peremennaya_a) — можно вывести в консоль значение этой переменной.
Однако, вы можете столкнуться с тем, что консоль не открывается. Возможно, её открытие заблокировано в шапке одного из xml файлов.
Как запретить появление консоли?
Очень просто. Откройте файл tour.xml или любой другой, подключенный к туру, и в шапку <krpano version=»1.19″ title=»» > добавьте logkey=»false». Также можете заблокировать появление консоли в случае ошибок: showerrors=»false»
Воспользовавшись инструкциями, вы сделали свой первый виртуальный тур, добавили переходы, установили стартовые параметры проекции. Но теперь хочется большего: вам нужно настроить свой тур, сделать его уникальным и непохожим на остальные. В krpano версии 1.19 и новее сделать это совсем несложно, все настройки вынесены в верхнюю часть файла tour.xml.
Вы уже создали свой первый виртуальный тур в krpano, и теперь самое время расставить в нем связи между панорамами, сохранить стартовые параметры проекций, подписать сцены. Давайте приступим. Но сначала нам потребуется определиться с некоторыми понятиями…
Виртуальный тур это сложный многофайловый проект, который подчас требует специальных сетевых разрешений. Например, в Google Chrome при открытии тура в офлайн-режиме не будет работать зуммирование колесом мыши, не сработает Deeplinking, не будут открываться внешние ссылки (например, ваш сайт после щелчка по логотипу).
Поэтому вам рано или поздно понадобится виртуальный сервер. Разумеется, можно использовать великолепные решения Denwer и Openserver, но они слишком громоздки для наших скромных нужд.
Именно поэтому в свежих версиях разработчиками krpano был добавлен тестовый сервер, с помощью которого вы можете проводить отладку создаваемого виртуального тура.
В предыдущем материале я привёл аргументы, почему выбрал движок krpano. В этой части расскажу, как начать с ним работу. Не нужно ничего изобретать, скачайте дистрибутив программы с официального сайта krpano.com и распакуйте архив в папку на компьютере.
Совет: в некоторых случаях могут быть проблемы при работе с кириллическими адресами, поэтому лучше размещать дистрибутив krpano в папках, не содержащих русских букв в имени.
Например, папка D:\krpano подойдет, а D:\мои документы\krpano – не подойдет. Лично у меня в корне диска находится папка krpano, а в ней уже лежат дистрибутивы разных версий и с разными скинами. То же правило касается туров, с которыми вы будете работать: они не должны лежать в папках, в адресе которых есть кириллические символы, иначе виртуальный сервер krpano не заработает.
На Маке у меня все прозаичнее – все версии krpano находятся в папке программ.
Рабочие файлы krpano
Вот вы скачали и распаковали программу. Все, можно приступать к работе. Движок полностью функционален, но в незарегистрированной версии все изображение будет расписано копирайтами. Также копирайт будет в центре экрана при просмотре панорам. В остальном никаких ограничений нет.
Установка не требуется, вы можете носить все файлы на любом носителе и копировать куда угодно.
Как купить krpano
Приобрести лицензию можно на официальном сайте krpano.com. Если у вас возникают проблемы (а у меня они были, не мог зарегистрироваться на сайте по непонятным причинам), пишите в техподдержку, — вам обязательно ответят и предложат решение проблемы. Например, меня направили в другой интернет-магазин, где я купил лицензию по той же цене, что на официальном сайте, и безо всяких проблем.
Как зарегистрировать krpano
Запустите файл krpano Tools (красненький), и в открывшемся окне введите ваш ключ, который получили на почту после покупки программы. После проведения активации вы увидите галочки на тех пунктах, которые вам доступны в соответствии с типом приобретенной вами лицензии.
Лицензия krpano
При следующем открытии krpano Tools вы увидите уже другое окно, в котором можно делать несколько очень полезных операций, но об этом позже.
Программа зарегистрирована (или нет), и мы можем приступать к работе.
Как сделать виртуальный тур?
Забегая вперед и не вдаваясь ни в какие подробности, просто возьмите ваши файлы панорам, лежащие в произвольной папке, и перетащите их на файл с названием MAKE VTOUR (MULTIRES) droplet. А если у вас пока нет таких файлов, скачайте проекции панорам по этой ссылке, распакуйте в отдельную папку, и работайте с ними.
Перетащите ваши эквидистантные проекции панорам на дроплет
Откроется окно терминала (белое на mac, черное на windows), там побегут какие-то строчки, и вскоре рядом с вашими файлами появится новая папка под названием vtour.
Терминал krpano
Открыв папку, вы увидите несколько файлов.
Файлы виртуального тура
Откройте файл tour.html, и увидите ваш виртуальный тур. Или не увидите.
Виртуальный тур krpano
Или не увидели? Если что-то пошло не так, и перед вами оказался черный экран вместо тура, отображенного на картинке выше, не спешите огорчаться. В некоторых браузерах тур может не открыться из-за параметров безопасности (а сейчас, на конец 2016 года, он не открывается ни в одном браузере). Если такое произошло, не расстраивайтесь, ведь это нормально. Чтобы виртуальный тур работал, ваш браузер должен думать, что открывает его из интернета. Для этого в составе krpano есть виртуальный сервер. Откройте ссылку, сделайте всё как описано там, и возвращайтесь сюда. Теперь у вас есть рабочий тур, открытый в браузере.
Рассмотрим список дроплетов krpano.
Дроплеты krpano и их назначение
Дроплеты это небольшие скрипты, которые выполняют определенные задачи. Чтобы активировать тот или иной дроплет, нужно просто перетащить на него несколько файлов.
Convert SPHERE to CUBE – конвертирует изображение из эквидистантной проекции в грани куба. Дроплет нужен, чтобы из панорамной “простыни” получить грани куба. Например, для ретуширования надира (пола)
Convert CUBE to SPHERE – конвертирует изображение из граней куба в эквидистантную проекцию. Дроплет нужен, чтобы после редактирования граней куба преобразовать панораму в единый файл, который удобнее хранить.
Эквидистантная проекция и грани куба
При выполнении дроплетов конвертирования, описанных выше, krpano всегда преобразует ваше изображение в TIFF с глубиной цвета 16 бит. И это правильно, т.к. потери качества при конвертации должны быть минимальны, а 16-битный tiff обеспечивает неплохой цветовой охват и, следовательно, меньшие потери.
MAKE OBJECT – создает из множества файлов VR объект. Чтобы отработал успешно, перетаскивайте на дроплет несколько изображений одного и того же предмета, вращающегося вокруг своей оси. На выходе будет сгенерирован «объект», который можно «крутить» с помощью мыши. При этом программа последовательно меняет кадры, создавая эффект псевдо 3д.
MAKE PANO (FLAT) droplet – создает “плоскую” панораму, которая автоматически дробится на фрагменты (tiles), которые подгружаются в зависимости от разрешения монитора и увеличения отдельных фрагментов изображения пользователем. Подходят для гигапанорам.
MAKE PANO (MULTIRES) droplet – создается сферическая или цилиндрическая панорама с мультирезолюшеном (будет корректно отображаться как на маленьких мониторах нетбуков, так и на больших мониторах).
MAKE PANO (SINGLE-SWF) droplet – для любителей умерших технологий. Flash никому не нужен, так что забудьте про этот дроплет.
MAKE VTOUR (MULTIRES) droplet – генерирует виртуальный тур с мультирезолюшеном, уменьшенными изображениями для каждой панорамы, кнопками управления, опциональными подписями и стрелками-переходами. Именно им вы будете пользоваться чаще всего. Все файлы помещаются в папку vtour\ — рядом с вашими панорамами.
MAKE VTOUR (NORMAL) droplet – создает виртуальный тур без мультирезолюшена в максимально допустимом для кубической проекции разрешении. Не гарантирвана стабильная работа на мобильных устройствах, недостаточное разрешение для больших мониторов. Все файлы помещаются в папку vtour\ — рядом с вашими панорамами.
Теперь просто возьмите ваши ранее созданные панорамы в виде эквидистантных проекций и перетащите на дроплет MAKE VTOUR (MULTIRES) droplet. Откроется окно терминала, в котором вы сможете наблюдать, на какой стадии находится создание вашего виртуального тура, а точнее, его “рыбы”. Через несколько секунд (минут) тур будет готов, и в папке рядом с панорамами появится папка vtour\
Файлы виртуального тура
В ней находится несколько файлов и папок. Поговорим о них подробнее.
Файлы виртуального тура, созданного в Krpano
panos\ – в этой папке находятся «нарезанные» изображения, составляющие вашу панораму, уменьшенные картинки для каждой панорамы и превью, которые загружаются в первую очередь и выглядят размытыми, пока панорама грузится.
skin\ – папка, которая содержит все элементы интерфейса вашего тура, включая изображения и файлы xml.
plugins\ – папка, в которой содержатся xml, js и swf плагины, без которых работа многих функций вашего виртуального тура была бы невозможна.
tour.xml – в этом файле хранится информация обо всех панорамах вашего тура, ссылка на файл с информацией о графическом интерфейсе и базовые настройки тура.
tour.swf – обеспечивает работу виртуального тура на устройствах с поддержкой Flash, например, Google Chrome. Однако, тот же Chrome великолепно справился бы и без этого файла, открыв тур в режиме html5. Тем не менее отказываться от файла пока что преждевременно. Например, редактор тура krpano по-прежнему работает на flash.
tour.js – важный файл, отвечает за интеграцию тура в страницу, его корректное отображение на устройствах как с поддержкой flash, так и без нее, занимается определением типа устройства и подгрузкой соответствующих файлов виртуального тура.
tour.html – файл, в котором показан пример встраивания тура в веб-страницу. Именно это файл нужно открывать в браузере, если хотите посмотреть, как выглядит созданный вами тур.
tour_editor.html – файл, при запуске которого к вашему виртуальному туру подключается редактор, с помощью которого можно превратить набор панорам в связанный виртуальный тур.
Я предпочитаю для работы с виртуальными панорамами пользоваться Google Chrome с включенными инструментами разработчика (CTRL+SHIFT+I для Windows, CMD+SHIFT+I для MAC). Однако, если вы поклонник Firefox и Firebug, нет никаких проблем. Пользуйтесь этим комплектом.
После того, как вы запустили tour.html и убедились, что тур открывается, при этом в нем есть все панорамы, которые нужны, мы можем приступить к созданию стрелок-переходов, установке стартовых проекций, и т.д.
Об этом поговорим в следующей статье.
Что делать, если после создания тура вы открываете файл tour.html в браузере, но вместо него видите чёрный экран и какие-то надписи?
Прежде всего, не паникуйте.
Возможно, вы запустили tour.html в одной из старых версий Firefox, которая не поддерживает работу с html5 в офлайн-режиме. Прежде всего, попробуйте открыть тур в Google Chrome. Скорее всего, всё у вас получится.
Возможно, вы запустили tour_editor.html в браузере, не поддерживающем Flash. Запустите файл в Google Chrome или установите Flash player для вашего браузера. Правда, Firefox скоро полностью откажется от Flash, поэтому на текущий момент выбор один — пользоваться Хромом.
Возникла другая проблема? Откройте созданный тур, нажмите клавишу O (на английской раскладке), скопируйте сообщения, которые появились внизу, и пришлите сюда в комментарии. Я помогу.
[widget id=»nav_menu-2″]
Krpano на момент написания этого материала – лучший панорамный движок из всех, что когда-либо были созданы. Лучший по сумме качеств:
совместимость,
сбалансированность,
скорость работы,
плавность,
расширяемость,
удобство разработки и авторинга виртуальных туров,
поддержка мобильных устройств,
развитие в ногу со временем.
На krpano работают крупнейшие панорамные проекты мира, такие как airpano.com и 360cities.net. И только Google решил изобрести собственный велосипед. Честно говоря, зря. Получается пока что не очень.
