---

.

---

---

Metode dan Algoritma | Menggambar / Draw Circle (Lingkaran) pada Google Map (Pemrograman Web) . Anda bisa melakukan konsultasi tentang Menggambar / Draw Circle (Lingkaran) pada Google Map (Pemrograman Web) melalui form di samping kanan !!!

---

Sebelumnya kita sudah bisa menampilkan peta Google Map pada Web atau Blog dan Mencari Koordinat Suatu Titik Beserta Alamatnya. Nah sekarang bagaimana kita bisa menampilkan atau menggambar lingkaran pada peta yang sudah tampil tersebut. Misal untuk menggambar area atau radius dari suatu titik.

Di bawah ini adalah contoh radius area Letusan Gunung Merapi :

Kode Programnya di bawah ini :




<script src="http://maps.google.com/maps/api/js?sensor=false&amp;language=id" type="text/javascript">
</script>


<script type="text/javascript">
var geocoder = new google.maps.Geocoder();


function initialize() {
  var latLng = new google.maps.LatLng(-7.540388743904892, 110.44494428789062);


  var map = new google.maps.Map(document.getElementById('mapCanvas'), {
    zoom: 12,
    center: latLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });


  var marker = new google.maps.Marker({
    position: latLng,
    title: 'Radius Bahaya Letusan / Lahar Gunung Merapi',
    map: map,
    draggable: true
  });


  // Create marker
  //var marker = new google.maps.Marker({
  //  map: map,
  //  position: new google.maps.LatLng(53, -2.5),
  //  title: 'Some location'
  //});


  // Add circle overlay and bind to marker
  var circle = new google.maps.Circle({
    map: map,
    radius: 3000,              //16093,    // 10 miles in metres
    fillColor: '#AA0000'
  });
  circle.bindTo('center', marker, 'position');


}


// Onload handler to fire off the app.
google.maps.event.addDomListener(window, 'load', initialize);
</script>


  <style>
  #mapCanvas {
    width: 500px;
    height: 300px;
    float: left;
  }
</style>


  <br />


<div id="mapCanvas"></div>

Pada parameter radius bisa dimasukkan radiusnya dalam meter, sehingga jika 5 km = 5000m dst. Bisa dimasukkan Warna lain, Opacity / Transparansi dan seterusnya.

Source Code selengkapnya dapat didownload disini. Klik, setelah masuk Google Docs klik File-Download.

Semoga Berguna.

---

ActionScript AS3 ASP.NET AJAX C / C++ C# Clipper COBOL ColdFusion DataFlex Delphi Emacs Lisp Fortran FoxPro Java J2ME JavaScript JScript Lingo MATLAB Perl PHP PostScript Python SQL VBScript Visual Basic 6.0 Visual Basic .NET Flash MySQL Oracle Android

---

Related Post :

---

Judul: Menggambar / Draw Circle (Lingkaran) pada Google Map (Pemrograman Web)
Rating: 100% based on 99998 ratings. 5 user reviews.
Ditulis Oleh hank2

Anda sedang membaca artikel tentang Menggambar / Draw Circle (Lingkaran) pada Google Map (Pemrograman Web), Semoga artikel tentang Menggambar / Draw Circle (Lingkaran) pada Google Map (Pemrograman Web) ini sangat bermanfaat bagi teman-teman semua, jangan lupa untuk mengunjungi lagi melalui link Menggambar / Draw Circle (Lingkaran) pada Google Map (Pemrograman Web).

---