Google Maps簡単作成ツール:GMapCreator
Google MAPS APIを使ったプログラムを簡単に作るツールを作ってみました。 目標はJavascriptなどが全くわからない人でも簡単にGoogle mapをブログやホームページに貼り付けられる事です。
左クリックでマーカを設置、もしくは開始位置を設定できます。 マーカを左クリックすればマーカ画像を変更したり、マーカをクリックした際にジャンプするURLを設定したりできます。
徐々に機能を充実させていく予定です。 Bug Report、機能追加要求、解りにくい、などご意見は大歓迎します。 ご意見はこちらへお願いします。
Google Maps API keyを入力しないでOKを押してもコードは生成されます。 ホームページに貼り付けるときには、HTMLコード中の「key=」部分に手動で取得したAPIキーを入力してください。
貼り付け用IFRAMEコード
Blogなどに貼り付ける場合には以下のIFRAMEを利用すると楽です。 「YOURFILENAME.HTML」の部分を、ここで生成したHTMLファイルの名前に変更してご利用下さい。
Google Maps API HTMLコード
Google maps apiを使ったHTMLページです。 前述したIFRAMEと併用すると楽です。 必要に応じて改変してください。
Gooleへのサインアップ
Google mapsを自サイトで使うには、Googleに登録をする必要があります。 オンラインサインアップ(無料)の方法に関してまとめてみましたので、サインアップがまだの方はこちらをご覧下さい。 サインアップをしない状態で生成されたコードを実行するとJavascriptがエラーメッセージを出力して正常動作しません。 サインアップをしないでGMapCreatorを試すことも可能です。 キーを聞かれても気にせずOKを押してください。 ただし、正しいキーを入れないでOKを押した場合には手元でHTMLを直接修正してGoogle maps keyの値を入れてください。
使い方
HTMLコードを出力したいと思ったところで、google map窓の下にある「コード生成」ボタンを押してください。 「コード生成」ボタンを押すとIFRAMEのHTMLと、Javascriptが書かれた本体の2つのHTMLが出てきます。 IFRAMEの方は使っても使わなくても大丈夫ですが、大抵使った方が楽だと思います。
色々改造してみたいと思う方のためにGoogle maps apiの解説を書いてみました。 生成されたjavascriptを改造してみようと思う方は、こちらもご覧下さい。