Untuk membuat titik-titik ini, peratama-tama yang perlu dilakukan adalahmemplot beberapa jarak pada peta dengan beberapa JavaScript yang berguna, karena untuk menghitung jarak apapun membutuhkan titik A dan titik B yang biasa di sebut dengan titik awal (origin) dan titik tujuan (destination), akan di mulai dengan menambahkan dua penanda ke Google Map dasar:

https://pastebin.com/nQ9yaatE (silahkan ambil code disini untuk implementasi)

Di sini kita bisa lihat halaman peta menunjukan lokasi Central Park NYC, serta dua landmark terdekat nya yaitu; Dakota, atau mungkin yang paling terkenal sebagai daerah rumah John Lennon. Dan The Frick Collection di sebrangnya adalah titik lokasi sebuah galeri seni.

Menghitung jarak garis lurus dari garis lintang dan garis bujur

Metode paling sederhana untuk menghitung jarak bergantung pada beberapa perhitungan matematika yang tampak canggih. Dikenal sebagai rumus Haversine, rumus ini menggunakan trigonometri bola untuk menentukan jarak lingkaran besar antara dua titik. 

Wikipedia memiliki lebih banyak pengertian yang membahas tentang perumusan perkiraan jarak garis lurus yang populer ini. Untuk memvisualisasikan perhitungan kita dapat menggambar Polyline di antara dua penanda. Tambahkan baris berikut setelah penanda di JavaScript:

// Draw a line showing the straight distance between the markers
  var line = new google.maps.Polyline({path: [dakota, frick], map: map});

Muat ulang peta dan akan melihat garis gelap diagonal yang menghubungkan dua penanda, dari satu sisi Central Park ke sisi lainnya. Menggunakan persamaan JavaScript dari rumus Haversine dapat menentukan panjang Polyline, jarak lurus antara dua penanda.

• Tambahkan fungsi ini ke JavaScript, sebelum fungsi initMap:

function haversine_distance(mk1, mk2) {
      var R = 3958.8; // Radius of the Earth in miles
      var rlat1 = mk1.position.lat() * (Math.PI/180); // Convert degrees to radians
      var rlat2 = mk2.position.lat() * (Math.PI/180); // Convert degrees to radians
      var difflat = rlat2-rlat1; // Radian difference (latitudes)
      var difflon = (mk2.position.lng()-mk1.position.lng()) * (Math.PI/180); // Radian difference (longitudes)

      var d = 2 * R * Math.asin(Math.sqrt(Math.sin(difflat/2)*Math.sin(difflat/2)+Math.cos(rlat1)*Math.cos(rlat2)*Math.sin(difflon/2)*Math.sin(difflon/2)));
      return d;
    }

Fungsi menerima dua objek penanda dan mengembalikan jarak antara keduanya dalam mil. Untuk menggunakan kilometer, atur R = 6371.0710. Sebelum menerapkan rumus Haversine, fungsi mengubah titik lintang dan bujur setiap penanda menjadi radian.

• Untuk memanggil fungsi dan melaporkan jarak di bawah peta, tambahkan kode ini di bawah Polyline di fungsi initMap:

// Calculate and display the distance between markers
  var distance = haversine_distance(mk1, mk2);
  document.getElementById('msg').innerHTML = "Distance between markers: " + distance.toFixed(2) + " mi.";

Dapatkan Petunjuk Arah dengan Maps JavaScript API
Ketika jarak garis lurus tidak memadai, Anda memerlukan lebih dari sekadar rumus untuk menentukan sebuah jarak perjalanan. Petunjuk arah mengemudi adalah salah satu fitur paling populer di Google Maps, jadi tidak mengherankan jika itu juga tersedia melalui API. 
Permasalahan tersebut dapat diselesaikan dengan menggunakan Directions API untuk permintaan sisi server, atau Directions Service di Maps JavaScript API untuk permintaan sisi klien di web. Karena peta JavaScript sudah disetel, selanjutkan akan melanjutkan dengan menggunakan Layanan Petunjuk Arah.
Tempel kode berikut ini di akhir fungsi initMap yang dibuat:
let directionsService = new google.maps.DirectionsService();
  let directionsRenderer = new google.maps.DirectionsRenderer();
  directionsRenderer.setMap(map); // Existing map object displays directions
  // Create route from existing points used for markers
  const route = {
      origin: dakota,
      destination: frick,
      travelMode: 'DRIVING'
  }


