デジットさんの生活便利サイトトップへ デジットさんのGoogle Maps APIの利用(PHP)

トップページ > ホームページ作成 > Google Maps API

PHPを使った自分のホームページに地図を表示する方法です。GoogleMapAPIを利用したサンプルを説明します。

Google Maps APIとは

GoogleMapAPIは、無料で自分のホームページの中に地図を組み込めます。地図をドラッグできたり航空写真に切り替えたり出来、直感的なインターフェースを持っています。JavaScript APIで、利用します。
利用規約は、Google Maps API Terms of Useにありますので、正確にはこちらを確認してください。一日に50万ページ以上のアクセスがあるサイトでは、Googleに相談して欲しいとのことです。

Google Maps APIのキー入手

「Google Maps API」を利用するには、ホームページごとに一つずつのキーが必要です。デバック用にローカルホストを使用する場合も、ローカルホスト用(http://localhost/)のキーが必要です。キーは、使用するドメイン名を入力すれば直ぐに取得できます。Google Maps APIのページの「Sign up for a Google Maps API key」をクリックすれば、キーを入手できるページに移行します。

Google Maps APIを利用する準備

Google Maps APIを使用する手順です。ここでは、Google Maps APIをPHPで利用できるライブラリを使用します。

必要なライブラリ

ここでは、次のライブラリを使用します。インストールされていない場合は、事前にインストールをお願いまします。PEARのインストールは、PEARインストールをご覧下さい。

  1. PEAR MDクラス
     ライブラリ「Google Map APIクラス」から使用します。私は、「Google Map APIクラス」の中を変更して、「PEAR MDB2クラス」の方を使用しました。変更に自信のない方は、「PEAR MDクラス」のまま利用ください。
  2. PEAR Cache_Liteクラス
    取得した地図の表示用データのキャッシュ用です。キャッシュ用のディレクトリを作っておきます。今回は、「cache/geocodes/」としました。ディレクトリの属性は「757」としました。
  3. ライブラリ「Google Map APIクラス」
    PHPで「Google Map API」のJavaScriptを生成してくれるライブラリーです。ライセンスは、フリーソフトのLGPLです。参考書には、日本語対応の変更が必要と書いてあるものもありますが、Google Maps APIは、日本語の住所でも検索できるようになりましたので、このまま日本語の住所が利用できます。PHP GoogleMapAPI by Monte Ohrtからダウンロードします。解凍したファイルを、公開するサーバーのどこかに自分の好きなディレクトリ名を作りアップロードします。ここでは、「GoogleMapAPI」というディレクトリ名にします。上記ディレクトリ「cache」と同じ階層にしました。
  4. MySQLで利用するデータベース
    一度検索した住所の緯度経度をデータベースにキャッシュしておきます。「Google Map APIクラス」の中から利用します。データベースMySQLにテーブル名「GEOCODES」を作り、3つのキーを作成しておきます。「address」varchar(255) NOT NULL default、「lon」float default NULL、「lat」float default NULL、「address」はPRIMARY KEYにします。

ライブラリ「Google Map APIクラス」の変更

ダウンロードした「Google Map APIクラス」の中の実行ファイル「GoogleMapAPI.class.php」の、「 * return map header javascript (goes between <head></head>)」のつぎにある"maps.google.com"3箇所を"maps.google.co.jp"に変更します。これは、地図の表示をより日本語対応に適応しやすくするためです。自信のない方は、変更しなくとも地図は表示するようです。
私の様に、「PEAR MDクラス」ではなく「PEAR MDB2クラス」を利用したい人は、「DB」表記の所を、「MDB2」に変更します。「INSERT」や「SELECT」のところも、「MDB2」用に変更する必要があります。

Google Maps APIを利用する手順

今回は、「Google Map」を自分のホームページの好きな位置にはめ込めるようにしました。実行ファイルからは、住所と画面サイズ・地図のズーム値を指定して、<head></head>に挿入する「JavaScriptの文」と<body></body>の好きな所に置ける「地図用データ」を取得できるようにしました。
用意したサンプルは、次のとおりです。

  1. 自分用カスタマイズ「GoogleMapAPI_setup.php」
    「GoogleMapAPI.class.php」の自分用カスタマイズです。「GoogleMapAPI_setup.php」と同じディレクトリに置きます。
  2. インクルード用「googlemaps_include.php」
    実行ファイルにインクルードして利用します。この中で、地図データのキャッシュと「GoogleMapAPI_setup.php」に住所などを引き渡し結果をもらいます。「GoogleMapAPI_setup.php」と同じディレクトリに置きました。
  3. 実行ファイル「googlemaps_index.php」
    今回の例では、「GoogleMapAPI」と同じ深さのディレクトリに置いています。
    すなわち
    ― ― GoogleMapAPI   ― GoogleMapAPI.class.php
     |             GoogleMapAPI_setup.php
     |             googlemaps_include.php
      ― 実行用ディレクトリ  ― googlemaps_index.php
    というディレクト及びリファイル位置です。

Google Maps APIのサンプルリスト

サンプルリストは次の通りです。

自分用カスタマイズ「GoogleMapAPI_setup.php」

取得した「Google Maps API key」の定義や、自分が使いやすいようにカスタマイズしたくラスにしました。よく変更しそうな、$shght='地図の高さpix'、$swdth='地図の幅pix'、$szoom='ズーム値'は引数にして、変更しやすくしてみました。

<?php
//Google Mapsのカスタマイズファイル
//$shght='地図の高さpix';$swdth='地図の幅pix';$szoom='ズーム値'
//Google Maps環境の初期化ファイル
require_once( 'GoogleMapAPI.class.php');
class GoogleMapAPI_GuestBook extends GoogleMapAPI {
var $api_key; //APIキー変数定義
function GoogleMapAPI_GuestBook($shght="300",$swdth="450",$szoom="15")
{
$this->api_key = 'ここに取得したGoogle Maps API keyを入力';
$this->GoogleMapAPI();
//取得した座標をデータベースにキャッシュする設定(PEAR::DB又はPEAR::MDB2)
//(1)DBユーザ名 (2)DBパスワード (3)DBホスト名 (4)データベース名
$this -> setDSN('mysql://(1):(2)@(3)/(4)');//自分用に設定する
//Google MapsのAPIキー設定
$this -> setAPIKey($this->api_key);
//地図の表示サイズ
$this -> setHeight($shght.'px');
$this -> setWidth($swdth.'px');
//地図のコントローラ表示
$this -> enableMapControls();
//最初の拡大レベルを手動設定
$this -> setZoomLevel($szoom);
$this -> disableZoomEncompass();
//マーカーの平均座標から自動設定したいとき
//$map -> enableZoomEncompass();
//エラーメッセージ
$this -> setBrowserAlert(
'このブラウザでは地図を表示できません。IE6.0以降かFirefox1.0以降をお奨めします。');
$this -> setJSAlert(
'Javascriptを有効にしないと、地図が表示できません。');
//詳細をマウスオーバーで表示させる
$this -> setInfoWindowTrigger('mouseover');//クリック表示は'mouseclick'
//米国の道案内は使用しない
$this -> disableDirections();
}
}
?>

インクルード用「googlemaps_include.php」

地図を表示したい実行ファイルにインクルードしてつかえる汎用ファイルです。キャッシュデータがある場合はキャッシュデータを使い、キャッシュデータがない場合は「Google Maps API」からデータを取得します。
実行ファイルの相対アドレスの階層(etc. ../../)を変数「$real_src」に、地図データをキャッシュするIDの変数「$cache_id」、表示したい住所を配列「$map」、地図のカスタマイズ用の変数$shght="地図の高さ(px)";$swdth="地図の幅(px)"をインクルードする前に定義します。
実行ファイルがカレントのディレクトリ「/www/abc/」で、キャッシュ用のディレクトリが「www/cache/geocodes/」なら、「cache/geocodes/」とかいておきます。この場合、変数「$real_src」には、相対アドレス用の「../」を代入します。
結果は、「$cache_data1」に地図のheader用JavaScriptを「$cache_data2」に地図用データ、「$cache_data3」にサイド用の文字データを入力します。

<?php
//Google Mapsheadデータと画像を分けてインクルード(extends GoogleMapAPI利用)
//入力;$real_src="相対アドレス"(etc. ../../)
// $cache_id'キャッシュ用ID', 住所用の配列$map
// $shght="地図の高さ(px)";$swdth="地図の幅(px)"
//出力:$cache_data1;header用、$cache_data2;地図用、$cache_data3;サイドデータ

//キャッシュの設定
$cache_period = 24*3600;
//キャッシュライブラリ
$result = include_once 'Cache/Lite.php';
if ( $result === false ){
echo 'PEAR Cacheライブラリが呼び出せません';
exit();
}
$options = array(
'cacheDir' => $real_src."cache/geocodes/" ,//キャッシュ保存先ディレクトリ(自分用に書き換える)
'lifeTime' => $cache_period ,//キャッシュ時間
);
$cache_lite = new Cache_Lite( $options );
$cache_id1 = $cache_id.'1';//header用キャッシュ
$cache_id2 = $cache_id.'2';//地図データ用キャッシュ
$cache_id3 = $cache_id.'3';//サイド用キャッシュ
$cache_data1 = $cache_lite -> get($cache_id1);//header用データー
$cache_data2 = $cache_lite -> get($cache_id2);//地図データ用データー
$cache_data3 = $cache_lite -> get($cache_id3);//サイド用データー
//キャッシュが有効でない時
if (!($cache_data1 and $cache_data2 and $cache_data3)){
//ここから自分用Google Maps_GuestBookの処理
require_once( $real_src."GoogleMapAPI/GoogleMapAPI_setup.php");

//GoogleMapの条件設定
$map = new GoogleMapAPI_GuestBook($shght,$swdth,$szoom);

//地点のマーカーを追加する
while ( list(, $value) = each($markaddress)) {
$map -> addMarkerBYAddress(
$value[0],
$value[1],
$value[2]
);
}
//出力内容を、変数に書き出す printではなくgetを使う
$cache_data1 = ($map -> getHeaderJS()). "\n" .($map -> getMapJS());
$cache_data2 = $map -> getMap() ;
$cache_data3 = $map -> getSidebar();
//キャッシュに保存
$cache_lite -> save($cache_data1,$cache_id1);
$cache_lite -> save($cache_data2,$cache_id2);
$cache_lite -> save($cache_data3,$cache_id3);
}
?>

実行ファイル「googlemaps_index.php」

地図を表示する実行ファイルです。赤字のところが表示するサイズや住所の設定です。
結果の地図データは、<?php echo $cache_data1; ?>のところに挿入されます。

<?php
//Google Mapsの画像を好きなところに置ける汎用サンプル
//このファイルの相対アドレス
$real_src = "../";
//汎用Google Mapsを呼ぶ設定
//キャッシュ用
$cache_id = 'my_map';//地図ごとに違うIDにする
$shght="400";//地図の高さ(px)設定デフォルト"300"
$swdth="500";//地図の幅(px)設定デフォルト"450"
$szoom="13";//ズーム値 設定デフォルト"15"
//表示地点、マーカー
$markaddress = array(
array(
'東京都杉並区高井戸西2-3-45',
"美しの湯",
"<a href=\"http://digit-01.com/spa/spa_utsukushi.html \">美しの湯</a>"
),
array(
'東京都武蔵野市御殿山1-18-31',
" 井の頭恩賜公園 ",
"<a href=\"http://www.kensetsu.metro.tokyo.jp/seibuk/inokashira/ \">井の頭恩賜公園</a>"
)
);

//汎用Google Mapsをインクルード
include ($real_src. "GoogleMapAPI/googlemaps_include.php");
?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<?php echo $cache_data1; ?>
<title>Google Maps API サンプル</title>
</head>
<body onload = "onLoad()">
<h3>Google Maps API サンプル</h3>
<p>
<?php echo $cache_data2; ?>
<?php echo $cache_data3; ?>
</p>
</body>
</html>

GoogleMapAPIの動作サンプル

これで、自分のホームページに地図をはめ込めるようになりました。動作サンプルは、Google Maps API サンプルにあります。
レンタルサーバーのロリポップでは、動作確認できています。

ホームページを公開するレンタルサーバーは、 ロリポップ! がお薦め、 PHP5を使うならPHP5から選ぼう。

関連ページ

ホームページ作成

PHP5を使う

アフィリエイトをする

HP作成を作成する

デジットさんのホームページ入門に移行中

スポンサード リンク

Amazon.co.jpアソシエイト:
PHP&プログラミング

売れている順 新刊順

:%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%20php :php2_  :10

とことん!ホームページホームページ入門役立つサイトデジットさんのリストラ日記仮福真琴の精神科医はうそだらけ

2005-2010 Copyright © Digit-01 All Rights Reserved.