Перейти к основному контенту

Изображение с метками

Блок «Изображение с метками» это интерактивный блок, позволяющий расставить метки на изображении. Его можно использовать, чтобы показать, как выглядят те или иные объекты.

Как выглядит блок?

imgspot0-look.gif

Как добавить блок?

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

Как выглядит блок в меню

 map0-menu.jpg

Добавление блока

imgspot2-new.gif

Чтобы увеличить демонстрацию, нажмите на нее.

Как изменить содержимое?

В блоке «Изображение с метками» можно добавить:

  • изображение
  • метки
  • подписи к меткам

Вы можете использовать изображения в формате JPG, PNG, GIF, WEBP и SVG.

Добавление картинки

Чтобы добавить своё изображение, нажмите на черную полосу над картинкой и выберите нужный файл в проводнике.

imgspot3-fill.gif

Чтобы увеличить демонстрацию, нажмите на нее.

Добавление меток

Чтобы добавить метки на изображение, достаточно просто нажать на него в любом месте.

imgspot4-spots.gif

Чтобы увеличить демонстрацию, нажмите на нее.

Добавление подписи

Чтобы добавить подпись к метке, нажмите на метку. Откроется окошко, где вы сможете ввести свой текст. Нажмите на метку ещё раз, чтобы закрыть окошко.

imgspot5-label.gif

Чтобы увеличить демонстрацию, нажмите на нее.

Удаление метки

Чтобы удалить метку, нажмите на неё, откроется окошко для текста. Справа от текста вы увидите значок «Корзина». Нажмите на него, чтобы удалить эту метку.

imgspot6-deletespot.gif

Чтобы увеличить демонстрацию, нажмите на нее.

Как изменить внешний вид?

Вы можете настроить внешний вид меток. Можно выбрать:

  • цвет метки
  • иконку
  • цвет иконки

Также в этом блоке вы можете ввести свой текст для подсказки к блоку.

Настройка меток
Цвет метки

Вы можете выбрать цвет для метки из палитры. Откройте выпадающее меню палитры: там вам будут доступны цвета из базовой палитры и те цвета, которые вы добавили самостоятельно.

Добавить свои цвета в палитру можно в настройках курса. Подробнее о своих цветах.

Также вы можете задать свой собственный цвет с помощью HEX-кода.

Обратите внимание, что при вставке HEX-кода нельзя удалять символ решетки. Иначе цвет не будет работать.

imgspot7-color.gif

Чтобы увеличить демонстрацию, нажмите на нее.

Иконка

Вы можете выбрать иконку из встроенной базы иконок. И выбрать её цвет, а также задать свой собственный цвет с помощью HEX-кода.

imgspot8-icon.gif

Чтобы увеличить демонстрацию, нажмите на нее.

Как я могу использовать этот блок?

Этот блок хорошо подходит:

  • Для различных карт, схем, планов. Можно добавить схему и отметить на ней нужные объекты, одновременно показывая, как они выглядят и давая дополнительную информацию.

Если у вас остались вопросы, напишите нам на почту info@scroll-tool.ru.