Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Mengehadkan Peta Google V3 kepada Kawasan Geografi dan Tahap Zum Tertentu?
Menghadkan Kawasan Boleh Lihat dan Tahap Zum dalam Peta Google V3
Pengguna mungkin menghadapi senario di mana ia menjadi perlu untuk mengehadkan Peta Google V3 dalam kawasan geografi tertentu mengehad dan mengehadkan keupayaan zumnya. Artikel ini meneroka penyelesaian untuk mengehadkan paparan peta ke kawasan yang ditetapkan (cth., negara) sambil menghalang pengguna daripada menavigasi melangkaui sempadannya. Selain itu, ia menangani cara mengehadkan tahap zum kepada julat yang telah ditetapkan.
Untuk mencapai matlamat ini, Peta Google V3 menyediakan pilihan minZoom dan maxZoom. Dengan menyatakan parameter ini, anda boleh menetapkan tahap zum minimum dan maksimum yang dibenarkan untuk pengguna.
Contoh:
var map; var opt = { minZoom: 6, maxZoom: 9 }; map = new google.maps.Map(document.getElementById('map-canvas'), opt);
Kod di atas memastikan pengguna hanya boleh zum peta dalam tahap 6 hingga 9 termasuk. Walau bagaimanapun, penyelesaian ini hanya menangani sekatan tahap zum. Untuk mengehadkan kawasan yang boleh dilihat kepada kawasan tertentu, penyesuaian lanjut diperlukan. Menyesuaikan gaya peta menggunakan StyledMaps boleh mencapai matlamat ini.
Contoh:
var map; var styles = [ { "elementType": "geometry", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.country", "elementType": "geometry.stroke", "stylers": [ { "visibility": "on" } ] } ]; map = new google.maps.Map(document.getElementById('map-canvas')); map.setOptions({ styles: styles, minZoom: 6, maxZoom: 9 });
Kod ini menetapkan semua ciri geografi di luar negara yang ditetapkan menjadi halimunan, mengehadkan dengan berkesan kawasan peta yang boleh dilihat ke negara itu. Ia juga menetapkan tahap zum minimum dan maksimum kepada 6 dan 9, masing-masing.
Atas ialah kandungan terperinci Bagaimana untuk Mengehadkan Peta Google V3 kepada Kawasan Geografi dan Tahap Zum Tertentu?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!