directionsService.route(route,
    function(response, status) { // anonymous function to capture directions
      if (status !== 'OK') {
        window.alert('Directions request failed due to ' + status);
        return;
      } else {
        directionsRenderer.setDirections(response); // Add route to the map
        var directionsData = response.routes[0].legs[0]; // Get data about the mapped route
        if (!directionsData) {
          window.alert('Directions request failed');
          return;
        }
        else {
          document.getElementById('msg').innerHTML += " Driving distance is " + directionsData.distance.text + " (" + directionsData.duration.text + ").";
        }
      }
    });

Setelah panggilan berhasil ke layanan petunjuk arah, akan memiliki rute yang ditambahkan ke peta. Pesan di bawah peta juga diperluas untuk memasukkan jarak. 

Dengan inspeksi visual yang cepat, jelas bahwa arah mengemudi jauh lebih jauh daripada jarak garis lurus, dapat menggali data yang muncul sebagai respons untuk menemukan jarak mengemudi (1,6 mil, dua setengah kali lebih jauh), serta perkiraan durasi. 
Berikut adalah representasi JSON dari bagian yang relevan dari respons:
"routes": [{
  "legs": [
    {
      "distance": {
        "text": "1.6 mi",
        value: 2619
      },
      {
        "duration": {
          "text": "9 mins",
          value: 516
        }
      }
    }
  ]
}]
Salah satu contoh menggunakan petunjuk arah mengemudi, juga dapat meneruskan nilai lain ke bidang travelMode di objek rute. Layanan petunjuk arah juga dapat menerima pengukuran dengan moda BICYCLING, TRANSIT, dan WALKING. 
Tips! Coba sesuaikan mode dan jalankan kode lagi untuk melihat bagaimana hasil petunjuk arah berubah.
Jarak mana yang harus digunakan?
Dua jenis jarak dalam artikel ini berguna dalam skenario yang berbeda. Untuk memberikan pengalaman terbaik kepada pengguna, Anda harus mencoba menggunakan skema masing-masing dalam situasi yang sesuai.
Pada situasi dan kondisi tertentu kita dapat menggunakan jarak garis lurus untuk membuat perhitungan cepat tanpa panggilan ke layanan eksternal. untuk fungsi tersebut harus menyertakan Haversine yang digunakan dalam tutorial ini, tetapi yang di butuhkan hanyalah koordinat peta untuk mendapatkan hasil yang akurat di dalam browser. 
Namun, seperti namanya, jaraknya akan menjadi garis lurus sederhana. Jalan, penghalang, dan lalu lintas tidak diperhitungkan dalam sebuah jarak tarik garis lurus.
Jarak dan rute di sisi lain, akan mengembalikan jarak di sepanjang rute, termasuk belokan yang diperlukan dan pemahaman tentang pola lalu lintas area tersebut. Karena rumitnya perhitungan ini, jarak rute memerlukan panggilan ke layanan petunjuk arah, yang juga akan mengembalikan durasi rute dan bahkan jalur untuk diplot secara visual pada peta.
Setelah mengukur jarak di seluruh wilayah atau di seluruh kota yang diperlukan, gunakan salah satu pendekatan ini untuk membantu pengguna lebih memahami lingkungan mereka dan membantu mereka membuat keputusan. 
Untuk menjelajahi lebih banyak alat untuk membantu pengguna berpindah dari satu titik ke titik yang lain untuk informasi lebih lanjut tentang Google Maps Platform, kunjungi situs web Terralogiq.
Demikian pembahasan mengenai cara menghitung jarak antar titik dengan Maps JavaScript API.
Terralogiq sebagai satu-satunya Google Maps Premier Partner di Indonesia bertujuan membantu bisnis anda untuk meningkatkan efisiensi proses bisnis dengan mengintegrasikan Google Maps Platform dan menyederhanakan penerapan Google Maps API dan SDK.