Cara Mendapatkan Nama Negara berdasarkan Latitude dan Longitude Google Maps API - Cara ini untuk mengetahui nama negara berdasarkan Latitude dan Longitude . Untuk Contohnya bisa di coba di bawah ini :
<script>
$('#cek').click(function(){
var geocoder = new google.maps.Geocoder();
var lat = $('#lat').val();
var lng= $('#lng').val();
var geocoder = new google.maps.Geocoder();
var latLng = new google.maps.LatLng(lat, lng);
geocoder.geocode({ 'latLng': latLng },
function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[0]) {
for (var i = 0; i < results[0].address_components.length; i++) {
if (results[0].address_components[i].types[0] == "country") {
Cara mendapatkan Latitude dan Longitude alamat dengan Google Maps API dan Jquery - Cara ini adalah untuk mengetahui atau mendapakan latitude dan longitude sebuah alamat yang kita masukan pada kotak pencarian. Cara ini menggunakan teknologi google maps api dan jquery, untuk contohnya bisa di coba di bawah ini :
Dari Contoh di atas , berikut ini adalah code nya .
Kali ini saya akan membasa tentang Pengulangan For, While, Do While yang sekaligus jadi tugas UAS mata kuliah Algoritma dan Pemrograman pada perkuliahan saya. Untuk lebih jelasnya silahkan simak penjelasan singkat di bawah ini. 1.Pengulangan For
Pada pengulangan For, untuk structure nya adalah sebagi berikut :
for (start; condition; increment)
{
statement;
}
start - adalah kondisi awal saat pengulangan akan di jalankan, biasanya di isi dengan i , misalkan i = 1.
condition - adalah kondisi yang harus di penuhi agar pengulangan dapat dijalankan, misal kondisinya seperti ini i < = 10 yang artinya pengulangan akan di jalankan apabila isi i lebih kecil dari sama dengan 10 .
increment - adalah bagian yang memproses variable counter agar pengulangan berjalan sampai akhir , contohnya adalah i ++; misal pada start i = 1 dengan adanya increment ini (I++) maka varibale i akan di tambahkan terus berdasarkan maksimal i yang di set pada condition.
statement - adalah bagian dari hasil proses pengulangan, biasanya disini di lakukan untuk mencetak value dari i atau bisa di bilang statement adalah output dari proses pengulangan.
Untuk contohnya bisa di coba dengan cara klik button di bawah ini :
Dari contoh di atas menggunakan code sebagai berikut :
for(i=1; i<=10; i++){
document.write(i);
};
Bisa di lihat pada script tersebut adalah i=1; i<=10; i++ yang artinya mencetak bilangan 1 sampe 10.
2. Pengulangan While
Pada pengulangan While, untuk structure nya adalah sebagi berikut :
while (kondisi;)
{
statement;
increment;
}
kondisi,statement,increment pengertiannya sama dengan pengulangan for.
Untuk contohnya bisa di coba dengan cara klik button di bawah ini :
Dari contoh di atas menggunakan code sebagai berikut :
var i=1;
while(i <= 10) {
document.write(i);
i++;
};
Bisa di lihat pada script tersebut adalah i<=10; i++ yang artinya mencetak bilangan 1 sampe 10. Perbedaannya dengan pengulangan for adalah peletakan start dan increment nya .
3. Pengulangan Do While
Pada pengulangan Do While, untuk structure nya adalah sebagi berikut :
do {
statement;
increment;
}
while(kondisi;)
kondisi,statement,increment pengertiannya sama dengan pengulangan for.
Untuk contohnya bisa di coba dengan cara klik button di bawah ini :
Dari contoh di atas menggunakan code sebagai berikut :
var i=1;
do {
document.write(i);
i++;
}
while(i <= 10)
Bisa di lihat pada script tersebut adalah i<=10; i++ yang artinya mencetak bilangan 1 sampe 10. Perbedaan dari pengulangan lainya, pengulangan do while selalu mencetak value i walau i tidak sesuai dengan kondisi, itu karena statement nya di proses sebelum kondisi .
Baik untuk pembahasan Contoh Penggunaan Pengulangan (Looping) For, While, Do While saya cukupkan dulu. Terimakasih semoga bermanfaat.
Membuat Input Range Slider dengan Value Bubbles menggunakan Jquery - kali ini saya akan membagikan cara untuk membuat slider range menggunakan HTML 5 dan JQuery. Kenapa menggunakan jquery ? karena jika hanya menggunakan HTML 5 tampilan slider input range akan apa adanya, jika menggunakan jquery dan sedikit sentuhan CSS, slider input range akan jauh lebih menarik, pada silder input range akan muncul value bubbles. untuk lebih jelas nya bisa di lihat contoh nya di bawah ini .
Memasukan alamat baru pada autocomplete pencarian alamat google maps - fungsi ini digunakan untuk menambahkan atau menyisipkan sebuah alamat baru pada kolom pencarian alamat di google maps, disini saya akan gunakan api place nya google maps dengan menambahkan beberapa baris function agar alamat kita bisa merge dengan alamat google map.
function initialize() {
$(document).on('keyup',"#alamat",
function(event,e,f){
var inputAlamat = $("#alamat").val()
var data = {
"rows": [{ "Id":0, "name": "Bandung bagian utara"},
{ "Id": 1, "name": "Jakarta bagian selatan" },
{ "Id": 2, "name": "Bogor tenggara " },
{ "Id": 3, "name": "jalan bogor indo"}]
}
var dataCustom= ($.map(data.rows, function (prediction, i) {
return {
label: prediction.name,
value: prediction.name
}
})
);
var autoCompleteService = new google.maps.places.AutocompleteService();
if( inputAlamat != ""){
autoCompleteService.getQueryPredictions({ input: inputAlamat}, function (predictions, status) {
if (status != google.maps.places.PlacesServiceStatus.OK) {
alert(status);
return;
}
var result = ($.map(predictions, function (prediction, i) {
return {
label: prediction.description,
value: prediction.description
}
})
);
var resultSementara = dataCustom.concat(result)
$("#result").empty();
resultSementara.sort(function(item,item2){
if (item.label > item2.label) return 1
return 0
}
)
var resultAkhir = resultSementara.slice(0,5)
resultAkhir .forEach(function(prediction) {
var li = document.createElement('li');
li.appendChild(document.createTextNode(prediction.label));
document.getElementById('result').appendChild(li);
});
});
}
});
}
Penjelasan :
var data = {} -> Ini fungsi untuk menambahkan alamat , bisa juga kita get alamat dari database dengan menggunakan ajax .
var dataCustom ={} -> Ini fungsi untuk maping hasil result data dengan result google place.
var autoCompleteService ={} -> Ini fungsi api nya google maps.
var result ={} -> Ini fungsi untuk maping result google place api.
var resultSementara = {} -> Ini fungsi untuk menggabungkan data alamat yang kita buat dengan alamat google place.
var resultAkhir ={} -> Ini fungsi untuk mengambil data hanya 5 teratas saja setelah sebelumnya di sort.
Untuk contoh nya bisa di coba disini, ketik bandung, maka akan muncul Bandung bagian utara pada bagian hasil pencarian.
Membuat pencarian alamat menggunakan autocomplete google maps - Fungsi ini berguna untuk melakukan pencarian alamat menggunakan autocomplete google maps tanpa harus menyisipkan maps pada web , hanya perlu textbox saja, jadi saat kita mengetikan sebuah alamat pada textbox akan muncul saran nama alamat yang kita ketikan .
<script type="text/javascript">
google.maps.event.addDomListener(window, 'load', function () {
var places = new google.maps.places.Autocomplete(document.getElementById('alamat'));
google.maps.event.addListener(places, 'place_changed', function () {
var place = places.getPlace();
var address = place.formatted_address;
var latitudeLongitude = place.geometry.location;
var mesg = "Address: " + address;
mesg += "\nLatitudeLongitude: " + latitudeLongitude;
Membuat Google Maps dengan Angularjs - Menampilkan maps sederhana pada web dengan menggunakan google maps API dan angularjs itu sangat mudah. Untuk lebih jelasnya bisa ikuti cara di bawah ini.
mapsCtrl.js adalah nama file controller nya. $scope.map adalah initial map pertama kali di load, latitude dan longitude yang di set di atas adalah kalimantan . $scope.markers adalah untuk menandai / marker pada maps, contoh di atas adalah kalimantan dan jakarta yang di marker.
Itu saja CaraMembuat Google Maps dengan Angularjs Semoga bermanfaat.
