Menampilkan Polygon Dari KML Di Google Maps
Artikel saya yang baru ini akan membahas bagaimana caranya menampilkan Polygon dari KML di Google Maps. Polygon sendiri adalah sekumpulan array dari koordinat-koordinat lattitude dan longitude yang tergabung menjadi satu dan diberi warna sehingga terlihat unik. Polygon dapat digunakan sebagai batas dan luas suatu wilayah pada peta.
Menampilkan Polygon Dari KML Di Google Maps #Script
Untuk membuat file KML kamu bisa memanfaatkan fasilitas Google Earth atau generator KML yang ada di internet. Sekarang kita buka text editor dan ketikkan script berikut ini
<html>
<head>
<title>Google Maps KML</title>
<script src="https://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<!-- memanggil library geoxml3 untuk parsing data kml ke peta -->
<script src="https://geoxml3.googlecode.com/svn/branches/polys/geoxml3.js" type="text/javascript"></script>
<script src="jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
var peta;
function peta_awal() {
var jawa_barat = new google.maps.LatLng(-7.090911, 107.668887);
var petaoption = {
zoom: 8,
center: jawa_barat,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
peta = new google.maps.Map(document.getElementById("petaku"),
petaoption); /** disini kita panggil function dari geoXML3 untuk memparsing file kml */
var geoXml = new geoXML3.parser({
map: peta
}); /** letak file kml */
geoXml.parse('jawa_barat.kml');
google.maps.event.addListener(peta, 'click', function (event) {
kasihtanda(event.latLng);
});
}
</script>
</head>
<body>
<h2>Google Maps KML</h2>
<div id="petaku" style="height: 500px;"></div>
</body>
</html>Menampilkan Polygon Dari KML Di Google Maps #Output
Untuk penampakannya seperti ini :
Mudahkan? untuk full sourcecode-nya bisa di download disini, silahkan dicoba dan semoga bermanfaat 😀
UPDATE : Menampilkan Multi Polygon Arrays di Google Maps
29 Komentar
Azhar · Februari 20, 2013 pada 5:42 pm
hai sob, ^^ selamat ya udh kerja lagi… di Jakarta ya sekarang/. sukses ya bro….
El Cicko · Februari 21, 2013 pada 9:12 pm
oy….ente geus pindahan? engke urang ulin lah
Agung Sumbowo · Mei 13, 2018 pada 9:15 pm
Kang, ada koordinat kabupaten/kota jawa barat yg lengkapnya?
Frankie · Maret 6, 2013 pada 5:11 pm
mantep bro baru tau bisa customize kaya gitu.. coba ah
deta · Juli 23, 2013 pada 3:59 pm
halo elcicko
saya sudah download source kode tapi masih juga gak ngerti
saya mau buat google maps api di dalam web
saya punya file kml tapi saya bingung menyimpan file itu supaya bisa masuk script yang dibuat elcicko
tolong pencerahanya
El Cicko · Juli 23, 2013 pada 9:44 pm
begini nich mas deta…
pertama…di load dulu API dari GEOXML diheadernya
abis itu kita bikin function di javascript untuk manggil kml yang kita buat….yang udah saya buat di scriptnya
file kmlnya di taro di luar aja biar lebih gampang….
nah..tinggal di tampilkan aja dalam div
fandie · Maret 6, 2014 pada 1:17 pm
klo mau nambahin multi markernya di kml gimana ya
El Cicko · Maret 6, 2014 pada 1:40 pm
mas fandie bisa pelajari dulu format tag untuk marker di KML disini…
https://developers.google.com/maps/tutorials/kml/
nah dari situ bisa dtambahin markernya per kabupaten / kota
FANDIE · Maret 24, 2014 pada 10:24 am
mas sudah bisa , nah klo di ganti KMZ gk bisa. solusi manggil file KMZ bgmana mas?
and_riyan · November 9, 2014 pada 10:39 pm
pada script bagian mana y mas, kug bisa memberikan warna yang berbeda di masing2 wilayah?
saat saya ganti dg file kml saya, warna yg muncul adalah warna default (merah)..
mohon penjelasannya.. thanks
idik · Februari 20, 2015 pada 3:22 pm
maaf mas. kalo membuat peta KML gitu caranya gimana
El Cicko · Februari 23, 2015 pada 2:18 pm
bisa pake bantuan google earth mas idik, coba aja cari referensinya di Google 😀
Fahmi · April 12, 2015 pada 7:09 pm
Punten kang, kl file KML memang harus customize sendiri ya atau ada situs yg menyediakan?
El Cicko · April 13, 2015 pada 11:33 am
Yups, betul mas itu customize sendiri. setau saya sih belum ada situs yang menyediakan, waktu itu saya bikinnya di Google Earth.
vander · Agustus 10, 2015 pada 1:19 pm
saya pernah dapat file .kml dari situs pemerintahan. Dari situ saya bisa dapat data kabupaten seluruh indonesia. tapi saya lupa apa nama situsnya. coba aja cari di google. Dari situs ini misalnya:
http://data.go.id/dataset?res_format=KML
https://greasyfork.org/id/scripts/8412-kota-medan/code
Teten · Desember 4, 2015 pada 10:46 am
mas saya bkin aplikasi yang akses kml file, warna di region kml file itu nanti bisa dirubah-rubah sesuai dengan nilai yang sudah di definisikan di aplikasi itu, itu kira-kira gmn ya mas? ada saran ngga?
Dian · Desember 8, 2015 pada 7:16 pm
permisi mas mau nanya, untuk file kml nya sendiri apa harus dimasukkan ke dalam folder xampp\htdocs ?
saya mencoba menggunakan localhost dulu soalnya. tapi saya bingung harus meletakkan file .kml tersebut dimana.
matur nuwun, saya masih baru di dunia percodingan jadi masih asing juga dengan coding2 hehe
rendy permana · Juni 1, 2016 pada 1:10 am
kang pertamanya nampil, tapi beberapa hari kemudian ga bisa nampil, apa berpengaryh terhadap versi google map nya?
El Cicko · Juni 1, 2016 pada 2:02 am
alamat untuk GeoXML3 di Google Code udah expire kang, bisa diakses disini. Untuk resolve-nya coba ganti URL-nya ke alamat yang baru di GitHub. URL-nya disini. Semoga membantu kang 😀
pratama · September 14, 2016 pada 11:07 pm
itu dapet file .kml nya darimana ya? jika berkenan berbagi
El Cicko · September 15, 2016 pada 1:21 am
saya bikin sendiri gan, boleh…tinggal download aja gan 🙂
pratama · September 15, 2016 pada 8:06 am
masalahnya saya lagi nyari referensi batas wilayah yang nyampe tingkat kecamatan, sudah nyari belum ketemu,.. mungkin agan punya referensi?
Agus Muhajir Agus Muhajir · Oktober 8, 2016 pada 2:30 pm
ijin nyoba ya ilmunya…. ;-D
Dimas Demms · Oktober 14, 2016 pada 4:12 pm
Mas ketika saya coba tes kok warna dari polygon KML nya ngga muncul ya, mohon pencerahannya.
rezarion · Oktober 31, 2016 pada 1:26 am
diedit aja mas file kml nya, dikasih polygonStyle, saya kemarin juga gitu, dikasih warna misal 15 warna (warna kml bukan cmyk/rgb) pake styleUrl, trus tinggal dipanggil sesuai jumlah area yg dibutuhkan..
bambs · November 17, 2016 pada 10:16 am
bisa di kasih contoh source codenya gak mas, warna poligon saya jg gk muncul.
Agung Tamaka · Februari 5, 2019 pada 7:26 pm
Dalam satu KML Jawa Barat tentunya memiliki marker koordinat tiap-tiap kota, lalu gimana caranya untuk membuat marker itu berbeda warna sesuai kondisi fungsi yang kita tentukan. Semisal, satu kota akan berwarna merah jika jumlah penduduknya kurang dari 500 jiwa, akan berwarna hijau jika lebih dari 10000 jiwa. Terima gaji gan
Eing · April 9, 2020 pada 9:14 pm
Maaf mau nanya, saya ikuti sesuai tutorial di atas. tapi kok gak tampil petanya? tolong jawabannya kak.
Menampilkan Multi Polygon Arrays di Google Maps · Agustus 25, 2015 pada 5:07 am
[…] Menampilkan Polygon Dari KML Di Google Maps […]