โดย Parichat » 19/03/2018 11:23 am
tsukasaz เขียน:ดูโค้ดก็รู้
โค้ด: เลือกทั้งหมด
<script>
function initMap() {
var directionsService = new google.maps.DirectionsService;
var directionsDisplay = new google.maps.DirectionsRenderer;
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 7,
center: {lat: 13.7234186, lng: 100.4762319}
});
directionsDisplay.setMap(map);
var onChangeHandler = function() {
calculateAndDisplayRoute(directionsService, directionsDisplay);
};
document.getElementById('i').addEventListener('change', onChangeHandler);
document.getElementById('e').addEventListener('change', onChangeHandler);
}
function calculateAndDisplayRoute(directionsService, directionsDisplay) {
directionsService.route({
origin: document.getElementById('i').text,
destination: document.getElementById('e').text,
travelMode: 'DRIVING'
}, function(response, status) {
if (status === 'OK') {
directionsDisplay.setDirections(response);
} else {
window.alert('Directions request failed due to ' + status);
}
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAvl1_oma2NgZFoRBeoM6sf_nsZj2gViHo&libraries=places&callback=initMap"
async defer></script>
[quote="tsukasaz"]ดูโค้ดก็รู้[/quote]
[code]<script>
function initMap() {
var directionsService = new google.maps.DirectionsService;
var directionsDisplay = new google.maps.DirectionsRenderer;
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 7,
center: {lat: 13.7234186, lng: 100.4762319}
});
directionsDisplay.setMap(map);
var onChangeHandler = function() {
calculateAndDisplayRoute(directionsService, directionsDisplay);
};
document.getElementById('i').addEventListener('change', onChangeHandler);
document.getElementById('e').addEventListener('change', onChangeHandler);
}
function calculateAndDisplayRoute(directionsService, directionsDisplay) {
directionsService.route({
origin: document.getElementById('i').text,
destination: document.getElementById('e').text,
travelMode: 'DRIVING'
}, function(response, status) {
if (status === 'OK') {
directionsDisplay.setDirections(response);
} else {
window.alert('Directions request failed due to ' + status);
}
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAvl1_oma2NgZFoRBeoM6sf_nsZj2gViHo&libraries=places&callback=initMap"
async defer></script>[/code]