Как вывести JSON данные?

Question

[Max]

Здравствуйте, скажите пожалуйста каким образом можно вывести данные с Json файла в Google Maps.
Есть файл в JSON в котором допустим 10 остановок. Каждая остановка состоит из 12 координат. Вот пример координат для одной из остановкок.

"coords" : [[[49.25100320801442,28.541126489672024],
[49.25156346163994,28.542151093515713],
[49.25113626882619,28.542376399072964],
[49.25074759018555,28.541657567056973],
[49.25076509829823,28.54119622710641],
[49.25100320801442,28.541126489672024]]]

Вот скрипт с помощью которого я вытягивал другие данные для вывода в таблицу раньше

$(function() {
  	$.getJSON('zones.json', function(data){
  		var template = $('#my_stops').html();
  		var html = Mustache.to_html(template, data);
  		$('#info').html(html)
	});
  });

И вот код карты Google Map где в поля new.google.maps.Latlng я в ручную вставил координаты одной из остановок

function initialize_map( ) {
     var latlng = new google.maps.LatLng(49.25100320801442,28.541126489672024);
     var myOptions = {
     zoom: 18,
     center: latlng,
     mapTypeId: google.maps.MapTypeId.ROADMAP
     };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    var polygonCoords = [
   	  new google.maps.LatLng(49.25156346163994,28.542151093515713),
   	  new google.maps.LatLng(49.25113626882619,28.542376399072964),
   	  new google.maps.LatLng(49.25074759018555,28.541657567056973),
   	  new google.maps.LatLng(49.25076509829823,28.54119622710641),
   	  new google.maps.LatLng(49.25100320801442,28.541126489672024)
   	 ];
   	 var polygon = new google.maps.Polygon({
   	  path: polygonCoords,
   	  strokeColor: "#5196DB",
   	  strokeOpacity: 1,
   	  strokeWeight: 2,
   	  fillColor: "#8ab9e7",
   	  fillOpacity: 0.5
   	 });
   	 polygon.setMap(map);   
   	 return map;
   }

Вопрос такой, каким образом мне занести координаты из файла JSON в позиции
new google.maps.LatLng для остальных 10-ти остановок. При чем в дальнейшем количество остановок должно увеличиваться.

Answer 1

[Александр Ковпашко]

Убрать первую остановку с инициализации карты.
Дальше как-то так:

$(function() {
  $.getJSON('zones.json', function(data){
    var map = initialize_map();
    // проходимся по остановках
    $.each(data.coords, function(index, polyCoords){
      // преобразуем массив с координатами каждой точки в массив из LatLng
      var path = $.map(polyCoords, function(pointCoords){
        return new google.maps.LatLng(pointCoords[0], pointCoords[1]);
      });

      // добавляем полигон
      var polygon = new google.maps.Polygon({
        map: map, // ваша карта
        path: path,
        strokeColor: "#5196DB",
        strokeOpacity: 1,
        strokeWeight: 2,
        fillColor: "#8ab9e7",
        fillOpacity: 0.5
      });
    });
  });
});