404

D7net
:/ var / www / html / crsys_ant /
Filename : distancia_digitada.php
back
<script
  src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAFXNZ0Qh_YP1s05oEtusz_SpkLBh5iaqY&libraries=places"
  defer>
</script>

<input type="text" id="origem" placeholder="Origem (rua, número, cidade)" value="Avenida Nações Unidas, 183, Osasco,SP"style="width: 300px">
<br><br>
<input type="text" id="destino" placeholder="Destino (rua, número, cidade)" style="width: 300px">
<br><br>
<br><br>
<button onclick="calcularDistancia()">Calcular distância</button>

<p id="resultado"></p>
<script>
function calcularDistancia() {
    const origem  = document.getElementById('origem').value;
    const destino = document.getElementById('destino').value;

    if (!origem || !destino) {
        document.getElementById('resultado').innerText =
            'Informe origem e destino';
        return;
    }

    const service = new google.maps.DistanceMatrixService();

    service.getDistanceMatrix(
        {
            origins: [origem + ', Brasil'],
            destinations: [destino + ', Brasil'],
            travelMode: google.maps.TravelMode.DRIVING,
            unitSystem: google.maps.UnitSystem.METRIC
        },
        function (response, status) {
            if (status !== 'OK') {
                document.getElementById('resultado').innerText =
                    'Erro na API: ' + status;
                return;
            }

            const element = response.rows[0].elements[0];

            if (element.status !== 'OK') {
                document.getElementById('resultado').innerText =
                    'Rota não encontrada';
                return;
            }

            const km = Math.ceil(element.distance.value / 1000);

            document.getElementById('resultado').innerText =
                `Distância: ${km} km`;
        }
    );
}
</script>