HelpF.pro

Как в 1С проложить маршрут используя GoogleMaps API V3

Клиенты частенько просят настроить отображение маршрутов перемещения по разным адресам в 1С, например для курьеров и т.д.

В примере описан способ отражения карт GoogleMaps в 1С:

Код 1C v 8.2 УП
 Для Каждого Стр Из НаВходе Цикл

		нСтр = ПроверкаСовпадений.Добавить();

		нСтр.Адрес = Стр.Адрес;

		нСтр.Контрагент = Стр.Контрагент;

		//Если адрес начальный или конечный - пропускаем

		Если Стр.НомерСтроки = 1 или Стр.НомерСтроки = НаВходе.Количество() Тогда

			Продолжить;

		КонецЕсли;

		опАдреса = опАдреса + "

		|waypts.push({location:'" + нСтр.Адрес + "',stopover:true});";

	КонецЦикла;

	//Подставляем параметры в макет "Карта"

	опМаршрут = ПолучитьМакет("Карта").ПолучитьТекст();

	опМаршрут = СтрЗаменить(опМаршрут,"[=-опАдреса-=]",опАдреса);

	опМаршрут = СтрЗаменить(опМаршрут,"[=-опНач-=]",опНач);

	опМаршрут = СтрЗаменить(опМаршрут,"[=-опКон-=]",опКон);

	ЭлементыФормы.Карта.УстановитьТекст(опМаршрут);

Скрипт отображения из макета Карта (выделила как VBS, но по факту это HTML):

Код VBS 
 <HTML><HEAD>

<META content="text/html; charset=utf-8" http-equiv=Content-Type></META>

<META name=viewport content="initial-scale=1.0, user-scalable=no"></META>

<STYLE type=text/css>HTML {

	HEIGHT: 100%

}

BODY {

	HEIGHT: 100%; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; PADDING-LEFT: 0px; MARGIN: 0px; PADDING-RIGHT: 0px

}

#map_canvas {

	HEIGHT: 100%

}

</STYLE>





<SCRIPT type=text/javascript src="http://maps.google.com/maps/api/js?sensor=false">

</SCRIPT>





<SCRIPT type=text/javascript>

var directionDisplay;

var directionsService = new google.maps.DirectionsService();

var map;





function initialize() {

 

  directionsDisplay = new google.maps.DirectionsRenderer();

  var chicago = new google.maps.LatLng(55.81234, 37.664425);

  var myOptions = {

    zoom: 6,

    mapTypeId: google.maps.MapTypeId.ROADMAP,

    center: chicago

  }

  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

 

 

   directionsDisplay.setMap(map);

   calcRoute();

  	var trafficLayer = new google.maps.TrafficLayer();

trafficLayer.setMap(map);

}

  

function calcRoute() {

  var start = "[=-опНач-=]";

  var end = "[=-опКон-=]";

  var waypts = [];

  var checkboxArray = document.getElementById("waypoints");

  [=-опАдреса-=]

  var request = {

      origin: start, 

      destination: end,

      waypoints: waypts,

      optimizeWaypoints: true,

      travelMode: google.maps.DirectionsTravelMode.DRIVING

  };

  directionsService.route(request, function(response, status) {

    if (status == google.maps.DirectionsStatus.OK) {

      directionsDisplay.setDirections(response);

      var route = response.routes[0];

      var summaryPanel = document.getElementById("directions_panel");

      summaryPanel.innerHTML = "";

      // For each route, display summary information.

      

      for (var i = 0; i < route.legs.length; i++) {

        var routeSegment = i+1;

        summaryPanel.innerHTML += 'опЗаполнитьМаршрут("' + String.fromCharCode(routeSegment+65) + '","' + String.fromCharCode(route.legs.length+65) + '","' + route.legs[i].start_address + '","' + route.legs[i].end_address + '","' + route.legs[i].distance.text + '");';

      }

      

    }

  });

}



</SCRIPT>



<META name=GENERATOR content="MSHTML 11.00.9600.17239"></META><BASE href="v8config://c924c032-2565-45e2-b49f-9a30494bc69f/mdobject/ida329e781-b8d1-431e-9e2f-8321c1a691fc/8eb4fad1-1fa6-403e-970f-2c12dbb43e23"></BASE></HEAD>

<BODY onload=initialize()>

<DIV id=map_canvas style="HEIGHT: 100%; WIDTH: 100%"></DIV>

<DIV id=directions_panel style="MARGIN: 20px; DISPLAY: none; BACKGROUND-COLOR: #ffee77"></DIV></BODY></HTML>

Файл отображающий пример работы GoogleMaps API V3 - Прокладываем маршрут в 1С

Скрин это обработки

Опубликовано на сайте: https://HelpF.pro
Прямая ссылка: https://HelpF.pro/faq82/view/1592.html