スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
スポンサードリンク

[ --/--/-- ] | スポンサー広告 | CM(-) | TB(-) |

FC2ブログの記事にgoogle mapを埋め込む。


FC2ブログの記事にgoogle mapを埋め込む事が出来ました。


上記のように表示させるためには、以下のように記事を投稿する。
また、記事を投稿する際には「記事の設定」で改行の扱いを"自動改行"から”HTMLタグのみ”に変更しておく。

<div id="map" style="width: 100%; height: 200px"></div>
        <script type="text/javascript"
          src="http://maps.google.com/maps/api/js?sensor=false"></script>
        <script type="text/javascript">
          function initialize() {
           var latlng = new google.maps.LatLng(35.70357644712903,139.57907795906067);
           var opts = {
             zoom: 15,
             center: latlng,
             mapTypeId: google.maps.MapTypeId.ROADMAP
           };
           var map = new google.maps.Map(document.getElementById("map"), opts);
           var m_latlng = new google.maps.LatLng(35.70357644712903,139.57907795906067);
           var marker = new google.maps.Marker({
           position: m_latlng,
           map: map
           });
          }
        </script>
        <script type="text/javascript">
           window.onload = function () {
                initialize();
            }
        </script>

上記のパラメータについては、下記のサイトで詳しく説明されており参考にさせて頂いた。感謝!!

■「Google Maps JavaScript API v3」の各パラメータについて
 ・Google Maps APIを使ったページの基本構成
 ・Google Maps JavaScript API v3
■onloadイベントを外部javascriptファイルに記述する方法について
 ・bodyタグでのonloadイベントを外部Scriptファイルに記述する方法
■FC2ブログの仕様について
 ・FC2ブログでJavaScriptが動作しない件について
関連記事
スポンサードリンク

[ 2013/04/23 ] | Blog Custom | Comment(0) | Trackback(0) |

コメントの投稿













管理者にだけ表示を許可する

トラックバック

この記事のトラックバックURL
http://tacafe777.blog65.fc2.com/tb.php/191-45659319











上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。