Google сопоставляет маркеры с javascript и PHP

Я создаю приложение, в котором есть база данных имен людей, информация о них и их текущее местоположение. Мне удалось создать карты с использованием API-интерфейсов Google maps javascript и отметить ваше текущее местоположение. однако я не могу, возможно, использовать цикл PHP для размещения маркера с информационным окном для каждого человека в моей базе данных. Вот мой код:

lat = position.coords.latitude; lon = position.coords.longitude; //init map myOptions = { center: new google.maps.LatLng(lat, lon), zoom: 15, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var image = 'http://img.ruphp.com/javascript/v48d1w.png'; var loca = new google.maps.LatLng(lat, lon); var currnetLocationMarker = new google.maps.Marker({ position: loca, map: map, animation: google.maps.Animation.DROP, icon: image }); var contentString; var marklatlng; <?php require("connect.php"); $query = mysql_query("SELECT * FROM gigs"); $i = 0; while($data = mysql_fetch_array($query)) { echo " contentString = 'Name: <b>" . $data['name'] . "</b><br> Info: <b>" . $data['desc'] . " </b>'; var infowindow" . $i . " = new google.maps.InfoWindow({ content: contentString }); marklatlng = new google.maps.LatLng(" . $data['lat'] . ", " . $data['lng'] . "); var marker" . $i . " = new google.maps.Marker({ position: markLatlng, map: map, }); google.maps.event.addListener(marker" . $i . ", 'click', function() { infowindow" . $i . ".open(map,marker" . $i . "); }); "; $i++; } ?> 

Было бы лучше json_encode ваши данные, передать это переменной в javascript, а затем перебрать ее с помощью javascript. Еще лучше использовать запросы AJAX для извлечения данных.

 <?php function fetchGigs() { $gigs = new Array(); $query = mysql_query("SELECT * FROM gigs"); while($gig = mysql_fetch_array($query)) { $gigs[] = $gig; } return $gigs; } 

И в вашем javascript:

 <script> // your other code... var gigs = <?php echo json_encode(fetchGigs()); ?> var createMarkerAt = function(lat, lng) { var latLng, marker; latLng = new google.maps.LatLng(lat, lng); marker = new google.maps.Marker({ position: latLng, map: map, }); return marker; } var createMarkerForGig = function (gig) { var marker, info; marker = createMarkerAt(gig.lat, gig.lng); info = new google.maps.InfoWindow({ content: 'Name: <b>"' + gig.name + '"</b><br>Info: <b>"' + gig.desc + '"</b>' }); google.maps.event.addListener(marker, 'click', function() { info.open(map, marker); }); return marker; } // Add markers for all the gigs. var len = gigs.length; for (var i = 0; i<len; i++) { createMarkerForGig(gigs[i]); } </script> 

Документация для php_encode()

Когда я написал подобное приложение, я использовал php, чтобы написать строку массива javascript, представляющую мои данные, а затем использовать прямые js, как только я добрался до строковых строк для api. Однако, поскольку я обнаружил, как легко написать API с интерфейсом PHP, чтобы возвращать объекты JSON моей базы данных, я просто использую jQuery для запроса моего API-интерфейса для json-данных, а затем с этим работаю. С SLIM это невероятно просто. Вот ссылка http://codingthis.com/programming/php/using-the-slim-php-framework-for-developing-rest-apis/