Создание поэтажных планов v2.21.

HTML5. krpano version 1.21 !

flpl_2

Возможности

Вся работа производится в окне браузера и не требует написания и редактирования кода.
Создание планов этажей, расстановка точек переходов на панорамы. Добавление чертежей, схем, изображений и расстановка на них точек с переходом на выбранные места в туре.
Настройка окна (расположение, размер, позиционирование, показать/спрятать при старте).
Настройка дизайна окна с планом(цвет, прозрачность, бордюр, закругления, тени).
Включение компаса в окне с планом и окне просмотра (возможность показать/спрятать или отключить компас).
Выбор изображения точек до и после просмотра сцены, настройка их масштаба.
Всплывающий текст - появляются при наведении на точки.
Эффект перемещения. При переходе на следующую сцену сохраняется направление взгляда и угол обзора.
Изображение плана масштабируется относительно расположения курсора на плане (место под курсором не смещается в сторону).
При переходе на следующую сцену план автоматически центрируется в окне относительно спота этой сцены.
Окно с планом перемещается по экрану, изменяется его размер (если потянуть за уголок окна).
При подключенном модуле навигации автоматическая расстановка стрелок в туре, выбор и коррекция показываемых стрелок. Навигация по клику вперед в направлении стрелки.

Редактирование точек с радарами на плане.
YouTube

Как подключить.

Для подключения редактора поместить папку "FloorPlan" в папку с туром и прописать в файле tour.xml:

<krpano>
    <include url="FloorPlan/xml/floorplan_SM.xml" />
    .
    .
</krpano>

Убедитесь что в папке тура plugins есть файлы combobox.js, radar.js и showtext.xml !

Без активации плагина он будет полностью рабочий, но будет выводиться надпись "Демо версия".
При покупке плагина Вам нужно выслать мне электронную почту, которая указана при регистрации Вашего krpano. Ее можно увидеть в "krpano Tools". После этого на почту вы получите ссылку на скачивание плагина и файла-ключа - key_flpl.xml.

Вам нужно просто заменить файл FloorPlan/xml/key_flpl.xml и надпись "Демо версия" исчезнет.

Создаем план.

Разместите изображения планов в папке FloorPlan/plan.

Add plan - Чтобы добавить план, нажмите кнопку "Add plan". Появится изображение плана по умолчанию с именем plansm_№, где № - порядковый номер плана.
Сверху окна создается выпадающий список имен. Щелчок по треугольнику расскрывает список, щелчок по имени из списка открывает соответствующий план.

Select an image - Щелкните по миниатюре с изображением плана - откроется окно проводника. Выберите изображение плана из папки FloorPlan/plan и оно появится в окне с планом

Open at startup - Зеленый индикатор - окно плана при запуске тура раскрыто, серый индикатор - окно свернуто.

Open at startup (mobile)- Для мобильных устройств. Зеленый индикатор - окно плана при запуске тура раскрыто, серый индикатор - окно вернуто.

Click on the plan - [br]Collapse/expand the plan - Зеленый индикатор - клик по плану сворачивает/разворачивает план.

Start scene - Выбор сцены, которая запустится при открытии плана. Откройте план, запустите нужную сцену, принадлежащую данному плану. Нажмите кнопку "Start scene"и рядом с ней появится имя текущей сцены. При последующем открытии этого плана будет запускаться выбранная сцена.

Positioning - Установите точку привязки плана к экрану. Возможные значения: левый верхний, левый, левый нижний, верхний, центральный, нижний, правый верхний, правый, правый нижний. Значение по умолчанию: правый верхний

Delete plan - Удаляет текущий план.

Editor design - Открывает дополнительную панель для редактирования дизайна окна. Более подробная информация здесь.

shesterenka - Открыть панель с расширенными настройками.

Выравнивание панорам.

Что-бы радар на плане корректно показывал направление взгляда и при навигации по туру с сохранением направления, нужно предварительно сориентировать центр панорам на "север". Вы это можете сделать заранее:

При сборке панорам.
В родном редакторе "krpano Tools"

Если вы уже это сделали, пропустите этот раздел.
По умолчанию центр панорамы является нулевой точкой(0 градусов по горизонтали) и считается "севером"
На планах и картах север по умолчанию находится сверху.
Направление "радара" на плане по умолчанию вверх(на север) и его значение 0 градусов, что соответствует 0 градусов в панораме(центр панорамы)

