Как передать ID метки из Яндекс.Карт в 1С при клике на объект?

Программист 1С v8.3 (Управляемые формы) IT и автоматизация бизнеса
← На главную

При разработке интерфейсов на базе Поле HTML-документа в среде 1С:Предприятие часто возникает необходимость связать интерактивные элементы, например, метки на карте, с данными в информационной базе. Однако стандартный механизм событий 1С зачастую не может «увидеть» внутренние атрибуты объектов, созданных внутри JavaScript-контекста Яндекс.Карт. Давайте разберем, почему это происходит и как эффективно решить данную задачу.

Суть проблемы взаимодействия 1С и JavaScript

Когда мы размещаем Яндекс.Карту внутри формы 1С, она отображается через встроенный браузерный движок. События click, которые мы вешаем на объекты карты (Placemark), существуют исключительно внутри изолированного контекста JavaScript. При попытке перехватить нажатие через стандартное событие формы 1С ПриНажатии, мы получаем информацию о событии в DOM-дереве страницы, но доступ к пользовательским свойствам меток (таким как iden) оказывается закрыт. Стандартные свойства события в 1С не содержат привязки к логическим данным, которые мы задали при инициализации карты.

Решение: использование пользовательских событий (Custom Events)

Чтобы «выбросить» данные из JavaScript наружу, в контекст 1С, мы можем воспользоваться механизмом диспетчеризации событий. Суть метода заключается в том, что при клике на метку мы создаем объект события MouseEvents, принудительно внедряем в него наши данные и отправляем это событие на уровень document. В результате 1С сможет «услышать» это событие и считать переданный идентификатор.

Рассмотрим пошагово реализацию этого подхода.

Шаг 1: Подготовка кода JavaScript

При инициализации меток нам необходимо добавить обработчик click. Внутри этого обработчика мы будем создавать событие и передавать в него нужный нам id. Обратите внимание на то, как мы добавляем свойство data к объекту события:


// Пример добавления обработчика для метки
myPlacemark1.events.add('click', function(e) {
    var evt = document.createEvent('MouseEvents');
    evt.initEvent('click', true, false);
    // Передаем свойство iden, которое мы задали в свойствах метки
    evt.data = myPlacemark1.properties.get('iden'); 
    document.dispatchEvent(evt);
});

В данном примере мы используем метод createEvent для инициализации события. Свойство evt.data становится контейнером для передачи идентификатора из JavaScript в 1С. Важно, чтобы этот код исполнялся в той же области видимости, где загружена карта.

Шаг 2: Обработка события в 1С

Теперь, когда JavaScript «кричит» о клике и передает данные, нам нужно правильно поймать этот сигнал в 1С. Для этого используется обработчик события ПриНажатии элемента формы Поле HTML-документа. Код будет выглядеть следующим образом:


&НаКлиенте
Процедура дор_ЯндексКартаПриНажатииПосле(Элемент, ДанныеСобытия, СтандартнаяОбработка)
    
    // Проверяем наличие наших кастомных данных в событии
    Если ДанныеСобытия <> Неопределено 
        И ДанныеСобытия.Event <> Неопределено 
        И ЗначениеЗаполнено(ДанныеСобытия.Event.data) Тогда
        
        КодПункта = ДанныеСобытия.Event.data; 
        // Здесь мы можем выполнить любую логику, например, найти объект в базе
        Сообщить("Выбран пункт: " + КодПункта);
        
    КонецЕсли;
    
КонецПроцедуры

Альтернативные методы интеграции

Хотя предложенное выше решение отлично работает, стоит помнить и о других способах связи 1С с браузерными компонентами:

  1. Использование объекта window.external: Если вы используете классические формы или работаете через старые движки, этот объект позволяет напрямую вызывать процедуры 1С из JavaScript. Например, window.external.ОбработатьКлик(id). Это считается более «чистым» способом, так как не требует эмуляции событий DOM.
  2. Использование WebView2: Если ваша версия платформы 1С поддерживает современный движок WebView2, вы получаете доступ к мощному API взаимодействия, которое позволяет передавать данные между JS и 1С асинхронно, с поддержкой сложных JSON-структур.

Заключение: Метод с document.dispatchEvent является универсальным и проверенным способом решения задачи. Он позволяет надежно связать визуальные элементы карты с логикой 1С, обеспечивая бесшовную работу пользователя. Мы рекомендуем начинать именно с него, если ваша текущая инфраструктура не подразумевает использование более современных средств, таких как WebView2.

← На главную