Техническое задание: Интерактивная карта статусов на Tilda

Цель проекта

Интеграция на сайт, построенный на конструкторе Tilda, интерактивной карты (генерального плана) объекта недвижимости или коммерческого помещения. Карта должна наглядно отображать текущий статус каждого помещения с помощью цветовой схемы.

Основные требования

• Платформа: Сайт на платформе Tilda.
• Элемент: Генеральный план объекта (изображение-схема).
• Интерактивность: Помещения на плане должны быть кликабельными или иметь интерактивные метки.

Цветовая индикация статусов

• Продан: Отображение серым цветом.
• Бронь: Отображение желтым цветом.
• Свободен: Отображение зеленым цветом.

Техническая реализация

• Необходимо создать или адаптировать код (вероятно, HTML/CSS/JS) для работы внутри блока "Добавить свой HTML" в Tilda.
• Код должен обеспечивать корректное отображение цветных зон на изображении плана в соответствии с заданными статусами.
• Требуется точно выставить координаты (например, через position: absolute, SVG-карту или координаты на canvas) для каждого помещения на исходном изображении плана.
• Решение должно быть кроссбраузерным и адаптироваться под мобильные устройства.

Результат работы

Готовая, рабочая интерактивная карта, встроенная в страницу сайта на Tilda, где статусы помещений визуально различимы по указанной цветовой палитре.