V2を使うと、好きな場所の地図を表示するURLを発行できます。Map」を表示できます。会社やイベント会場への案内を簡単に、わかりやすく作成できます。これはJavascripsのように複雑なものではなく、ただ1行のURLを発行するだけなので初心者でも扱いやすいことが魅力です。発行手順は次のようになります。APIを使ううえで強く推奨されています。KEYを取得すると、使用した地図に関する統計情報を把握できます。発行した地図には使用制限(1日あたり25000回のリクエスト)が決まっており、現在のリクエスト回数なども把握できるようになります。詳しい情報はこちらをご覧ください。KEYの取得手順は、まずGoogleのデベロッパーコンソールにアクセスし、新しくプロジェクトを作成します。アクセス」より「新しいキーを作成」をクリックします。キーの種類を選択します。ここではウェブサイトに地図を表示する場合を想定し、「ブラウザキー」を選択します。続いて許可対象のリファラーを設定します。これは、自分のAPIキーを使って地図を呼び出せるホストのことです。以外のウェブサイトでこのAPIキーを使って地図を呼び出すことはできなくなります。他のサイトで勝手にAPIキーを使われることを防ぐような措置です。空白のままにしておけば全てのサイトで使えますので、動作確認や練習の場合は空白のままで良いでしょう。KEYが発行されました。続いて左側のメニューから「API」を選択します。API」を選択します。項目が見当たらない場合は「もっと見る」をクリックして展開してください。「APIを有効にする」をクリックします。APIが有効になりました。念のため確認しておきたい場合、以下のURLにアクセスしてみましょう。KEYを追記してください。KEY地図が表示されればokです。Mapをサイトに表示することができます。GIFなどの画像となるため動作も軽いはずですが、Javascripsを使った埋込み型のように動かすことはできません。以下に載せる基本部分に様々なパラメータを指定することで地図を装飾します。以降にパラメータを追加していくわけですが、ここにもルールがあります。使うこの他にもオプションとして指定できるエレメントがあります。簡単に、「東京駅周辺」の地図を作ってみます。https://maps.googleapis.com/maps/api/staticmap?center=35.681382,139.766084&size=640×480&zoom=15このURLをブラウザで表示すると東京駅周辺の地図が出てくるはずです。今回作成したURLには3つのパラメータを指定しています。これが、表示する地図の「中心座標」です。上記では東京駅の座標を入れているわけです。これが、表示する地図の「大きさ」です。横縦の順に、半角のx(エックス)で区切って表記します。上記では640x480pxとしています。これが、表示する地図の「ズームレベル」です。上記では15としています。サイズと相談して適当な値を探します。基本的にはこの3つのパラメータを指定すれば目的の地図を作れますが、もうちょっと見る人に親切な地図としたい場合は他のパラメータも繋げられます。Mapで簡単に調べられます。Mapにアクセスし、目的地を検索して表示します。すると「現在の中心座標」がURLに表示されています。「東京駅」などすぐに検索できる場合はこの時点で座標をコピーすれば良いですが、会社の入っているビルなどの場合は検索しても出てこないことがあります。​そういう時はまず周辺を表示し、対象の建物部分をクリックします。Mapが認識する中心座標がそちらに移るので、その後で座標をコピーします。Mapのマーカーを設置しました。markersも細かく装飾可能で、次の種類があります。markersプロパティに座標を指定する場合、値だけを入力します(centerのようなプロパティ名はつけません)。区切ることで、1枚の地図内に複数のマーカーを設置可能です。地図内に表示するマーカーの大きさを指定できます。値は3つあり、指定しない時は「nomal」と認識されます。markersには24ビットのカラーコードを設定可能で、RGBコードを用いて指定できます。特定の色はキーワードですぐに指定もできます。マーカー内に0~9もしくはA~Zのうち好きなものを1文字だけ挿入できます。アルファベットは大文字である必要があり、マーカーのサイズが「small」「tiny」の場合は挿入できません。マップ内にルートを表示するイベント会場や会社案内資料として掲載する場合、最寄り駅から目的地までの経路(ルート)を地図に表示できたら便利ですよね。使うことで、地図内に任意の直線を引くことができます。プロパティもマーカーと同じで座標を複数置くことができます。複数指定した場合、その座標と座標の間が直線で結ばれるため、道順を記すのに適しています。https://maps.googleapis.com/maps/api/staticmap?center=35.5095541,139.6179989&size=1280×640&zoom=16&path=color:blue|35.507456,139.617585|35.508098,%20139.616759|35.508491,%20139.617242|35.508753,%20139.617285|35.511108,%20139.620146|35.511471,%20139.620024こちらは新横浜駅から横浜アリーナまでの道順を記した地図です。出発地点と目的地の中間とするのが望ましい●目的地まで近く、ズームレベルを上げる場合は道のどっち側を進むか、どの交差点を渡るかなどを詳しく記すと親切などの工夫があると良いでしょう。会場への案内地図などの場合駅をスタートとすることが多く、スタート地点を中心に持ってきたいこともあるかと思います。プロパティを使えば自動的に最適な状態を作ってくれます。目的地の座標をセットします。決まっている地図の範囲に出発地点と目的地が両方入る最適のズームレベルを自動的に決めてくれます。Mapを表示すると、解像度が足りずぼやけてしまうことがあります。https://maps.googleapis.com/maps/api/staticmap?center=35.681382,139.766084&size=240×240&zoom=14これは240×240という小さな地図です。追加すると、地図が2倍に引き伸ばされます。https://maps.googleapis.com/maps/api/staticmap?center=35.681382,139.766084&size=240×240&zoom=14&scale=2こちらは480×480で表示されるはずです。表示してみるとわかりますが、240×240と480×480で地図内に表示されるものは全く一緒です。プロパティは「拡大」操作を行えるものです。表示された地図から余計な情報を省く都心部などかなりゴチャゴチャしており、そのまま表示すると道路や線路、建物などが密集していてわかりにくいことがあります。モバイル環境を考えて小さい地図を置きたい場合はなお深刻となることも考えられるため、できるだけシンプルな地図としたいこともあるかと思います。