Передача переменных PHP в API Карт Google

Когда пользователь подписывается на мое приложение (проект колледжа), им предлагается адрес. Я конвертирую этот адрес в широту и долготу, а затем сохраняю его в своей базе данных.

Я получаю доступ к широте и долготе следующим образом:

<?php require '../connect.php'; session_start(); $_SESSION['username']; $sql = "SELECT latitude, longitude FROM userinformation WHERE username = '". $_SESSION['username']. "'"; $result = $db->query($sql); if($result->num_rows > 0){ while($row = $result->fetch_assoc()){ $lat = $row["latitude"]; $lng = $row["longitude"]; echo $lat; echo $lng; } } ?> 

Затем я пытаюсь передать переменную $ lat и $ lng в скрипт API Карт следующим образом:

 function initMap() { var map = new google.maps.Map(document.getElementById('map'), { zoom: 13, center: {lat: '<?php echo $lat;?>', lng: '<?php echo $lng;?>'} }); marker = new google.maps.Marker({ map: map, draggable: true, animation: google.maps.Animation.DROP, position: {lat: '<?php echo $lat;?>', lng: '<?php echo $lng;?>'} }); marker.addListener('click', toggleBounce); } 

Это дает мне следующую страницу:

Страница PHP

Я также попробовал преобразовать переменные PHP в JS:

 var js_variable = '<?php echo $lat;?>'; document.write(js_variable); var js_variable1 = '<?php echo $lng;?>'; document.write(js_variable1); 

Затем я передаю переменные JS вместо переменных PHP, однако вывод все тот же. Каким будет правильный способ передать переменную как lat / lng вместо жестко заданного значения:

 center: {lat: 59.325, lng: 18.070} position: {lat: 59.327, lng: 18.067} 

Когда я заменяю значения в {lat: '30.365273', lng: '-81.699600'} строками {lat: '30.365273', lng: '-81.699600'} , я получаю ошибку javascript, сообщаемую API: Assertion failed: InvalidValueError: setPosition: not a LatLng or LatLngLiteral: in property lat: not a number .

Если я использую parseFloat для этих строк, он работает:

фрагмент кода:

 function initMap() { var map = new google.maps.Map(document.getElementById('map'), { zoom: 13, center: { lat: parseFloat('30.365273'), lng: parseFloat('-81.699600') } }); marker = new google.maps.Marker({ map: map, draggable: true, animation: google.maps.Animation.DROP, position: { lat: parseFloat('30.365273'), lng: parseFloat('-81.699600') } }); marker.addListener('click', toggleBounce); } google.maps.event.addDomListener(window, "load", initMap); 
 html, body, #map { height: 100%; width: 100%; margin: 0px; padding: 0px } 
 <script src="https://maps.googleapis.com/maps/api/js"></script> <div id="map"></div> 

Я думаю, что PHP-эхо-значение прямо в вашем JavaScript, вероятно, является проблемой. Попробуйте передать lat и lng в качестве параметров вашей функции карты.

 function initMap(myLat, myLng) { var map = new google.maps.Map(document.getElementById('map'), { zoom: 13, center: new google.maps.LatLng(myLat, myLong) }); marker = new google.maps.Marker({ map: map, draggable: true, animation: google.maps.Animation.DROP, position: new google.maps.LatLng(myLat, myLong) }); marker.addListener('click', toggleBounce); } 

Изменить: попробуйте использовать функцию Google Maps для установки широты и долготы, как указано выше.