Почему у меня нет маркера в Google map API

Question

Я новичок в HTML и JavaScript. Я прочитал текстовый файл, который содержит долготу и широту. Я прочитал этот текстовый файл и сохранил его в 3 массивах. Один содержит долготу, одну широту и один содержит идентификатор. Текстовый файл, как это: (вы можете сохранить его для отладки цели с моим кодом ниже)

ID LONGITUDE LATITUDE 
0 77.139305 28.795975 
2 77.308929 28.486877 
4 73.820680 18.464110 
6 75.588783 26.599820 
12 77.193575 28.559693 

Я прочитал его и хранить столбец 1, 2 и в col1, col2, COL3 соответственно.

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

Что я имею в виду, это запустить этот цикл for в моем коде, и он должен отобразить все маркеры на данной карте. (Да, это правда, что я сохранил все Long и Lat и Id, которые я могу видеть при отладке).

Мой код:

   for (var i = 0; i <= array.length - 1; i++) 
       { 
        col1[j] = array[i]; 
        col2[j] = array[i + 1]; 
        col3[j] = array[i + 2]; 
        var myLatlng = new google.maps.LatLng(col3[j], col2[j]); 
        var mapOptions = 
         { 
          zoom: 4, 
          center: myLatlng 
         } 
        var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

        var marker = new google.maps.Marker({ 
         position: myLatlng, 
         map: map, 
         title: 'Hello World!' 
        }); 
        j++; 
       }; 

Answer 1

Вы должны создать массив маркеров

var markers[]; 

Затем в цикле вы должны создать перебрать Lat/длинные позиции, после того, как будет создан маркер положить его в массив:

markers.push(marker); 

в этом случае вы можете сохранить маркеры активной ...

Answer 2

Вы создаете новую карту для каждого маркера, поэтому ваш вывод содержит только последнюю карту с последним маркером. Попробуйте переместить этот код:

var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

перед циклом

кстати в вашем for цикла вы должны увеличивать свой итератор на 3

Answer 3

Есть несколько вещей неправильно с вашим кодом ...

• Карта заявлена ​​внутри цикла
• Ваш сплит работает неправильно
• Инкременты на массивах не шаг достаточно i
• Широта и Долгота годы были назад в определении маркера

Я сделал следующие изменения и иметь скрипку для вас, чтобы посмотреть на так что вы можете объединить код ... http://jsfiddle.net/b4fz30vc/

function initialize() { 
    var data = 
     "ID LONGITUDE LATITUDE\r\n" + 
     "0 77.139305 28.795975\r\n" + 
     "2 77.308929 28.486877\r\n" + 
     "4 73.820680 18.464110\r\n" + 
     "6 75.588783 26.599820\r\n" + 
     "12 77.193575 28.559693\r\n"; 

    var s2 = data.replace(/^.*$/, "").replace(/\r\n/g, " "); 
    var array = s2.split(/[ ]+/g); 
    var col1 = []; 
    var col2 = []; 
    var col3 = []; 
    var j = 0; 

    var mapOptions = { 
     zoom: 2, 
     center: new google.maps.LatLng(73, 23) 
    } 
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

    for (var i = 0; i <= array.length - 1; i++) { 
     col1[j] = array[i]; 
     col2[j] = array[i++]; 
     col3[j] = array[i++]; 

     var myLatlng = new google.maps.LatLng(col3[j], col2[j]); 

     var marker = new google.maps.Marker({ 
      position: myLatlng, 
      map: map, 
      title: 'Hello World! ' + col1[j] 
     }); 
     j++; 
    } 
} 

initialize(); 

EDIT:

T o комментарий в строке var s2 = data.replace(/^.*$/, "").replace(/\r\n/g, " "); .. с первой заменой я удаляю строку заголовка, а второй удаляет новые строки.