Hai...genks selamat siang,smoga kabarnya baik-baik saja...yah ditengah kesibukan KP (ga sibuk2 amat sih) adek masih berkesempatan berbagi ilmu dengan teman-teman semua,kali ini tentang cara menampilkan google maps pada laravel,cara yang adek share kali ini sangat simple sekali yang akan membantu teman-teman nantinyaa dalam mengempangkan aplikasi web yang membutuhkan google maps,yang kita butuhkan disini adalah package Googlemapper ,package ini membantu kita dalam menampilkan googlemaps di Laravel 5.3.Sebelum adek memulainya alangkah baiknya kita cari tau dulu tentang Goolemapper dan fitur apasaja yang disediakan,dengan Googlemapper ini kamu akan diberi akses yang lengkap tergantung penggunaan
Mapper:: yaitu- Untuk menggunakan package ini caranya,pada pada composer.json tambahkan pada require "cornford/googlmapper": "2.*"
tambahkan packagenya - Selanjutnya update composer kalian dan tunggu sampai selesai
composer update - Lalu tambahkan provider dan juga aliases pada app.php yang ada dalam folder config
Cornford\Googlmapper\MapperServiceProvider::class,'Mapper'=> Cornford\Googlmapper\Facades\MapperFacade::class,
tambahkan pada provider 
tambahkan pada aliases - Selanjutnya kita akan mengenalkan configurasi tadi pada aplikasi kita dengan membuat perintah pada cmd
php artisan vendor:publish --provider="Cornford\Googlmapper\MapperServiceProvider" --tag=googlmapper - Setelah selesai kalian dapat mengatur configurasinya pada file googlemapper.php dalam folder config
enabled- Enable Google Maps.key- A Google Maps API key.region- A region Google Maps should utilise, required in ISO 3166-1 code format, e.g. GB.language- A language Google Maps should utilise, required in ISO 639-1 code format, e.g. en-gb.async- Perform the loading and rendering of Googlmapper map asynchronously, e.g. false.user- Use custom Google Maps for users logged into the Google service, e.g. false.marker- Automatically add Google Maps marker for your maps initial location, e.g. true.center- Automatically center Google Maps around the initial location, when false, Google Maps will automatically center the map, e.g. true.locate- Automatically center Google Maps around the users current location, when false, Google Maps will automatically center the map, e.g. true.zoom- Set the default zoom level for Google Maps, e.g. 8.scrollWheelZoom- Set the default scroll wheel zoom Google Maps, e.g. true.fullscreenControl- Set the default fullscreen control for Google Maps, e.g. true.type- Set the default map type for Google Maps, e.g. ROADMAP, SATELLITE, HYBRID, TERRAIN.ui- Show the Google Maps default UI options, e.g. true.markers.icon- Set the default marker icon, e.g. img/icon.png.markers.animation- Set the default marker animation, e.g. NONE, DROP, BOUNCE.cluster- Set if map marker clusters should be used.clusters.icon- Display custom images for clusters using icon path.clusters.grid- The grid size of a cluster in pixels.clusters.zoom- The maximum zoom level that a marker can be part of a cluster.clusters.center- Whether the center of each cluster should be the average of all markers in the cluster.clusters.size- The minimum number of markers to be in a cluster before the markers are hidden and a count is shown.
- Setelah semua konfigurasi selesai ,sekarang kita lanjut ke cara penggunaannya,buat controller untuk map-nya adek akan membuat namanya MapController lalu isikan seperti ini
map controller - Selanjutnya kita buat view-nya dengan nama map.blade.php cukup copy welcome.blade.php dan hapus yang tidak perlu dan isi {!! Mapper::render() !!} untuk menampilkan map tersebut,kalo kalian ingin mendesain dengan view lebih bagus juga bisa
untuk menampilkan map - Selanjutnya kita configurasikan route agar controller dan juga view tadi terhubung.
tambahkan pada route
Dengan begitu selesai kalian dapat melihatnya pada halaman map project kalian,cukup mudah bukan dengan package ini sangat menghemat waktu kita dalam pengerjaannya.Sekarang cukup lakukan pengembangannya,bagi yang melihat source code-nya dapat melihatnya di github saya.Lain kali saya akan melanjutkannya,bagi kalian yang pengen mengembangkan ini bisa dengan menambahkan branch pada github adek, adek akan sangat senang sekali.
 |
| Hasil dari yang telah kita buat tadi |
0 Komentar