Tabbed Info Windows-GoogleMaps/API/doc/Examples/09-TabbedInfoWindows-N☆E 学習帳

[ リロード ]   [ ソース ]  [ トップ | 一覧 | 単語検索 | 最新 | バックアップ | ヘルプ ]

Counter: 3135, today: 1, yesterday: 3

Tabbed Info Windows

http://www.google.com/apis/maps/docu­mentation/

Version 2 (2006.4) 新規

Version 2 of the API introduces openInfoWindowTabs() and the GInfoWindowTab class to support info windows with multiple, named tabs. The example below displays a simple tabbed info window above a single marker.

var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
 
// Our info window content
var infoTabs = [
  new GInfoWindowTab("Tab #1", "This is tab #1 content"),
  new GInfoWindowTab("Tab #2", "This is tab #2 content")
];
 
// Place a marker in the center of the map and open the info window
// automatically
var marker = new GMarker(map.getCenter());
GEvent.addListener(marker, "click", function() {
  marker.openInfoWindowTabsHtml(infoTabs);
});
map.addOverlay(marker);
marker.openInfoWindowTabsHtml(infoTabs);

Googleにあったサンプル(上記スクリプト)を改造してタブを4つにしてみました。
スタイルシートでInfoWindowの幅を調整しないとデザインが崩れます。
http://never-ever.info/googlemaps/ve­r2/tab.html

タブはいくつまでつくれるのだろうか?