Создание и загрузка карты офиса
В этой статье показан процесс загрузки SVG-карты в модуль. Карта всегда загружается в раздел 3-го уровня (кабинет), поэтому перед загрузкой карты важно убедиться, что нужный кабинет создан. Подробнее о создании городов, офисов и кабинетов написано здесь.
Если в описании кабинета были размещены HTML-заглушки, показанные в этой статье, то перед импортом карты их стоит убрать либо заменить на обычное текстовое описание.
Вам может понадобится инструкция о том, как создать карту и подготовить ее к импорту. Вся эта информация размещена в отдельном документе. В данной статье показан только процесс загрузки готовой карты в кабинет.
Загрузка карты в пустой кабинет
Права на загрузку карты есть только у администраторов, офис-менеджеров и модераторов. Подробнее о ролях правах доступа написано в отдельной статье.
Перейдите в публичную часть модуля. В верхней панели выберите кабинет, для которого требуется загрузить карту. Нажмите на иконку изображения.
В результате откроется слайдер для импорта карты на портал. Здесь вы можете найти ссылку на инструкцию по созданию и подготовке SVG-карты для модуля. Чтобы загрузить готовый SVG-файл на портал нажмите «Добавить файл».
Выберите на своем устройстве нужный файл с картой данного кабинета.
Когда файл загружен, убедитесь, что количество рабочих мест, которые модуль видит в файле, корректное.
В нижней части слайдера вы увидите настройки импорта, по умолчанию здесь активно 4 чекбокса. Так как новая карта загружается в пустой кабинет, никакие настройки менять не нужно. Подробнее об этих настройках написано ниже.
Ниже в поле «Тип» укажите тип загружаемых рабочих мест. Стандартно в модуле есть три типа мест: переговорная, место без ПК, место с ПК. При выборе любого из типов он будет установлен сразу для всех рабочих мест на карте.
На карте офиса типы рабочих мест отображаются в виде соответствующих иконок. После импорта для каждого рабочего места можно указать другой тип места, а также добавить новый. Подробнее о типах рабочих мест написано в отдельной статье.
Когда тип указан, нажмите на кнопку «Продолжить». Рабочие места и карта офиса будут загружены на портал и готовы к бронированию. Дополнительно вы можете настроить рабочие места. Подробнее об этом написано в отдельной статье.
Замена текущей карты на новую
Бывают случаи, когда уже существующую карту нужно обновить и загрузить вместо нее другую. Для этого перейдите в публичную часть модуля и в верхней панели выберите кабинет, для которого требуется загрузить карту. Нажмите на иконку изображения.
В результате откроется слайдер для импорта карты на портал. Здесь вы можете найти ссылку на инструкцию по созданию и подготовке SVG-карты для модуля. Чтобы загрузить готовый SVG-файл на портал нажмите «Добавить файл».
Выберите на своем устройстве нужный файл с картой данного кабинета.
Так как в текущем кабинете уже есть рабочие места, т.е. загруженная карта, нужно обратить внимание на настройки импорта. Рассмотрим каждую из них:
- Заменить растровое изображение офиса/кабинета. Растровое изображение кабинета — это схема кабинета в формате PNG. Схема является подложкой, т.е. фоновым изображением и сама по себе не интерактивна. Опция позволяет загрузить/не загружать новое фоновое изображение карты офиса, т.е саму схему кабинета без интерактивных рабочих мест. Оставьте галочку активной, если новая импортируемая схема отличается от текущей. Например, в офисе поменялась планировка.
Растровое изображение новой карты показано на слайдере импорта и по клику его можно открыть в новой вкладке:
Как может выглядеть растровое изображение офиса, т.е. PNG-фон без интерактивных рабочих мест:
Как выглядит PNG-фон с добавленными интерактивными рабочими местами:
- Заменить имеющиеся ширину/высоту новыми данными. Опция позволяет изменить размер карты офиса в соответствии с новым файлом. Если галочка активна, то новая карта будет загружена с той шириной и высотой, которая была задана при создании этой карты в Figma. Если галочка снята, то при импорте новой карты для нее будет установлена ширина и высота текущей (старой) карты. Оставьте галочку активной, если новая карта отличается по размеру от текущей, например, площадь офиса увеличилась и карту отрисовали в других пропорциях, чтобы вместить больше рабочих мест.
Ширина и высота новой карты показаны на слайдере импорта:
Ширину и высоту текущей карты можно увидеть в настройках кабинета во вкладке «Доп. поля»:
- Заменить имеющийся шаблон схемы новым. Шаблон схемы — это, по сути, система координат, которая накладывается на растровое изображение кабинета (п.1). Визуально шаблон схемы не видно на карте офиса, т.к. это технический элемент, который нужен чтобы интерактивные рабочие места отображались там же, где они отрисованы на PNG-схеме. Опция позволяет загрузить/не загружать новый шаблон схемы на изображение кабинета. Оставьте галочку активной, если новая карта отличается по размеру, планировке и/или кол-ву рабочих мест.
Рассмотрим подробнее, как шаблон схемы влияет на отображение карты офиса.
Основа карты офиса — это растровое изображение кабинета, т.е. схема кабинета в формате PNG. Схема является фоновым изображением и сама по себе не интерактивна. На схеме отрисованы рабочие места, которые есть в офисе; в рамках данного примера это места 1-11.
Поверх отрисованных мест выводятся интерактивные элементы, т.е. те же рабочие места, но уже в SVG-формате. По клику на такие места выполняется бронирование.
У каждого SVG-места есть свои координаты, и если они заданы корректно, то SVG-место выводится в правильных точках на PNG-схеме офиса. Именно шаблон схемы добавляет на карту саму систему координат, в которой размещаются рабочие места в SVG-формате.
- Деактивировать/удалить имеющиеся рабочие места, не совпадающие по идентификаторам. Опция позволяет скрыть или полностью удалить те рабочие места, которые есть на текущей карте, но отсутствуют на новой. В скобках показано количество мест, у которых не совпадают идентификаторы, т.е. которых нет на загружаемой карте.
Если в скобках стоит значение больше нуля проставьте галочку и выберите, что сделать с такими местами: деактивировать или удалить.
Например, на текущей карте может быть 3 места с идентификаторами А1, А2, А3 (идентификаторы присваиваются на этапе создания карты в Figma). При этом в новой импортируемой карте тоже 3 места, но с идентификаторами S1, S2, S3. Если места А1-А3 не деактивировать/удалить, то места S1-S3 будут добавлены поверх, т.е. произойдет наслоение мест друг на друга. Из-за этого карта может выглядеть некорректно, а бронирование затруднится.
Пример наслоения мест друг на друга
- Обновить имеющиеся рабочие места совпадающими по идентификаторам с импортируемыми. Опция позволяет обновить координаты рабочих мест, т.е. их положение на карте. К примеру, в офисе произошла перестановка и стол 3 передвинули дальше от стены. В результате понадобилось слегка изменить карту офиса и сдвинуть место 3 на сантиметр вниз. Если опция обновления рабочих мест включена, то на карте место 3 опустится ниже, а все бронирования этого места сохранятся. Т.е. произойдет не перезапись места, а только изменение его координат.
Оставьте галочку активной, если расположение и вид рабочих мест на новой карте отличается от текущего. Например, в офисе передвинули столы или дизайн/размер самой карты изменились, поэтому рабочие места визуально сдвинулись/поменяли пропорции и внешний вид.
- Тип. Поле для указания типа загружаемых рабочих мест. Стандартно в модуле есть три типа мест: переговорная, место без ПК, место с ПК. При выборе любого из типов он будет установлен сразу для всех рабочих мест на карте. После импорта для каждого рабочего места можно указать свой тип, а также добавить новый. Подробнее о типах рабочих мест написано в отдельной статье.
После выполнения всех настроек нажмите на кнопку «Продолжить». Рабочие места и карта офиса будут обновлены и готовы к бронированию. Дополнительно вы можете настроить рабочие места. Подробнее об этом написано в отдельной статье.
Рекомендации по настройкам
Если вы загружаете карту в пустой кабинет или заменяете одну карту на другую, то по умолчанию мы рекомендуем всегда активировать галочки 1, 2, 3, 5 на слайдере импорта:
При этом, если в скобках у опции 4 указан не ноль, а любое другое число, то рекомендуется включить и эту галочку:
Бывают случаи, когда заменить нужно только PNG-схему кабинета, так как на ней появились новые условные обозначения или иконки. То есть, размеры карты, размещение, количество и ID рабочих мест не изменились и нужно внести только визуальные правки в PNG-подложку. В этом случае на слайдере импорта можно оставить активной только самую первую галочку:
