Создайте полилинию карт Google из нескольких точек MySQL

Question

У меня есть таблица mysql с серией точек lat/lng, записываемых в файл xml и импортируемых в карты Google в виде точек. Кажется, это работает нормально, но вместо того, чтобы просто пометить их точкой, я хотел бы создать ломаную линию между каждым из них. Просматривая документы для разработчиков, я заметил, что в этом примере выполняется создание нового объекта latlng для каждой линии / набора точек. Есть ли способ, которым я могу динамически вызывать ряд точек, чтобы генерировать несколько строк из моей базы данных? Извините, если это кажется очевидным - я немного новичок в API карт. Заранее спасибо!

Выходной XML-файл, который я использую, выглядит примерно так:

Location name="2012-04-01 12:28:18" lat="42.9523010667" lon="-78.8189444333"/
Location name="2012-04-01 12:28:06" lat="42.95219345" lon="-78.81931905"/
Location name="2012-04-01 12:27:54" lat="42.9522356" lon="-78.8192848667"/..... etc

HTML / Script Вызов XML-координат на карту:

function load() {
  if (GBrowserIsCompatible()) {
    var map = new GMap2(document.getElementById("map"));
    map.addControl(new GSmallMapControl());
    map.addControl(new GMapTypeControl());
    map.setCenter(new GLatLng(42.9521, -78.8198), 20);

    GDownloadUrl("gmaps_genxml2.php", function(data) {
      var xml = GXml.parse(data);
      var markers = xml.documentElement.getElementsByTagName("Location");
      for (var i = 0; i < markers.length; i++) {
        var name = markers[i].getAttribute("timestamp");
        var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                parseFloat(markers[i].getAttribute("lon")));
        var marker = createMarker(point, name);
        map.addOverlay(marker); 
      }
    });

Фрагмент кода, о котором идет речь, на developers.google doc:

var flightPlanCoordinates = [
new google.maps.LatLng(37.772323, -122.214897),
new google.maps.LatLng(21.291982, -157.821856),
new google.maps.LatLng(-18.142599, 178.431),
new google.maps.LatLng(-27.46758, 153.027892)];
  var flightPath = new google.maps.Polyline({
path: flightPlanCoordinates,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2});

  flightPath.setMap(map);}}}

function createMarker(point, name) {
  var marker = new GMarker(point, customIcons[type]);
  var html = "<b>" + name;
  GEvent.addListener(marker, 'click', function() {
    marker.openInfoWindowHtml(html);
  });

  return marker;
}

В настоящее время я не показываю никаких ошибок в консоли. Вот как я пытался реализовать два предыдущих фрагмента кода из исходного поста, но я не получаю карту для отображения каких-либо линий / точек. Может быть, так я определяю точечную переменную / она не хранит массив, а отдельную точку?? Я также попытался использовать [] в определении "точки", но это не сработало / также не показало никаких ошибок...

function load() {
if (GBrowserIsCompatible()) {
// Create an instance of Google map
var map = new GMap2(document.getElementById("map"));
// Tell the map where to start
map.setCenter(new GLatLng(42.9521, -78.8198), 20);

GDownloadUrl("gmaps_genxml2.php", function(data) {
var xml = GXml.parse(data);
var markers = xml.documentElement.getElementsByTagName("Location");
for (var i = 0; i < markers.length; i++) {
var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lon")));
var polyline = new GPolyline(point, '#ff0000', 5, 0.7);
map.addOverlay(polyline);
}
});
}} 

Answer 1

Понял! Здесь я спрашивал об интернете, а сидевший позади меня парень все это время знал...

Я неправильно настраивал массив. Чтобы решить проблему: ---- создайте пустой массив ---- используйте '.push' для вставки в массив

 function load() {

  if (GBrowserIsCompatible()) {
// Create an instance of Google map
var map = new GMap2(document.getElementById("map"));

// Tell the map where to start
map.setCenter(new GLatLng(42.9521, -78.8198), 20);





GDownloadUrl("gmaps_genxml2.php", function(data) {
      var xml = GXml.parse(data);
      var markers = xml.documentElement.getElementsByTagName("Location");
      var points = [];
      for (var i = 0; i < markers.length; i++) {

        points.push(new GLatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lon"))));
      }
      var polyline = new GPolyline(points, '#ff0000', 5, 0.7);
        map.addOverlay(polyline);
    });

}}