Определение вхождения координат в заданную область на карте OSM. Взаимодействие JavaScript и 1С

04.03.22

Интеграция - WEB-интеграция

Доброго времени суток! Данная обработка является демонстративным решением, позволяющим реализовать проверку вхождения указанной на карте точки в область с заданным радиусом охвата.

Скачать файлы

Наименование Файл Версия Размер
: Определение вхождения координат в заданную область
.epf 11,46Kb
6
.epf 11,46Kb 6 Скачать

Здравствуйте! 

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

Данный способ реализован с помощью карт OpenStreetMap и библиотеки Leaflet. На инфостарте встречаются десятки статей, описывающих взаимодействие данной карты с 1С. Но т.к. подобных тем я не встречал, делюсь с форумчанами.

Итак, для начала необходимо создать текстовый макет "Карта", где будет храниться выполняемы JS код. Код с комментариями привожу ниже:

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<link rel="stylesheet" href="/redirect.php?url=aHR0cHM6Ly91bnBrZy5jb20vbGVhZmxldEAxLjcuMS9kaXN0L2xlYWZsZXQuY3Nz"
		integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="
		crossorigin="" />
	<link rel="stylesheet" href="/redirect.php?url=aHR0cHM6Ly91bnBrZy5jb20vbGVhZmxldC1yb3V0aW5nLW1hY2hpbmVAbGF0ZXN0L2Rpc3QvbGVhZmxldC1yb3V0aW5nLW1hY2hpbmUuY3Nz" />
	<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"
		integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
		crossorigin=""></script>
	<script src="https://unpkg.com/leaflet-routing-machine@latest/dist/leaflet-routing-machine.js"></script>
</head>

<body>
	<div id="map" class="map" style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;"></div>

	<script type="text/javascript">

		//Установка начальных координат (широта и долгота и (13 - это зум))
		var map = L.map('map').setView([53.2030600, 50.1594980], 13); // Координаты г. Самара
		var markers = L.layerGroup().addTo(map);
		var circles = L.layerGroup().addTo(map);
		
		L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
			attribution: '&copy; <a href="/redirect.php?url=aHR0cHM6Ly93d3cub3BlbnN0cmVldG1hcC5vcmcvY29weXJpZ2h0">OpenStreetMap</a> contributors'
		}).addTo(map);

		map.on("click", onClick)
		//map.on("dblclick", onClickduble)

		let lat = 0;
		let lng = 0;
		let title = "";

		//Выбор точки на карте
		function onClick(e = e) {
			lat = e.latlng.lat;
			lng = e.latlng.lng;
			refreshMap();
			newMarker(lat, lng)
		}
        
        //Создает новый слой окружности на карте. Вызывается из 1С. 
		function createRadius(latitude, longitude, rad) {
			circles.clearLayers();
			let circle = new L.circle([latitude, longitude], {radius: rad});/**/
			circle.addTo(circles);
			SetViewOffice(latitude, longitude)
		} 
		
        //Отрисовка нового маркера при нажатии на карту 
		function newMarker(latitude, longitude, title) {
			lat = latitude;
			lng = longitude;
			refreshMap()
			SetViewOffice(lat, lng)
			let marker = new L.Marker([lat, lng]);/**/
			marker.bindPopup(title).openPopup();
			marker.addTo(markers);
		}

        //Функция вызывается из 1С. Возвращает координаты установленного маркера
		function returnLatLng() {
			coordinate = {
				lat,
				lng,
				title
			}

			jsonString = JSON.stringify(coordinate)
			return jsonString;
		}

		//function onClickduble(e) {
		//}

		//Очищаем карту
		function refreshMap() {
			markers.clearLayers();
		}

		//Установка отображение на текущем адресе
		function SetViewOffice(latitude, longitude) {
			map.setView([latitude, longitude], 15);
		}
	</script>
</body>
</html>
 
 Небольшое пояснение:::

 

 
 Далее, необходимо создать реквизиты формы:

 

Затем в процедуре ПриСозданииНаСервере необходимо присвоить код html, описанный выше, переменной Карта. В данной обработке, я также заполняю ТЗ "Адреса" тестовыми данными и сразу формирую список выбора для переменной "Адрес". 

&НаСервере
Процедура ПриСозданииНаСервере(Отказ, СтандартнаяОбработка)
	МакетКарта = РеквизитФормыВЗначение("Объект").ПолучитьМакет("Карта");
	Карта = МакетКарта.ПолучитьТекст();
	
	///// Заполнение ТЗ "Адреса" тестовыми данными
	СтрокаТЗ = Адреса.Добавить();
	СтрокаТЗ.Адрес = "Самарская область, г. Самара";
	СтрокаТЗ.Широта = 53.203060;
	СтрокаТЗ.Долгота = 50.159498;
	
	СтрокаТЗ = Адреса.Добавить();
	СтрокаТЗ.Адрес = "Свердловская область, г. Екатеринбург";
	СтрокаТЗ.Широта = 56.835095;
	СтрокаТЗ.Долгота = 60.613329;
	
	СтрокаТЗ = Адреса.Добавить();
	СтрокаТЗ.Адрес = "Челябинская область, г. Челябинск";
	СтрокаТЗ.Широта = 55.165798;
	СтрокаТЗ.Долгота = 61.434271;
	
	///// Заполнение списка выбора реквизита Адрес
	ЗаполнитьСписокВыбораАдресов();
	