prealign - Включает режим редактирования выравнивания. Появляется перекрестие и индикация горизонтального угла.
Поверните панораму так, что бы перекрестие смотрело на "север" в панораме, нажмите на индикацию угла или пробел, Центр панорамы переназначится.
Посмотрите пример на youtube .

Часто бывает так, что выравнивать на север неудобно, он находится под углом к стенам. Гораздо удобнее выравнивать перпендикулярно стенам, проемам и т.д. Выберите удобное для вас направление выравнивания, например перпендикулярно стене. Выровняйте все панорамы в этом направлении. Т.к. теперь нулевая точка панорам не является севером, внесите поправку в компасе. comp

Ухватившись за полоску компаса в верхней части экрана сдвиньте ее до совмещения с реальным направленм севера.
Посмотрите пример на youtube .

Создаем точки, настраиваем компас и радар.

Предварительно разместите изображения точек в папке FloorPlan/iconPoint
Scale radar - Нажмите на кнопку и перетаскивайте мышь влево/вправо, что бы изменить размер радара.
Start - выбор изображения точки до просмотра сцены. Щелчок по миниатюре изображения точки откроет проводник, выберите изображение.
Viewed - выбор изображения точки после просмотра сцены.
Active - изображение активной точки (с радаром).

• Включаем режим редактирования - кнопка "Edit scene point" становится красного цвета, появятся пересекающиеся красные линии (для удобства позиционирования).

• Откройте панораму, щелкните на плане в том месте , где находится эта панорама. Появится точка с радаром. Радар по умолчянию будет направлен на север панорамы(который установили заранее). Для каждой панорамы можно создать только одну точку..

radar • Кнопки на плане(только в режиме редактирования точек плана)

Size- нажмите и перетаскивайте влево/вправо для того что бы изменить размер точки. Изменения применятся ко всем точкам на этом плане.

Delete - удалите точку.

heading radar- коррекция радара. Нажмите и перетаскивайте влево/вправо для того что бы внести корректировку направления радара.
Если на плане север не сверху или при выравнивании панорам была внесена корректировка севера, то разверните радар в направлении севера.

• Show text- Всплывающий текст при наведении мыши. По умолчанию текст берется из title scene. Можете ввести свое название для кождой точки.

Создаем точки для показа выбранных видов.

Вы можете создавать иконки (далее-точки) и присваивать им открытие панорам с заданным увеличением и направлением взгляда. Разместите их на планах, чертежах, документах, схемах, которые можете добавить в окно с планами.

Edit view point - включить/выключить редактирование точки.
Щелчек на плане создаст иконку точки. Ей автоматически присвоится открытие текущего вида.

Выбор изображения точки:

start - выбор изображения точки до просмотра сцены. Щелчок по миниатюре изображения точки откроет проводник, выберите изображение в папке floorplan_SM/iconPoint folder.
viewed - выбор изображения точки после просмотра сцены в этой же папке.

Если редактор включен Edit view point, то изображение будет присваиваться активной точке. Если редактор отключен, то изображение будет присваиваться при создании новой точки.

Show text - Введите текст в строку. Показать текст при наведении мыши.

Кнопки на плане:
Set view - Выберите ракурс места в панораме, которое хотите показать, нажмите на кнопку. Ракурс сохранится в точке и будет открыт при клике по ней.
Scale - изменяет масштаб изображения точки. Нажмите на кнопку и смещайте в нажатом состоянии влево (уменьшение масштаба), вправо (увеличение масштаба).
Delete - удалить точку.

Пример на youtube . Точки для открытия выбранных мест в туре.
Пример на youtube . Документ, чертеж с точками открытия отмеченных мест в туре.

Compass:
compass

enabled

start open - компас развернут при старте.
on plan - показ компаса в окне с планом.

Keepwiew
keep Создает эффект перемещения. При переходе на следующую сцену сохраняется направление взгляда и угол обзора. Не требуется предварительное одинаковое выравнивание всех панорам во время сшивания.

Настройка дизайна.

