*API3(マーカーにタグをつける) [#qd87a4c1]
*API3(吹き出しにタグをつける) [#qd87a4c1]

RIGHT:更新日&lastmod();

**マーカーにタグをつける [#sac2851f]
**吹き出しにタグをつける [#sac2851f]

''タブの設定''
 var infoTabs = [
       new GInfoWindowTab("Tab #1", "<p><b>２ページ目</b>です</p>"),
  　　 new GInfoWindowTab("Tab #2", "<p><b>２ページ目</b>です</p>"),
  　　 new GInfoWindowTab("Tab #3", "<p><b>３ページ目</b>です</p>")
 ];

''タブの表示''
 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; charset=utf-8"/>
     <title>Google Maps JavaScript TAB API TSET</title>
     <script src="http://maps.google.co.jp/maps?file=api&amp;v=2&amp;key=(URLキー)"
       type="text/javascript"></script>
       <Style type="text/css">
          <!--
          Div.infoWindowContent { width:300px}  <==maxWidthがうまく動作しないのでStyleで設定
          -->
       </Style>
 
   </head>
 
   <body>
 <H2>Google Map API TAB の試験 <H2>
     <div id="map" style="width: 800px; height: 600px"></div>
 
     <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), 13); */
 
         // GClientGeocoderを初期化
         geocoder = new GClientGeocoder();
 
         var address = "三重県松阪市久保町";
 
   　    var infoTabs = [
    　          new GInfoWindowTab("Tab #1", '<div class="infoWindowContent">'\
 + address + '</div>'),　<==maxWidthがうまく動作しないのでStyleで設定
 　　           new GInfoWindowTab("Tab #2", "<p><b>２ページ目</b>です</p>"),
 　　           new GInfoWindowTab("Tab #3", "<p><b>３ページ目</b>です</p>")
 　     ]; <==表示内容を設定
         geocoder.getLatLng(
                 address,
                 function(point){
                         if (!point) {
                                 alert("Adress not found");
                         }else{
                                 map.setCenter(point, 13);
                                 var marker = new GMarker(point);
                                 var marker = show_marker(point,infoTabs);
                                 map.addOverlay(marker);
                                 marker.openInfoWindowTabsHtml(infoTabs,{selectedTab:0});    <==表示
                         }
                 }
         );
 
 
 //マーカにマウスが来たら吹き出し表示(この部分はこのように関数する必要がある)
       function show_marker(point,infoTabs){
           var marker = new GMarker(point);
 
           GEvent.addListener(marker, 'click', function() {
              marker.openInfoWindowTabsHtml(infoTabs,{selectedTab:0});   <==表示
                                   });
 
           return marker;
       }
トップ   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS