0

img が max-width に設定されている場合、Google マップで場所を中央に配置する際に問題が発生します。置くことである解決策があります

#map_canvas img {
max-width: none;
}

ただし、Javascript API を使用していないため、これは機能しないようです。そのため、map_canvas がないようです。私は単にiFrameを使って埋め込んでいます。

iframe の周りに div を追加してパラメーターを設定しようとすると、同じ結果が得られます。

Google マップの iframe を適切に再生するには、何を記述/追加すればよいかわかりません。

4

1 に答える 1

0

iframe を使用しているインタラクティブ マップまたは iframe を使用している静的な Google マップ イメージを使用していますか?

iframe を使用してインタラクティブな Google マップを使用している場合は、マップ変数内で「center」プロパティを宣言する必要があります。残念ながら、マップはページの初期ロードが行われたときにのみ中央に配置されます。つまり、ページを大きな解像度でロードしてから縮小すると、マップが作成されたときに中央が定義されていたため、マップの中心がずれます。別の場所 (より小さな解像度で更新すると、これが修正されます。)

インタラクティブな Google マップの場合

// Google Maps
var map;
function initialize() {
    var mapOptions = {
        zoom: 17,
        draggable: true,
        center: new google.maps.LatLng(38.913914,-94.637427), // this one
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };


静的な Google マップ画像の場合

イメージ src を宣言するときは、次のようになります。

<img src="maps.googleapis.com/maps/api/staticmap?center=46168&zoom=11
&size=300×300&maptype=roadmap&sensor=false" alt="google map" />

いくつかの値を変更するだけで、このマップを好きな場所に配置できます。

センタリング オプション

  • 市/州: プレーンフィールド、IN
  • 郵便番号: 46168
  • 住所: 1917 Hawthorn Drive, Plainfield, IN
  • 緯度: 39.77、-86.16
于 2013-04-10T15:10:26.323 に答える