GoogleMapAPI/API1
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
]
開始行:
*API1(基本表示) [#h532fb6b]
RIGHT:更新日&lastmod();
**中心座標の設定 [#x8a8ce83]
map.setCenter(new GLatLng([緯度],[経度]),[倍率])~
倍率：０−１９ （最小 − 最大)
map.setCenter(new GLatLng(34.560709164214195, 136.653699...
**拡大縮小のコントロール/衛星写真地図切り替えボタンの挿入...
''拡大縮小のコントロール''
map.addControl(new GLargeMapControl());
''衛星写真地図切り替えボタン''
map.addControl(new GMapTypeControl());
**マーカーの表示 [#h974cc9b]
var mp = new GLatLng(34.560709164214195,136.653699874877...
var marker = new GMarker(mp);
map.openInfoWindowHtml(mp,
"<center><B>山田 太郎</B></center><BR><Font size =\...
map.addOverlay(marker);
openInfoWindowHtmlで吹き出しにHTML形式で表示
**住所で表示 [#ge6cf0d2]
GClientGeocoderを初期化してgetLatLngメソッドで以下のよう...
geocoder = new GClientGeocoder();
geocoder.getLatLng(
address,
function(point){
(処理)
}
**Sampleプログラム [#b0ab23f9]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; ...
<title>Google Maps JavaScript API TSET</title>
<script src="http://maps.google.co.jp/ maps?file=api...
key=(API Key)"
type="text/javascript"></script>
</head>
<body>
<H2>Google Map API の試験 <H2>
<div id="map" style="width: 800px; height: 600px"></...
<script type="text/javascript">
//<![CDATA[
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map...
/* 拡大縮小のコントロールを追加 */
map.addControl(new GLargeMapControl());
/* 衛星写真地図切り替えボタン */
map.addControl(new GMapTypeControl());
/*住所ではなく緯度、経度で中心座標をセットするとき*/
/* map.setCenter(new GLatLng(34.560709164214195,1...
// GClientGeocoderを初期化
geocoder = new GClientGeocoder();
var address = "三重県松阪市久保町";
geocoder.getLatLng(
address,
function(point){
if (!point) {
alert("Adress not found");
}else{
/*中心座標をセット*/
map.setCenter(point, 13);
/* マーカの追加 */
var marker = new GMarker...
map.addOverlay(marker);
marker.openInfoWindowHtm...
}
}
);
}
//]]>
</script>
</body>
</html>
終了行:
*API1(基本表示) [#h532fb6b]
RIGHT:更新日&lastmod();
**中心座標の設定 [#x8a8ce83]
map.setCenter(new GLatLng([緯度],[経度]),[倍率])~
倍率：０−１９ （最小 − 最大)
map.setCenter(new GLatLng(34.560709164214195, 136.653699...
**拡大縮小のコントロール/衛星写真地図切り替えボタンの挿入...
''拡大縮小のコントロール''
map.addControl(new GLargeMapControl());
''衛星写真地図切り替えボタン''
map.addControl(new GMapTypeControl());
**マーカーの表示 [#h974cc9b]
var mp = new GLatLng(34.560709164214195,136.653699874877...
var marker = new GMarker(mp);
map.openInfoWindowHtml(mp,
"<center><B>山田 太郎</B></center><BR><Font size =\...
map.addOverlay(marker);
openInfoWindowHtmlで吹き出しにHTML形式で表示
**住所で表示 [#ge6cf0d2]
GClientGeocoderを初期化してgetLatLngメソッドで以下のよう...
geocoder = new GClientGeocoder();
geocoder.getLatLng(
address,
function(point){
(処理)
}
**Sampleプログラム [#b0ab23f9]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; ...
<title>Google Maps JavaScript API TSET</title>
<script src="http://maps.google.co.jp/ maps?file=api...
key=(API Key)"
type="text/javascript"></script>
</head>
<body>
<H2>Google Map API の試験 <H2>
<div id="map" style="width: 800px; height: 600px"></...
<script type="text/javascript">
//<![CDATA[
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map...
/* 拡大縮小のコントロールを追加 */
map.addControl(new GLargeMapControl());
/* 衛星写真地図切り替えボタン */
map.addControl(new GMapTypeControl());
/*住所ではなく緯度、経度で中心座標をセットするとき*/
/* map.setCenter(new GLatLng(34.560709164214195,1...
// GClientGeocoderを初期化
geocoder = new GClientGeocoder();
var address = "三重県松阪市久保町";
geocoder.getLatLng(
address,
function(point){
if (!point) {
alert("Adress not found");
}else{
/*中心座標をセット*/
map.setCenter(point, 13);
/* マーカの追加 */
var marker = new GMarker...
map.addOverlay(marker);
marker.openInfoWindowHtm...
}
}
);
}
//]]>
</script>
</body>
</html>
ページ名:
![[PukiWiki]](image/../localimages/Atom.gif "[PukiWiki]")
