MAP EDIT SERVICE for Google Maps V3ver 1.0.0

サービス概要

▲編集画面イメージ
  • Google Maps API の Google Maps JavaScript API V3、Google Maps Static Maps APIを簡単に設定するマップエディタです。設定したファイルや画像をダウンロードできます。
  • 所在地からマーカー座標を割り出します。
  • マーカー位置の微調整やルート表示の登録など細かい設定が可能です。

  • ▲出力されたHTMLをカスタマイズした例 Google Maps JavaScript API V3(以降:JavaScript API V3と表記)のマップが適用されたHTMLファイルをダウンロードできます。JavaScript API V3はGoogleが提供する地図サービスで、地図をダイナミックに操作させる場合に適しています。本サービスで発行するHTMLファイルは、表示に必要なjavascriptソースとcssが埋め込まれたファイルですので、ダウンロードした後、お好みのページデザインにカスタマイズするなどしてご利用いただけます。

  • Google Maps Static Maps API(以降:Static Maps APIと表記)のURLを生成します。Static Maps APIはGoogleが提供する地図サービスで、地図を静止画像として扱う場合に適しています。発行されたソースをコピーしてご自身のホームページのHTMLソースコードに追記してご利用いただけます。

  • 必ずご注意事項とお願いご利用規約をご覧の上ご利用ください。

サービスのご利用はこちらから

動作環境について

  • ご使用ブラウザは、最新のものをご利用ください。動作チェックは、Google Chromeで行っております。
  • Javascriptを使用しております。Javascriptをオフに設定している場合は、ご利用できません。

マップエディタの基本操作

操作画面の配置

地図表示方法(図-A)

  1. 郵便番号を入力します。
  2. 表示された住所情報に番地を追記して『検索』ボタンを押してください。地図が表示されます。

マーカーの表示位置の修正(図-D)

  1. 地図の上をクリックするとマーカーの位置が変わります。正しい位置をクリックしてください。
  2. クリックした位置にマーカーが表示されます。この時クリックした位置が自動的に地図の中央となります。

最寄駅の表示(図-E)

  1. 基本設定、詳細設定が終わった後に 表示/非表示 を切り替えてください。最寄駅を検索します。(最寄駅ルートの候補は地図の大きさ等、他の設定を変更するとクリアされる場合があります。その際は、表示/非表示を再度切り替え直してください。再検索します。)
  2. 検索結果は下の『最寄駅ルート』欄にリストアップされます。(リストアップ内の最寄駅をクリックしてお試しください。マーカーまでのポリラインが表示されるようになります。)
  • 徒歩ルート表示の機能追加について
    最寄駅の表示登録すると、表示テストの地図、出力したHTMLファイルの地図に徒歩ルート表示の機能が追加されます。
    これによりクリックポイントからマーカーまでの徒歩ルートのポリラインが表示されるようになります。

JavaScript API V3 HTML出力(図-F)

  1. 基本設定、詳細設定が終わった後に、『表示テスト』ボタンでテストを行ってください。
  2. 問題なければ『ファイルダウンロードボタン』を押してください。
    HTMLファイルがダウンロードされます。ダウンロードした後、お好みのページデザインにカスタマイズするなどしてご利用いただけます。

  • ダウンロードされるHTMLのフォーマットについて
    HTML形式、文字コードはutf-8です。(XHTML形式ではありません。)

Static Maps API URL出力(画像マップ)(図-G)

  1. 基本設定、詳細設定が終わった後に『URLを作成』ボタンを押してください。
    『スタティックマップを別ウィンドウで表示』のリンクと、Static Maps APIのURLが設定されたimgタグが発行されます。
    『スタティックマップを別ウィンドウで表示』のリンクからテストを行ってください。
  2. 問題なければ発行されたソースをコピーしてご自身のホームページのHTMLソースコードに追記してご利用いただけます。

  • リクエストできる地図サイズ大きさについて
    Static Maps API利用の場合は、[地図サイズ]縦横ともに640pxが最大です。

基本設定(図-B)

地図の初期表示の状態や操作の仕様を設定します。

[ズーム]

