早晨 ！
我有我的谷歌地图设置在地图上打开一个信息窗口但是我希望信息窗口在文章'infowin'中打开，有谁知道我如何获取信息在地图上弹出很好以填充侧边栏，可以在这里找到工作版本
http://www.connectteesvalley.com/busdeparturessidetesting.asp
谢谢你
<!DOCTYPE html>
<html>
<head>
<!--Force IE standards mode-->
<meta http-equiv="X-UA-Compatible" content="IE=Edge, chrome=1" />
<!--HTML5 IE enabling script-->
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<link rel="stylesheet" type="text/css" href="styles/desktopcore.css" />
<link rel="stylesheet" type="text/css" href="styles/desktopbus.css" />
<![endif]-->
<!--<link rel="stylesheet" type="text/css" media="(min-width: 551px) and (max-width: 870px)" href="styles/tabletbus.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<!--http://www.google.com/webfonts#ChoosePlace:select Example of Web Font Link-->
<!--<link rel="stylesheet" type="text/css" href="styles/mobilecore.css" media="(min-device-width: 0px) and (max-device-width: 764px)"/>
<link rel="stylesheet" type="text/css" href="styles/mobilebus.css" media="(min-device-width: 0px) and (max-device-width: 764px)"/> -->
<link rel="stylesheet" type="text/css" media="screen and (min-device-width: 481px)" href="styles/desktopcore.css" />
<link rel="stylesheet" type="text/css" media="screen and (min-device-width: 481px)" href="styles/desktopbus.css" />
<link rel="stylesheet" type="text/css" media="screen and (max-device-width: 480px)" href="styles/mobilecore.css" />
<link rel="stylesheet" type="text/css" media="screen and (max-device-width: 480px)" href="styles/mobilebus.css" />
<link href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css'>
<!--Jquery core-->
<script src="http://code.jquery.com/jquery-1.6.3.min.js"></script>
<script type="text/javascript" src="main.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="gmap_funcs.js"></script>
<script type="text/javascript" src="gmap_funcsv3.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false®ion=GB"></script>
<script type="text/javascript" src="gmap_jscoord-1.1.1.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
<!--//
var userQry = '<%=Request("stopname")%>';
var rtSearchType = ""
function initPg(){
<%if LCase(Request("auto")) = "1" then%>
if (userQry.length <= 3){
getStopsGoByRoute(userQry);
} else {
getStopsGoByTxt(userQry);
document.getElementById('stoptxtquery').value = '<%=Request("stopname")%>';
}
<%end if%>
showMap();
}
var mapOpened = false;
var map;
var currMarker;
var geoCoder;
var startPt;
function showMap() {
var mapObj = document.getElementById('map-canvas');
mapObj.style.display = 'block';
document.getElementById('rt-results').style.display = 'none';
geoCoder = new google.maps.Geocoder();
startPt = new google.maps.LatLng(54.57019583004256,-1.3190460205078125);
var myOptions = {
zoom: 10,
center: startPt,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl: true
};
map = new google.maps.Map(mapObj, myOptions);
google.maps.event.addListener(map, 'click', function(res){
en = LatLonWGS842OS_func(res.latLng.lat(), res.latLng.lng());
getStopsGoByCoord(parseInt(en.easting), parseInt(en.northing));
/*infowindow = new google.maps.InfoWindow({
content:"<div class='infowin'><div class='inner'><h3>aaaa</h3></div></div>",
position:startPt,
pixelOffset:new google.maps.Size(0,33)
});
infowindow.open(map)
infowindow.setContent("OOOO<br />aaaddad")*/
});
}
function resetMap(){
map.setCenter(startPt);
map.setZoom(10);
gmapDeleteOverlays();
deleteMarkers();
if (infowindow != undefined){
infowindow.close();
}
document.getElementById('foundstops').style.display="none";
}
function getStopsGoByTxt(qry){
document.getElementById('rt-results').style.display = 'none';
document.getElementById('fbloader').style.display="inline";
sendXmlHttpRequestGet("datanew/nextbuses/findstops.asp?stype=bytxt&qry="+qry,function(res){
//alert(res)
eval("stopsJson="+res);
rtSearchType = "text";
foundStops();
},"");
}
function getStopsGoByCoord(e,n){
document.getElementById('rt-results').style.display = 'none';
var ll = OS2LatLonWGS84_func(e, n);
ll = new google.maps.LatLng(ll.lat, ll.lng);
currMarker = gmapAddMarker({position: ll,title:'',map:map, icon:'images/arrow.png'});
document.getElementById('fbloader').style.display="inline";
sendXmlHttpRequestGet("datanew/nextbuses/findstops.asp?stype=bycoords&e="+e+"&n="+n,function(res){
//alert(res)
eval("stopsJson="+res);
rtSearchType = "map";
foundStops();
},"");
}
function gmapGeoCode(qry) {
geoCodeAddr(geoCoder,{'address':qry+", UK", 'region':"UK"}, gmapGeoCodeResults)
}
function gmapGeoCodeResults(res) {
en = LatLonWGS842OS_func(res.lat(), res.lng());
getStopsGoByCoord(en.easting,en.northing);
}
function selectAddress(addr,e,n){
getStopsGoByCoord(e,n);
document.getElementById('stoptxtquery').value = addr;
}
var stopsJson;
var stopMarkers = [];
function foundStops(){
document.getElementById('rt-results').innerHTML = "";
document.getElementById('rt-results').style.display = 'block';
document.getElementById('fbloader').style.display="none";
var selObj = document.getElementById('foundstops');
var ll;
selObj.style.display="block";
selObj.length = 0;
appendToSelectObj(selObj, " --- Select a stop --- ", "");
gmapDeleteOverlays();
deleteMarkers();
stopMarkers = [];
stopsTotal = 0;
if (stopsJson.stops.length < 1){
gmapGeoCode(document.getElementById("stoptxtquery").value);
}
var bounds = new google.maps.LatLngBounds();
for (i=0;i<stopsJson.stops.length;i++){
if (stopsJson.stops[i].town != ""){
stopsJson.stops[i].town = ", "+stopsJson.stops[i].town;
}
//stopsJson.stops[i].name = stopsJson.stops[i].name+", "+stopsJson.stops[i].dir+stopsJson.stops[i].town+" ("+stopsJson.stops[i].sms+")";
appendToSelectObj(selObj,stopsJson.stops[i].name , i);
ll = OS2LatLonWGS84_func(stopsJson.stops[i].e, stopsJson.stops[i].n);
ll = new google.maps.LatLng(ll.lat, ll.lng);
bounds.extend(ll);
map.fitBounds(bounds);
if (browserIE) {
marker = gmapAddMarker({position: ll, map:map, title:stopsJson.stops[i].name});
} else {
marker = gmapAddMarker({position: ll, map:map, title:stopsJson.stops[i].name, icon:'images/new/marker-bus.png'});
}
marker.atco = stopsJson.stops[i].atco;
marker.i = i;
stopMarkers.push(marker);
google.maps.event.addListener(marker, 'click', function(res){
selectStop(this.i, this.title)
});
stopsTotal++;
}
if (selObj.length > 1){
jqueryOrderSelectOpts("foundstops");
selObj[0].text = "--- Select a stop ("+stopsTotal+" stops found) ---"
if (stopsTotal <= 2){
selObj.selectedIndex = 1;
selectStop(stopMarkers[0].i, stopMarkers[0].title)
}
}
if (stopsTotal <= 0){
selObj.style.display="none";
document.getElementById('rt-results').innerHTML = '<div class="warning">No stop was found please select refine your search or select a point on the map</div>';
}
if (map.getZoom() > 15){
map.setZoom(15);
}
}
function deleteMarkers(){
for (i=0;i<stopMarkers.length;i++){
stopMarkers[i].setMap(null);
}
stopMarkers = [];
}
var infowindow;
var selectedI;
function selectStop(indexI, stopName){
selectedI = indexI
//alert(indexI+" ----- "+stopName+"\n"+stopsJson.stops[indexI].name)
var stopName = stopsJson.stops[indexI].name;
var smsCode = stopsJson.stops[indexI].sms;
$('#foundstops').val(indexI);
var mkr = null;
for (i=0;i<stopMarkers.length;i++){
if (stopMarkers[i].i == indexI){
mkr = stopMarkers[i]
}
}
if (infowindow != undefined){
infowindow.close();
}
infowindow = new google.maps.InfoWindow({
content: "<div class='infowin'><div class='inner'><h3>"+stopName+" </h3><div id='infowin-rtloader' class='realtimeresults'><img src='images/ajax-loader-facebook.gif' /> loading...</div></div></div>",
pixelOffset:new google.maps.Size(0,33)
});
if (mkr != null){
infowindow.open(map,mkr);
getNextBuses(stopsJson.stops[indexI].name, stopsJson.stops[indexI].atco, "", "", "infowin-rtresults", "infowin-rtloader", true);
}
}
var nextbusesNum = 5;
function searchKeyPress(e, func, params){
// look for window.event in case event isn't passed in
if (window.event) { e = window.event; }
if (e.keyCode == 13){
func(params);
return false; // disables submitting form, must have "return searchKeyPress" on the keypress event in textbox
}
}
//-->
</script>
<script type="text/javascript">
<!--//
// Hover navigation images for page:
var navImgHoverArr = ['images/button__myjourney.jpg','images/button__bus.jpg','images/button__rail.jpg','images/button__walk.jpg','images/button__cycle.jpg','images/button__air.jpg','images/button__drive.jpg','images/button__taxi.jpg'];
//-->
</script>
<title>Connect Tees Valley - Live Bus Information</title>
<!--Google Analytics Tracking Snippet - 15 November 2012-->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-11278574-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body onload="initNav();initPg()" class="realtime">
<section id="allContent">
<header id="topHeader">
<div id="headerContent">
<a href="default.asp" accesskey="0"><div id="connectLogo"></div></a>
<h1>Tees Valley Live Bus Information</h1>
<a href="bus.asp"><div id="connectModeLogo"></div></a>
</div>
</header>
<div id="modeBand"></div>
<section id="mainSection">
<h2>To get departure information from any bus stop in the Tees Valley area<br />please either search for a stop by text search or select a point on the map.</h2>
<article id="busLive">
<input type="text" name="stoptxtquery" id="stoptxtquery" style="width:auto" class="txtgray" onkeyup="searchKeyPress(event, getStopsGoByTxt, document.getElementById('stoptxtquery').value)" value="Stop name, street name, postcode or SMS code" onclick="javascript:if (this.value == 'Stop name, street name, postcode or SMS code'){this.value=''}" />
<input type="submit" id="realSearch" aclass="but" value="Search" align="absmiddle" onclick="getStopsGoByTxt(document.getElementById('stoptxtquery').value)" />
<a href="" id="realReset" onclick="resetMap();return false">reset</a>
<!--//<label> or </label>
<input type="button" class="but" value="Show map" onclick="showMap()" />//-->
<img src="images/ajax-loader-facebook.gif" id="fbloader" style="display:none" />
<select name="foundstops" id="foundstops" style="display:none" onchange="selectStop(this.value, $('#foundstops option:selected').text())"></select>
<div id="map-canvas" ></div>
<div id="rt-results"></div>
</article>
<article id="infowin">
</article>
</section>
<!--Close Main Section-->
<!--Document Footer-->
<div id="modeBand"></div>
<section id="journeyPlanner">
<form id="jpform" method="post" action="http://www.connectteesvalley.com/jplanner1.asp">
<h2><a href="jplanner1.asp">Connect Journey Planner</a></h2>
<input type="text" id="jpFrom" name="addrfrom" placeholder="I'm leaving from..." tabindex="1"/>
<input type="text" id="jpTo" name="addrto" placeholder="I'm travelling to..." tabindex="2"/>
<input type="submit" id="jpGo" value="Go" tabindex="3"/>
<br class="clearboth" />
</form>
</section>
<section id="homeSection">
<nav id="mainNavigation">
<ul>
<li id="busButton"><a href="bus.asp" accesskey="2">Bus</a></li>
<li id="trainButton"><a href="train.asp" accesskey="3">Train</a></li>
<li id="walkButton"><a href="walk.asp" accesskey="4">Walk</a></li>
<li id="cycleButton"><a href="cycle.asp" accesskey="5">Cycle</a></li>
<li id="driveButton"><a href="drive.asp" accesskey="6">Drive</a></li>
<li id="flyButton"><a href="fly.asp" accesskey="7">Fly</a></li>
<li id="taxiButton"><a href="taxi.asp" accesskey="8">Taxi</a></li>
</ul>
</nav>
</section>
<section id="socialSection">
<a href="http://www.youtube.com/user/connectteesvalley"><div id="youtubeLogo"></div></a>
<a href="https://twitter.com/connect_tv"><div id="twitterLogo"></div></a>
<a href="http://www.facebook.com/connectteesvalley"><div id="facebookLogo"></div></a>
<h3>Let's journey together</h3>
</section>
<div class="homeBand"></div>
</section>
</body>
</html>