Bagaimana untuk Menghalang Peta Google daripada Hilang Apabila Membenamkannya dengan Bekas 100%?

Melaraskan Dimensi Bekas Peta Google untuk Paparan Optimum

Apabila membenamkan Peta Google dalam halaman web menggunakan API v3, tetapkan lebar dan ketinggian DIV bekas kepada 100% boleh menyebabkan peta hilang. Untuk menangani isu ini, adalah penting untuk memahami keperluan untuk pemaparan peta yang betul.

Masalah utama timbul daripada keperluan yang bercanggah untuk menetapkan lebar dan ketinggian kepada 100% sambil juga menggunakan jidar automatik. Untuk mencapai liputan 100% halaman, adalah penting untuk menetapkan lebar dan ketinggian bekas induk kepada 100%. Ini membolehkan bekas peta mewarisi nilai tersebut dan menduduki ruang yang diingini.

Sebagai contoh, anda perlu menambah peraturan CSS seperti berikut untuk memastikan elemen kandungan, HTML dan #kandungan mempunyai 100% lebar dan tinggi:

<code class="css">body, html {
  height: 100%;
  width: 100%;
}

div#content {
  width: 100%;
  height: 100%;
}</code>

Dengan menetapkan dimensi bekas induk, anda membuat reka letak tetap di mana bekas peta boleh mewarisi lebar dan tinggi dan dengan itu memaparkan peta dengan betul. Ingat untuk menetapkan nilai mutlak untuk lebar dan tinggi div #content untuk mengelakkan pelarasan automatik berdasarkan elemen anak.

Atas ialah kandungan terperinci Bagaimana untuk Menghalang Peta Google daripada Hilang Apabila Membenamkannya dengan Bekas 100%?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!