22段階で設定できます。レベルが大きいほど「寄り」、小さいほど「引き」です。(表示された地図のズームと連動していますので、地図側の拡大縮小操作でも設定可能です。)

[地図サイズ]

表示する地図の大きさをピクセル寸法で変更できます。
入力後『リサイズ』ボタンが表示されるのでクリックすると表示サイズが変わります。
※Static Maps API利用の場合は縦横ともに 640 以内を指定してください。Static Maps APIは縦横ともに640pxが最大値です。これ以上の数値を指定しても取得できる画像の大きさは640pxの画像となります。

[マーカーの表示]

マーカーの表示を 表示/非表示 で切り替えられます。
例えば、地図のみを表示したい場合は 非表示 を選択してください。
(マーカーが 非表示 の場合はマーカーツールチップ、情報ウィンドウは表示されません。)

[マーカーツールチップの表示内容]

マーカーツールチップはマーカーにカーソールを重ねると表示されるツールチップです。ここではツールチップで表示されるテキストを登録させることができます。
(マーカーが 非表示 の場合または、テキストが空の場合は ツールチップ は表示されません。)

[情報ウィンドウの表示]

情報ウィンドウは、マーカーツールチップより多くの情報を表示できる吹き出し状のウィンドウで、情報ウィンドウの挙動を 非表示/初めから表示/クリックで表示 の3パターンで登録させることができます。
(マーカーが 非表示 の場合または、情報ウィンドウの表示内容のテキスト内容が空の場合は 情報ウィンドウ は表示されません。)

[情報ウィンドウの表示内容]

情報ウィンドウで表示されるテキストを登録させることができます。
(マーカーが 非表示 の場合または、情報ウィンドウの表示で 非表示 を選択された場合は表示されません。)

詳細設定(図-C)

JavaScript API V3のナビゲーションの設定を行います。

[マップタイプの選択]

地図の表示形式を 道路地図/航空写真/道路地図+航空写真/地形情報に基づいた地図 の4種類から選択できます。
デフォルトは「道路地図」です。

[ナビゲーションコントロールの表示/非表示]

ズームやパン操作のナビゲーションの 表示/非表示 を選択できます。
デフォルトは「表示」です。

[ナビゲーションコントロール表示形式]

標準表示/簡略表示を選択できます。
簡略表示ではズームスライダが閉じて「+」「-」ボタンで操作するナビゲーションになります。
デフォルトは「標準表示」です。

[ナビゲーションコントロール表示位置]

ナビゲーションの配置を選択できます。
デフォルトは「左上段」です。

[マップタイプコントロールの表示/非表示]

マップタイプを切り換えるボタンの 表示/非表示 を選択できます。
デフォルトは「表示」です。

[マップタイプコントロール表示形式]

標準表示/ドロップダウン表示 を選択できます。
ドロップダウン表示では文字通りマップタイプの切り替えボタンがドロップダウン形式になります。
デフォルトは「標準表示」です。

[マップタイプコントロール表示位置]

マップタイプを切り換えるボタンの配置を選択できます。
デフォルトは「右上段」です。

[地図スケールの表示/非表示]

地図スケールの 表示/非表示 を選択できます。
デフォルトは「表示」です。

[地図スケール表示位置]

地図スケールの配置を選択できます。
デフォルトは「左下段」です。

ご注意事項とお願い

  • 必ずご利用規約をお読みいただき、同意の上ご利用ください。
  • 内容及び動作、仕様、サービス自体の提供について予告なしに変更、または中止する場合がございます。
  • 本サービスはネットワーク状況やメンテナンスその他の要因により、一時機能しない場合がございます。
  • 本サービスは設定された内容をサーバに保持・保存いたしておりません。

ご利用規約

  • 著作権は、「IW3 PROJECT」が保有します。
  • 当サイトのサービスを利用した時点で当規約に同意したものとみなします。
  • 個人・法人・商用・非商用問わず無料でご利用可能です。
  • 各種コンテンツ等の無断転用を禁じます。
  • 本サービスの使用又は使用不能から生じるお客様の損害について、当社は一切の責任を負いません。
  • 管理人が不適当と判断した場合、設置・利用・公開を中止していただく場合があります。
  • このページの内容(著作権・免責事項・その他)は変更する場合があります。