Googleマップを100％コンテナに埋め込むときに消えないようにするにはどうすればよいですか？

最適な表示のための Google マップ コンテナのサイズの調整

API v3 を使用して Web ページに Google マップを埋め込む場合、コンテナ DIV の幅と高さを 100% に設定します地図が消える可能性があります。この問題に対処するには、適切なマップ レンダリングの要件を理解することが不可欠です。

主な問題は、自動マージンを使用しながら幅と高さを 100% に設定するという矛盾する要件から発生します。ページの 100% カバレッジを達成するには、親コンテナの幅と高さを 100% に設定することが重要です。これにより、マップ コンテナがこれらの値を継承し、必要なスペースを占有することができます。

たとえば、body、HTML、#content 要素のコンテンツが 100% であることを確認するには、次のような CSS ルールを追加する必要があります。幅と高さ:

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

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

親コンテナの寸法を設定すると、マップ コンテナが幅と高さを継承できる固定レイアウトが作成され、マップが適切に表示されます。子要素に基づいた自動調整を避けるために、#content div の幅と高さには必ず絶対値を設定してください。

以上がGoogleマップを100％コンテナに埋め込むときに消えないようにするにはどうすればよいですか？の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。