КонецПроцедуры

Процедура ЗаполнитьСписокВыбораАдресов()
	Для каждого Стр Из Адреса Цикл
		Элементы.Адрес.СписокВыбора.Добавить(Стр.Адрес);	
	КонецЦикла;
КонецПроцедуры 

 

Следующим пунктом, необходимо добавить событие "ПриНажатии" реквизита Карта. Туда мы пропишем следующий код:

&НаКлиенте
Процедура КартаПриНажатии(Элемент, ДанныеСобытия, СтандартнаяОбработка)
	Попытка
		ДокументПервогоБраузера = Элементы.Карта.Документ;
		
		ОкноПервогоБраузера = ДокументПервогоБраузера.defaultView; 	
		КоординатыСозданногоМаркера = ОкноПервогоБраузера.returnLatLng();
		СтруктураКоординатВыбраннойТочки = ПрочитатьJSONВСтруктуру(КоординатыСозданногоМаркера);
		
		Широта1 = СтруктураКоординатВыбраннойТочки.lat;
		Долгота1 = СтруктураКоординатВыбраннойТочки.lng;
	Исключение
		Сообщить("Карта еще не сформирована");	
	КонецПопытки;
КонецПроцедуры

Здесь как раз таки и пригодится "костыль", описанный выше. В момент нажатия переменным lat & lng уже присвоены значения, и при обращении к функции  returnLatLng() мы получаем JSON со значением координат только что созданного маркера. 

 
 ПрочитатьJSONВСтруктуру(JSON)

 

Теперь, когда координаты маркера получены и записаны в реквизиты формы, необходимо отрисовать область, относительно которой и будет происходить проверка вхождения созданного маркера. Для этого при нажатии на команду "ОтрисоватьНаКарте" мы будем вызывать функцию createRadius(Широта, Долгота, РадиусОхвата).

&НаКлиенте
Процедура ОтрисоватьНаКарте(Команда)
	Если Не ЗначениеЗаполнено(Адрес) Тогда
		ВызватьИсключение "Адрес не заполнен";	
	КонецЕсли;
	
	Попытка
		ДокументПервогоБраузера = Элементы.Карта.Документ;
		ОкноПервогоБраузера = ДокументПервогоБраузера.defaultView; 	
		ОкноПервогоБраузера.createRadius(Широта, Долгота, РадиусОхвата);
	Исключение
		Сообщить("Карта еще не сформирована");	
	КонецПопытки;
	
КонецПроцедуры

По итогу, при нажатии на карту, у вас должен создавать маркер, а при нажатии на команду "Отрисовать на карте" должна появляться выделенная область с заданным радиусом, где центром окружности является выбранный адрес.

 

Ну и наконец, самое важное в рамках данной статьи. Это определение вхождение маркера в заданную область.

Для этого я использовал формулу гаверсинуса (определяет расстояние по дуге между двумя точками на сфера с учетом их долготы и широты). Расчет в радианах. Расстояние в метрах. 

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

&НаКлиенте
Процедура ОпределитьВхождение(Команда)
	Радиана = 57.29577951308;
	ШиротаРад = Широта / Радиана;
	Широта1Рад = Широта1 / Радиана;
	ДолготаРад = Долгота / Радиана;
	Долгота1Рад = Долгота1 / Радиана;
	
	R = 6371;  // Радиус планеты
	sin1 = sin((ШиротаРад - Широта1Рад) / 2);
	sin2 = sin((ДолготаРад - Долгота1Рад) / 2);
	
	РасстояниеМаркераОтОкружностиКм = 2 * R * asin(sqrt(sin1*sin1+sin2*sin2*cos(ШиротаРад)*cos(Широта1Рад)));
	РасстояниеМаркераОтОкружностиМ = РасстояниеМаркераОтОкружностиКм * 1000;
	
	Если РасстояниеМаркераОтОкружностиМ <= РадиусОхвата Тогда
		РезультатВхождения = "Есть вхождение";
	Иначе
		РезультатВхождения = "Нет вхождений";	
	КонецЕсли;
	
	ОчиститьСообщения();
	Сообщить(РезультатВхождения);
КонецПроцедуры

 Пример работы:

 
 Важное пояснение 

 

P.S. Это моя первая публикация на Инфостарт. Прошу не судить строго) 

Готовую обработку прикладываю (платформа 8.3.14)! Всем добра! 

Координаты OpenStreetmap JavaScript Обработка Транспорт Маршрут

См. также

Интеграция с сервисом vetmanager