Нажмите на кнопку "Editor design" - откроется панель настройки дизайна.
skin
В панели условно изображено окно плана. Круглые кнопки на бордюре для изменения параметров. Нажмите на него и тащите мышь влево/вправо.
Если нажать на круг, который расположен на углу, он будет изменять закругление соответствующего угла окна с планом. Круг на стороне(бордюре) - изменит толщину бордюра соответствующей стороне.
Можете одновременно изменить радиусы всех углов или ширину всех бордюров.
Рядом с круглыми кнопками окошки - в них выводится числовое значение. Вы можете внести свои значения параметров. Shadov layer - Смещение тени окна.
blur - Размытие тени.
Изменение цвета и прозрачности Снизу три окна, которые открывают палитру цветов, для изменения цвета и прозрачности:
fill - Цвет и прозрачность фона окна с планом.
border - Цвет и прозрачность бордюра.
shadov - Цвет и прозрачность тени.
Вы можете скопировать или вставить цвет RGB или прозрачность
Пример на youtube

Настройка размеров и положения.

В нижней части окна настройки размера и положения окна плана.
Plan name - Имя текущего плана, к которому будут применены изменения.
starting size and position - Показать размер и положение плана при старте.
x y - Стартовые значения "x" "y" в пикселях от точки позиционирования.
Можно ввести значение вручную.
get current x and y - Переместите мышкой окно с планом в нужное положение и нажмите эту кнопку - значения x y установятся как стартовые.

Если ухватиться за уголок окна с планом, можно изменить его размер.
Width - Текущая ширина плана. Можно ввести вручную или установить, расстягивая окно мышью.
Height - Текущая высота плана. Можно ввести вручную или установить, расстягивая окно мышью, при условии что не установлено "auto height"
auto height - Если активна(Зеленый индикатор),то высота будет выставлена автоматически в зависимости от выставленной ширины, пропорционально изображению плана.
W.mob - Ширина окна на мобильных устройствах.
H.mob - Высота окна на мобильных устройствах(если не установлено "auto height" )
set current W H - установить текущие размеры окна с планом для мобильных устройств. Можете предварительно задать размер, потянув окно за уголок.

Keep current size - применить установленные размеры как стартовые.
curent plans/all plans - применить установленные размеры как стартовые к текущему плану(индивидуально)/ ко всем планам.

Навигация, авто стрелки.

При обновлении плагина эта функция является платной. При покупке плагина она входит в стоимость.

Навигация работает при условии, что все панорамы выровнены в одном направлении(смотрите prealign ) и все точки расставлены на планах.
Для навигации по стрелкам достаточно щелкать в пустом месте в направлении стрелки.

Navigation - если индикатор напротив надписи зеленый, то навигация включена. Щелчек по индикатору переключит в противоположное состояние.

Auto- Стрелки в туре расставляются автоматически для всех панорам, расположенных на плане. Нет возможности исключать и перемещать стрелки.

vid_2

Manual selection - Стрелки создаются автоматически, но можно выбрать показ нужных стрелок, можно корректировать положение стрелки.
При активации этого режима на плане возле каждой точки появляется индикатор стрелки красного цвета.
Нажмите на индикатор - он станет зеленый и стрелка появится в панораме.
Можно скорректировать положение стрелки перетащив ее мышкой.

Ниже расположены кнопки для изменения параметров стрелок, которые применяются ко всем стрелкам.
Для изменения параметра нужно нажать на кнопку и перемещать мышь(влево/вправо).
Вы сразу будете видеть изменения.
🡸 Scale 🡺 - Изменить размер стрелок.
🡸 Height 🡺 - Вертикальное смещение стрелок.
🡸 Incline 🡺 - Наклон стрелки вперед.
Print <\> - Скопировать в буфер обмена код хотспотов, которые есть в текущей панораме.
Вы можете вставить скопированный код в код сцены и отредактировать параметры на свое усмотрение.

vid_2

Переход на другой этаж нужно указать вручную.
Нажмите кнопку transition to floor 🡺 появится список панорам с миниатюрами(которые присутствуют на планах). Выберите из списка панораму на которую нужно перейти - в перекрестии появится стрелка. Скорректируйте ее положение.
Remowe arrow - Удалить стрелку перехода на другой этаж.

Сохранение.

Нажмите кнопку сохранения, в выпадающем окне укажите путь сохранения файла FloorPlan/setting_FP.xml
Если ваш браузер автоматически сохраняет в загрузки, то вручную замените им файл в папке FloorPlan/setting_FP.xml
Перезагрузите браузер - тур обновится с сохраненными изменениями.

