javascript — Как нам PHP Значения в Направлении Google map API и загрузить карту при загрузке страницы

Я хочу использовать значения PHP для начального и конечного адреса в направлении карты Google вместо выпадающего списка. Мои значения из базы данных.

С кодом ниже карта загружается, но не показывает направления, я думаю, проблема в функции onChangeEvent, которую я не могу изменить на onload, так как в результате карта не загружается;

<div id="floating-panel">
<input type="text" id="start" name="start" value="<?php echo $start;?>" />
<input type="text" id="end" name="end" value="<?php echo $location; ?>" />
</div>
<div id="right-panel"></div>
<div id="map"></div>
<script>
function initMap() {
var directionsDisplay = new google.maps.DirectionsRenderer;
var directionsService = new google.maps.DirectionsService;
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 7,
center: {lat: <?php echo $latitudee; ?>, lng: <?php echo $longitudee; ?>}
});
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById('right-panel'));

var control = document.getElementById('floating-panel');
control.style.display = 'block';
map.controls[google.maps.ControlPosition.TOP_CENTER].push(control);


var onChangeHandler = function() {
calculateAndDisplayRoute(directionsService, directionsDisplay);
};
document.getElementById('start').addEventListener('change', onChangeHandler);
document.getElementById('end').addEventListener('change', onChangeHandler);


}

function calculateAndDisplayRoute(directionsService, directionsDisplay) {
var start = document.getElementById('start').value;
var end = document.getElementById('end').value;;
directionsService.route({
origin: start,
destination: end,
travelMode: 'DRIVING'
}, function(response, status) {
if (status === 'OK') {
directionsDisplay.setDirections(response);
} else {
window.alert('Directions request failed due to ' + status);
}
});
}
</script>

-3

Решение

Вы можете создать два скрытых ввода (текст) с именами «начало» и «конец», а затем заполнить их значениями из вашей базы данных.

0

Другие решения

Других решений пока нет …

По вопросам рекламы ammmcru@yandex.ru
Adblock
detector