Horn Network

如果要顯示的訊息太多可以用頁籤(tab)的方式呈現。

Google API

• GInfoWindowTab
• .openInfoWindowTabsHtml

程式碼

執行範例

google.load("maps", "2.x");
google.setOnLoadCallback(initialize);

var map = null;
function initialize() {
	// 檢查瀏覽器是否可使用 Google Map API
	if ( GBrowserIsCompatible() ) {
        map = new google.maps.Map2(document.getElementById('map'));
		// 設定地圖中心點
		map.setCenter(new GLatLng(25.036772,121.520269), 12);

addSite(map,12,'中山',25.062361,121.526194,'台北市中山區林森北路511號');
addSite(map,13,'萬華',25.030000,121.490556,'台北市萬華區莒光路315號');
addSite(map,14,'古亭',25.020833,121.528611,'台北市中正區羅斯福路三段153號');

	} // if
	else {
		alert('您的瀏覽器不支援Google Map');
	} // else
}

function addSite(map, siteCode, siteDesc, lat, lng, address) {
	var mark = new GMarker(
		new GLatLng(lat,lng),
		{title:siteDesc}
		);
	map.addOverlay(mark);
	GEvent.addListener(mark, "click", function() {
		var tab1 = new GInfoWindowTab("測站", siteDesc);
		var tab2 = new GInfoWindowTab("地址：", address);
		var infoTabs = [tab1,tab2];
		mark.openInfoWindowTabsHtml(infoTabs);
		});
}

Filed under:
Google Map by klcintw