WEB-интеграция Платформа 1С v8.3 Бухгалтерский учет 1С:Бухгалтерия 3.0 Бытовые услуги, сервис Платные (руб)

Данная обработка разрабатывалась для загрузки документов из Ветменеджер в 1С: Бухгалтерия 3.

6000 руб.

02.02.2021    15134    42    49    

21

Заполнение по ИНН или наименованию реквизитов контрагента по данным сайта ФНС

Обмен с ГосИС WEB-интеграция Платформа 1С v8.3 Управляемые формы 1С:Комплексная автоматизация 1.х 1С:Бухгалтерия 2.0 1С:Управление торговлей 10 1С:Управление производственным предприятием 1С:Управление нашей фирмой 1.6 1С:Бухгалтерия государственного учреждения 1С:Документооборот 1С:ERP Управление предприятием 2 1С:Бухгалтерия 3.0 1С:Управление торговлей 11 1С:Комплексная автоматизация 2.х Платные (руб)

Обработка является альтернативой механизму, разработанному фирмой 1С и заполняющему реквизиты контрагента по ИНН или наименованию. Не требуется действующей подписки ИТС. Вызывается как внешняя дополнительная обработка, т.е. используется, непосредственно, из карточки контрагента. Заполнение по ИНН или наименованию реквизитов контрагента по данным сайта ФНС (egrul.nalog.ru) для БП 2.0, БП 3.0, БГУ 1.0, БГУ 2.0, УТ 10.3, УТ 11.x, КА 1.1, КА 2.x, УПП 1.x, ERP 2.x, УНФ 1.5, УНФ 1.6, УНФ 3.0, ДО 2.1

2400 руб.

28.04.2016    86487    153    211    

308

Merlion Commander Версия 1.3.9.2 - июль 2022 г. (Интеграция с 1С: УT, редакция 11.4, 1С:Розница 2.3,1С:ERP Управление предприятием 2, УТ 10.3, редакция веб-сервиса MERLION API 3.0 от 18.08.2021)

Оптовая торговля Розничная торговля WEB-интеграция Платформа 1С v8.3 1С:Управление торговлей 11 Россия Платные (руб)

Расширении конфигурации "Управление торговлей, редакция 11" для работы с веб-сервисом Мерлион с помощью Merlion API. Расширение и набор подключаемых дополнительных обработок позволяет без изменения конфигурации получить возможность работы с API крупнейшего российского дистрибьютора http://merlion.com. Логика работы максимально приближена к работе веб-сервиса b2b. Вы сможете создать и исправить заказ, зарезервировать товар прямо из 1С, посмотреть актуальные остатки и цены, импортировать штрихкода EAN13 товаров, загружать заказ c автоматическим созданием номенклатуры в 1С и корректности создания. Можно выбирать характеристики по товарным группам и загружать товар с выбранными характеристиками, загружать изображения товара. Не требуется установки дополнительного ПО для работы с веб-сервисом. Кроссплатформенное решение для ОС Windows и Linux. Весь код модулей открыт и доступен для просмотра и внесения изменений.

8280 руб.

02.05.2017    38136    42    64    

49

Sync1C: Синхронизация 1С и OpenCart

WEB-интеграция Оптовая торговля Розничная торговля Платформа 1С v8.3 Оперативный учет 1С:Управление торговлей 11 Управленческий учет Платные (руб)

Внешняя обработка для обмена данными с интернет-магазином OpenCart. Позволяет быстро наполнить магазин товарами, затем обновлять цены и добавлять новые товары. Далее можно средствами OpenCart настраивать и дополнять карточки товаров как надо для магазина, при этом связь товаров с 1С не теряется.

3840 руб.

30.03.2018    42622    80    137    

84
Комментарии
В избранное Подписаться на ответы Сортировка: Древо развёрнутое
Свернуть все
1. Woody56RF 14 04.03.22 11:38 Сейчас в теме
Готовая обработка!
Прикрепленные файлы:
Определение вхождения координат в заданную область.epf
HansGlorias; serverstar; vipchep; akR00b; Viska; MSK_Step; +6 Ответить
2. akR00b 22 28.04.22 09:59 Сейчас в теме
Спасибо!
3. PLAstic 294 27.07.22 10:43 Сейчас в теме
Обомлей: напиши в Ctrl-F1 "ПрочитатьJSON".

Глобальный контекст (Global context)
ПрочитатьJSON (ReadJSON)
Синтаксис:
ПрочитатьJSON(<ЧтениеJSON>, <ПрочитатьВСоответствие>, <ИменаСвойствСоЗначениямиДата>, <ОжидаемыйФорматДаты>, <ИмяФункцииВосстановления>, <МодульФункцииВосстановления>, <ДополнительныеПараметрыФункцииВосстановления>, <ИменаСвойствДляОбработкиВосстановления>, <МаксимальнаяВложенность>)

И выкинь свою функцию ПрочитатьJSONВСтруктуру().
Более того, внимательно изучи синтаксис - тут есть очень интересные особенности.

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