Создание нескольких маркеров в Google Maps с использованием XML - PullRequest
Новая
       9

Создание нескольких маркеров в Google Maps с использованием XML

0 голосов
/ 30 ноября 2011

Я почти уверен, что этот вопрос задавался раньше, но ради любви ко мне, я просто не могу найти ответ нигде.По сути, я хочу создать несколько маркеров на созданной мной карте Google.У меня уже есть XML-файл с координатами (широта / долгота) и заголовком каждого элемента.Я хотел бы взять данные из файла XML и использовать их для создания маркеров на карте.Я нашел, как это сделать, используя файлы KML и MySQL / PHP, но мне нужно знать, как это сделать в Javascript.

Еще одна вещь: у меня есть собственный файл .xml, так чтоЯ не буду получать данные с веб-страницы, потому что я верю (из проведенного сегодня исследования), что код для этого может отличаться.

Если кто-нибудь знает, опубликовано ли этогде-то еще, не могли бы вы направить меня туда?Я буквально искал весь день, это мое последнее средство.Огромное спасибо !!!

Ответы [ 2 ]

3 голосов
/ 30 ноября 2011

Если вы ищете способ для анализа XML-текста в JavaScript, то посмотрите здесь: Разбор XML переменной строки в JavaScript Информация о загрузке XML-файла из JavaScript здесь: Загрузка XML из JavaScript

Создание маркеров из пользовательского xml тогда довольно просто. Я добавил короткий пример. Он показывает, как анализировать текст XML или загружать файл XML, а затем создавать маркеры из данных.

Некоторые пользовательские XML-текст: 

var myXmlText = '<?xml version="1.0" encoding="ISO-8859-1"?>' +
      '<coords>' +
         '<item><position lat="50.1" lng="14.5"/><title>Praha</title></item>' +
         '<item><position lat="51.5" lng="0"/><title>London</title></item>' +
         '<item><position lat="48.8" lng="2.4"/><title>Paris</title></item>' +
         '<item><position lat="52.5" lng="13.4"/><title>Berlin</title></item>' +
         '<item><position lat="48.2" lng="16.4"/><title>Wien</title></item>' +
      '</coords>';

Разбор текста xml в объект DOM xml: 

function parseXml(xmlText) {
   var xmlDoc;
   if (window.DOMParser) {
      parser=new DOMParser();
      xmlDoc=parser.parseFromString(xmlText,"text/xml");
   } else { // Internet Explorer
      xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
      xmlDoc.async="false";
      xmlDoc.loadXML(xmlText); 
   }
   return xmlDoc;
}

Загрузка и анализ файла xml в объект DOM xml: 

function loadXml(xmlUrl) {
   if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
   } else {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
   xmlhttp.open("GET",xmlUrl,false);
   xmlhttp.send();
   xmlDoc=xmlhttp.responseXML;
   return xmlDoc;
}

Создание маркеров из данных в объекте xml DOM: 

function createMarkers(xmlDoc) {
   var items = xmlDoc.getElementsByTagName('item');
   for(var i=0; i<items.length; i++) {
      var positionEl = items[i].getElementsByTagName('position')[0];
      var latlng = new google.maps.LatLng(positionEl.getAttribute('lat'), positionEl.getAttribute('lng'));
      var titleNode = items[i].getElementsByTagName('title')[0].childNodes[0];
      var marker = new google.maps.Marker({
          position: latlng,
          map: map,
          title: titleNode.nodeValue
      });
    }
}

Чтобы создать маркеры из XML-файла, все, что вам нужно сделать, это: 

var xmlDoc = loadXml("my_items.xml");
createMarkers(xmlDoc);

Чтобы создать маркеры из текста xml, используйте: 

var xmlDoc = parseXml(myXmlText);
createMarkers(xmlDoc);
0 голосов
/ 02 августа 2014

Для решения проблемы я добавил следующий код в функцию createMarkers: 

var myOptions = {
    zoom: 6 ,
    center: latlng ,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map"), myOptions);
...