GoogleMapAPI/API4
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
]
開始行:
*API3(吹き出しにタグをつける) [#qd87a4c1]
RIGHT:更新日&lastmod();
**吹き出しにタグをつける [#sac2851f]
''タブの設定''
var infoTabs = [
new GInfoWindowTab("Tab #1", "<p><b>２ページ目</b>...
new GInfoWindowTab("Tab #2", "<p><b>２ページ目</b>...
new GInfoWindowTab("Tab #3", "<p><b>３ページ目</b>...
];
''タブの表示''
marker.openInfoWindowTabsHtml(infoTabs,{selectedTab:0});
marker.openInfoWindowTabsHtml([第一引数],[第二引数],[第三...
引数は３つあり、~
第一引数：タブの位置、省略時はマーカ位置~
第二引数：表示するタブの内容の変数~
第三引数：オプション~
selectedTab:デフォルトで表示するタブ０から順に指定~
maxWidth:吹き出しの幅設定だが、うまく動かない~
***サンプル [#o8a6a91e]
<!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 TAB API TSET</title>
<script src="http://maps.google.co.jp/maps?file=api&...
type="text/javascript"></script>
<Style type="text/css">
<!--
Div.infoWindowContent { width:300px} <==maxWid...
-->
</Style>
</head>
<body>
<H2>Google Map API TAB の試験 <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(37.4419, -122.1419),...
// GClientGeocoderを初期化
geocoder = new GClientGeocoder();
var address = "三重県松阪市久保町";
var infoTabs = [
new GInfoWindowTab("Tab #1", '<div class=...
+ address + '</div>'), <==maxWidthがうまく動作しないの...
new GInfoWindowTab("Tab #2", "<p><b>２ペ...
new GInfoWindowTab("Tab #3", "<p><b>３ペ...
]; <==表示内容を設定
geocoder.getLatLng(
address,
function(point){
if (!point) {
alert("Adress not found");
}else{
map.setCenter(point, 13);
var marker = new GMarker...
var marker = show_marker...
map.addOverlay(marker);
marker.openInfoWindowTab...
}
}
);
//マーカにマウスが来たら吹き出し表示(この部分はこのよう...
function show_marker(point,infoTabs){
var marker = new GMarker(point);
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowTabsHtml(infoTabs,{sel...
});
return marker;
}
終了行:
*API3(吹き出しにタグをつける) [#qd87a4c1]
RIGHT:更新日&lastmod();
**吹き出しにタグをつける [#sac2851f]
''タブの設定''
var infoTabs = [
new GInfoWindowTab("Tab #1", "<p><b>２ページ目</b>...
new GInfoWindowTab("Tab #2", "<p><b>２ページ目</b>...
new GInfoWindowTab("Tab #3", "<p><b>３ページ目</b>...
];
''タブの表示''
marker.openInfoWindowTabsHtml(infoTabs,{selectedTab:0});
marker.openInfoWindowTabsHtml([第一引数],[第二引数],[第三...
引数は３つあり、~
第一引数：タブの位置、省略時はマーカ位置~
第二引数：表示するタブの内容の変数~
第三引数：オプション~
selectedTab:デフォルトで表示するタブ０から順に指定~
maxWidth:吹き出しの幅設定だが、うまく動かない~
***サンプル [#o8a6a91e]
<!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 TAB API TSET</title>
<script src="http://maps.google.co.jp/maps?file=api&...
type="text/javascript"></script>
<Style type="text/css">
<!--
Div.infoWindowContent { width:300px} <==maxWid...
-->
</Style>
</head>
<body>
<H2>Google Map API TAB の試験 <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(37.4419, -122.1419),...
// GClientGeocoderを初期化
geocoder = new GClientGeocoder();
var address = "三重県松阪市久保町";
var infoTabs = [
new GInfoWindowTab("Tab #1", '<div class=...
+ address + '</div>'), <==maxWidthがうまく動作しないの...
new GInfoWindowTab("Tab #2", "<p><b>２ペ...
new GInfoWindowTab("Tab #3", "<p><b>３ペ...
]; <==表示内容を設定
geocoder.getLatLng(
address,
function(point){
if (!point) {
alert("Adress not found");
}else{
map.setCenter(point, 13);
var marker = new GMarker...
var marker = show_marker...
map.addOverlay(marker);
marker.openInfoWindowTab...
}
}
);
//マーカにマウスが来たら吹き出し表示(この部分はこのよう...
function show_marker(point,infoTabs){
var marker = new GMarker(point);
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowTabsHtml(infoTabs,{sel...
});
return marker;
}
ページ名:
![[PukiWiki]](image/../localimages/Atom.gif "[PukiWiki]")
