Tambah Peta Memandu Peta Google ke Laman Web Anda
Walaupun terdapat banyak aplikasi dan perkhidmatan pemetaan di luar sana untuk membuat anda dari titik A ke titik B, raja peta muktamad adalah Peta Google. Saya menggunakannya pada komputer, tablet dan 90% masa pada telefon pintar saya. Ia mendapat data terbaik, pilihan pelayaran dan laluan yang paling popular dan ciri-ciri keren seperti Street View dan maklumat perjalanan berjalan kaki, berbasikal dan massa.
Tetapi bagaimana jika anda perlu menggunakan peta atau arah di luar laman web Google? Katakan anda mempunyai laman web perkahwinan anda sendiri atau blog peribadi dan tetamu boleh melawat tapak anda, taip alamat yang akan datang dan dapatkan petunjuk arah ke lokasi kejadian secara automatik!
Nah, ada beberapa cara yang boleh anda lakukan untuk mencapai matlamat ini. Cara paling mudah adalah dengan hanya membenamkan peta ke halaman web anda menggunakan kod embed yang dihasilkan oleh Peta Google. Cara kedua adalah sedikit lebih teknikal, tetapi lebih disesuaikan dan dinamik. Saya akan menyebut kedua-dua kaedah di bawah.
Benamkan Peta Google
Sekiranya anda hanya ingin memaparkan arahan dari satu lokasi ke lokasi yang lain, perkara yang paling mudah dilakukan ialah menanamkan apa sahaja peta yang anda lihat menggunakan kod benam. Mula-mula, teruskan dan tetapkan arahan yang anda inginkan dalam Peta Google dan kemudian klik pada ikon gear di sebelah kanan bawah halaman.
Klik pada Kongsi atau benamkan peta dan kemudian klik pada Benamkan peta tab. Di sini anda boleh memilih saiz untuk peta anda dan kemudian salin kod iframe dan lepaskan ke mana-mana halaman web yang anda suka.
Satu-satunya kelemahan kepada kaedah ini ialah pengguna hanya melihat peta statik. Dalam kaedah kedua di bawah, anda boleh membuat borang di mana pengguna boleh menaip mana-mana alamat permulaan dan ia akan menjana peta dari alamat itu ke alamat destinasi yang anda pilih.
Buat Borang Peta Google
Untuk menggambarkan apa yang saya maksudkan dengan kaedah kedua, teruskan dan taip alamat AS di dalam kotak di bawah untuk mendapatkan arah dari lokasi anda ke rumah saya:
Sejuk huh? Anda boleh dengan mudah membuat borang kecil ini di mana-mana laman web, blog, atau di mana-mana sahaja anda boleh memasukkan beberapa kod HTML! Ini juga bagus untuk laman web perniagaan kecil kerana anda boleh membuangnya di halaman kenalan anda dan orang ramai boleh mendapatkan arah dengan cepat, bukannya perlu menyalin alamat anda, membuka tetingkap baru, kemudian taipkan alamat permulaannya.
Jadi bagaimana kita membuat penciptaan kotak arahan arah yang diubahsuai ini? Pertama sekali, kita perlu mendapatkan sintaks yang betul untuk URL yang digunakan oleh Google untuk arahan. Untungnya, kita dapat memikirkannya dengan mendapatkan arah di antara dua tempat dan kemudian menyalin URL dari bar alamat. Anda juga boleh mengklik pada ikon gear kecil di sebelah kanan bahagian bawah halaman dan pilih Kongsi atau benamkan peta.
Tab pautan Kongsi akan mengandungi URL, iaitu URL yang sama di bar alamat penyemak imbas anda. Saya telah pergi ke hadapan dan menyisipkan seluruh URL di bawah untuk menunjukkan kepada anda apa yang kelihatannya.
https://www.google.com/maps/dir/3600+Thorp+Springs+Dr,+Plano,+TX+75025,+USA/ 854 + Deerfield + Rd, + Allen, + TX + 75013, + Amerika Syarikat / @ 33.1125686, -96.7557749,13z / data =! 3m1! 4b1! 4m13! 4m12! 1m5! 1m1! 1s0x864c3d45018517a5: 0xbabd3c91a1321997! 2m2! 1d-96.762484! 2d33.08947! 1s0x864c16d3018a7f4f: 0xab2052b5786cd29f! 2m2! 1d-96.666151! 2d33.133892
Yikes! Itu cukup lama! Ada banyak perkara di sana, kebanyakannya tidak masuk akal! Parameter URL Peta Google digunakan untuk menjadi sangat mudah dan mudah, tetapi struktur URL baharu agak rumit. Syukurlah, anda masih boleh menggunakan parameter lama dan Google akan menukarnya ke versi baharu secara automatik. Untuk melihat apa yang saya maksud, periksa pautan di bawah.
http://maps.google.com/maps?saddr=start&daddr=end
Teruskan dan tembakan. Masukkan alamat dalam petikan untuk alamat permulaan dan akhir dan tampalkan URL ke pelayar anda! Saya diganti bermula dengan bandar raya New Orleans saya dan berakhir dengan Houston, TX, jadi inilah URL arah arah Google Maps saya seperti:
http://maps.google.com/maps?saddr="new orleans, la "& daddr =" houston, tx "
Ianya berfungsi! Seperti yang anda lihat, walaupun, Peta Google menukar pautan ke sesuatu yang jauh lebih rumit sekali apabila peta dimuat sepenuhnya. Ok, jadi sekarang bahawa kita mempunyai URL yang waras yang kita boleh masuk ke Peta Google, kita perlu membuat borang yang mudah dengan dua bidang, satu untuk alamat permulaan dan satu untuk alamat destinasi.
Jika anda mahu orang hanya menaip alamat mereka dan mendapatkan arahan ke tempat anda, maka kami ingin bidang kedua tersembunyi dan sudah ditetapkan ke alamat destinasi.
Masukkan alamat permulaan anda:
Lihat kod di atas. Baris pertama bermula dari borang dan mengatakan bahawa apabila butang serah diklik, data harus dihantar ke maps.google.com/maps. The target = kosong bermaksud kita mahu hasilnya dibuka dalam tetingkap baru. Kemudian kita mempunyai kotak teks untuk alamat permulaan, yang kosong.
Kotak teks kedua tersembunyi dan nilai adalah alamat destinasi yang kita inginkan. Akhir sekali, terdapat butang submit dengan tajuk "Dapatkan Petunjuk". Sekarang apabila seseorang menaip di alamat mereka, mereka akan mendapatkan ini:
Anda boleh menyesuaikan arah dan peta lagi dengan beberapa parameter tambahan. Sebagai contoh, katakan anda tidak mahu paparan lalai menjadi peta, tetapi sebaliknya mahu menjadi Satelit dan tunjukkan Trafik.
http://maps.google.com/maps?saddr=%22new+orleans,+la%22&daddr=%22houston,+tx%22&ie=UTF8&t=h&z=7&layer=t
Perhatikan lapisan = t dan t = h bidang dalam URL. lapisan = t adalah untuk lapisan lalu lintas dan t = h bermaksud peta hibrid! t juga boleh ditetapkan untuk m untuk peta biasa, k untuk satelit dan p untuk rupa bumi. z adalah tahap zum dan anda boleh menukarnya dari 1 hingga 20. Dalam URL di atas, ia ditetapkan kepada 7. Hanya masukkan mereka ke URL akhir anda dan sekarang anda mendapat borang Peta Petunjuk Peta Google yang sangat disesuaikan di tapak anda!
Mempunyai sebarang masalah dengan ini, menyiarkan komen dan saya akan cuba membantu! Nikmati!
