SHERBETS|SHERBETS


Googleマップをレスポンシブ対応させ、ピンを中心に表示

Googleマップをレスポンシブ対応させ、ピンを中心に表示させる方法の備忘録です。

○ Googleマップをレスポンシブ対応させ、ピンを中心に表示

  1. 下記HTMLを実装。
  2. iframeは書かずに空のdivで表示させます。
    外部スクリプトと専用のスクリプトをbodyの最後に記述します。
    google.maps.LatLngに表示する地図の緯度と経度を記述します。
    zoomはデフォルトのズームレベルです。
    contentStringはピンをクリックした時に表示するラベルです。住所などを記入します。

  3. 下記CSSを実装。

    地図の高さはpadding-topの値で調整します。

参考にした記事はこちら

にほんブログ村 ゲームブログへ



○ コメントを投稿する

▲TOP