[HTML] pobierz, plaintext 
 
function calculateDistance(origin, destination) {
            var service = new google.maps.DistanceMatrixService();
            service.getDistanceMatrix(
                {
                    origins: [origin],
                    destinations: [destination],
                    travelMode: google.maps.TravelMode.DRIVING,
                    unitSystem: google.maps.UnitSystem.METRIC,
                    avoidHighways: false,
                    avoidTolls: false
                }, callback
            );
        }
 
        function callback(response, status) {
            if (status != google.maps.DistanceMatrixStatus.OK) {
                console.log(err);
            } else {
                var origin = response.originAddresses[0];
                var destination = response.destinationAddresses[0];
                if (response.rows[0].elements[0].status === "ZERO_RESULTS") {
                    console.log("nie ma drog pomiedzy"
                        + origin + " and " + destination);
                } else {
                    var distance = response.rows[0].elements[0].distance;
                    var distance_value = distance.value; // w metrach
                    var distance_text = distance.text;   // np. 2,4 km
                    var distanceKm = distance_text.substring(0, distance_text.length - 3);
                    console.log("Odległość: " + distance_text + " lub " + distance_value/1000 + " lub " + distanceKm);
                }
            }
        }
 
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
<div id="inputs">
			<form action="" onsubmit="initMap(); return false;">
				<input type="text" id="adres" placeholder="( np. warszawa, puławska 19 ) "/><br>
				<input type="submit" value="Oblicz odległosć" /> <br><br> 
			</form>
      </div>
<div id="output"></div>
    </div>
    <div id="map"></div>
<script>
	function initMap() {
        var bounds = new google.maps.LatLngBounds;
        var markersArray = [];
        var origin = 'Główna 31, Tychy';// tutaj musisz podać swój adres jeśli potrzebujesz do wyświetlenia
		if(document.getElementById("adres").value == ''){
			var destination = 'Główna 31, Tychy';
			alert('musisz podać adres docelowy');
			exit();
		}else{
			var destination = document.getElementById("adres").value;
		};
        var destinationIcon = 'https://www.google.com/intl/en_ALL/mapfiles/dd-end.png';
		var destinationTitle = 'A tutaj się zatrzymujemy!';
        var originIcon = 'https://www.google.com/intl/en_ALL/mapfiles/dd-start.png';
		var originTitle = 'Stąd wyruszamy :)';
		$('#map').css('width','400px').css('height', '400px');
        var map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: 50.108138, lng: 19.0400068}, // tutaj pokazujesz mapkę na której google rozrysuje trasę
          zoom: 12
        });
        var geocoder = new google.maps.Geocoder;
        var service = new google.maps.DistanceMatrixService;
        service.getDistanceMatrix({
          origins: [origin],
          destinations: [destination],
          travelMode: google.maps.TravelMode.DRIVING,
          unitSystem: google.maps.UnitSystem.METRIC,
          avoidHighways: true,
          avoidTolls: true
        }, function(response, status) {
          if (status !== google.maps.DistanceMatrixStatus.OK) {
            alert('Error was: ' + status);
          } else {
            var originList = response.originAddresses;
            var destinationList = response.destinationAddresses;
            var outputDiv = document.getElementById('output');
            outputDiv.innerHTML = '';
            deleteMarkers(markersArray);
 
            var showGeocodedAddressOnMap = function(asDestination) {
              var icon = asDestination ? destinationIcon : originIcon;
			   var title = asDestination ? destinationTitle : originTitle;
              return function(results, status) {
                if (status === google.maps.GeocoderStatus.OK) {
                  map.fitBounds(bounds.extend(results[0].geometry.location));
                  markersArray.push(new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location,
                    icon: icon,
					title : title
 
                  }));
                } else {
					if( status === 'ZERO_RESULTS' && document.getElementById("adres").value!= '' ){
						alert('Geolokalizator nie potrafi odnaleźć wpisanej miejscowości :( <br> Wpisz poprawną miejscowość');
					}
                }
              };
            };
 
            for (var i = 0; i < originList.length; i++) {
              var results = response.rows[i].elements;
              geocoder.geocode({'address': originList[i]},
                  showGeocodedAddressOnMap(false));
              for (var j = 0; j < results.length; j++) {
                geocoder.geocode({'address': destinationList[j]},
                    showGeocodedAddressOnMap(true));
					outputDiv.innerHTML += 'odległość:  ' + results[j].distance.text;
					$('#stronger').remove();
				}
			}
            }
          }
        });
	}
 
	function deleteMarkers(markersArray) {
		for (var i = 0; i < markersArray.length; i++) {
			markersArray[i].setMap(null);
		}
		markersArray = [];
	}
    </script>
    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB3xxTXcVYShuoufkT1tV6L55C0_K0tMzw"><!-- tutaj musisz dać swój klucz API -->
    </script>
[HTML] pobierz, plaintext