Если активировано резервное копирование "backup", то сначала сохраняется резервный файл c датой сохранения в имени файла.

Отключение редактора.

Вариант №1:
Откройте файл FloorPlan/setting_FP.xml и установите plan_settings editor="false"
Вариант №2:
Откройте Расширенные настройки, переключите ползунок vid_2 и сохраните проект.

Что бы включить редактор обратно установите в файле FloorPlan/setting_FP.xml
plan_settings
editor="true"

Расширенные настройки.

shesterenka - Открыть панель с расширенными настройками.

Настройте параметры на свое усмотрение. Щелчек по переключателю справа изменит состояние.
Слева сверху кнопка переключения языка (en/ru)

Панель настройки отдельных значков для точки - активирует плавающую панель для индивидуального редактирования точки.

1 - клик откроет папку для выбора иконки непросмотренной панорамы.
2 - клик откроет папку для выбора иконки просмотренной панорамы.
reset - установка иконок по умолчанию .
3 - Отключить/включить сохранение вида при переходе на панораму. При отключенном состоянии панорама загрузится с предустановленном видом.

Установки в файле setting_FP.xml.

По завершении работы с планом вы сохраняете все параметры в этом файле "setting_FP.xml". Некоторые параметры в этом файле вы можете изменить вручную.

point_url_1 - Имя изображения точки на плане (непросмотренной сцены).
point_url_2 - Имя изображения активной точки на плане.
point_url_3 - Имя изображения точки на плане (просмотренной сцены).
pointv_url_1 - Имя изображения точки в документе (непросмотренной сцены).
pointV_url_2 - Имя изображения точки в документе (просмотренной сцены)
Иконки должны находиться в папке FloorPlan/iconPoint

radar_scale - Масштаб радара по умолчанию.
lang - Язык по умолчанию в панели расширенных настроек(en/ru).

Ниже прописаны стили и слои:
action name="prealignFLPL" - Действие для выравнивания панорам
textstyle name="showtext_1" - Стиль всплывающего текста при наведении на точки.
style name="arrow_navi_flpl" - Стиль стрелок навигации.
style name="pointflpl" - Стиль точек на плане (с радаром).
style name="pointflpl_v" - Стиль точек на плане для открытия видов.
layer name="cont_fp_all" - Основной контейнер окна с планом под планы и кнопки.
layer name="plan_cont_fp2" - контейнер для слоев с изображениями планов.

Стили в файле style_Flpl.xml..

Требуются знания krpano !

В файле FloorPlan/xml/style_Flpl.xml прописаны стили, слои и настройки некоторых элементов плагина, подключены плагины showtext.xml и combobox.xml.
Вы можете настроить дизайн кнопок, положение в окне плана(раскрыть на полный экран, закрыть, компас, +, - ), настроить радар.
Можете настроит параметры комбобокса со списком планов , вынести его за пределы окна плана.
Настроить риски и подписи компаса.
Настроить параметры авто навигации.

Скачать демо-версию.

Скачайте архив с примером и плагином. Вы можете подключить его к своему туру и протестировать.
Демо-версия полностью рабочая и отличается от полной наличием надписи «ДЕМО-версия» .

Приобрести плагин.

Стоимость плагина 49 euros.

Оплатите плагин и отправьте мне электронную почту, которая указана при регистрации Вашего krpano.
После оплаты я вышлю на вашу почту файл-ключ, надпись "демо версия" исчезнет.

Обновление старых плагинов не включает в себя модуль навигации. Модуль навигации платный, стоимость 10 евро.

Если у вас есть вопросы по оплате или обновлению , напишите мне novosibpano@ya.ru или в телеграм Александр.

Примечание.

Плагин предоставляется «как есть» без каких-либо гарантий, явных или подразумеваемых, включая любую гарантию качества, товарности или пригодности для определенной цели. Ни в коем случае автор плагина не несет ответственности за потерю данных, стоимость закупки замещающих товаров или услуг или любых особых, косвенных или случайных убытков по любой причине и независимо от того, был или не был автор плагина уведомлен о возможности такого ущерба.
Это ограничение будет применяться независимо от любого отказа основной цели любого ограниченного средства правовой защиты, предусмотренного в настоящем документе. В любом случае автор плагина не будет нести ответственности, вытекающей из этого соглашения.

Разработки в krpano

Содержание

Ссылки

Изменения