hmm. Well, kind of. But the next problem was that the window wanted to open before the text had come back from the ajax request. So the content setting has to go into the callback function. This seems to work, anyway, although I still think it makes more sense just to get all the data on page load...
html/js:
Code:
<!DOCTYPE html>
<html>
<head>
<script src="https://maps.googleapis.com/maps/api/js?v=3&sensor=false"></script>
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map_canvas {
height: 100%;
}
@media print {
html, body {
height: auto;
}
#map_canvas {
height: 650px;
}
}
</style>
</head>
<body>
<div id="map_canvas"></div>
<script type = "text/javascript">
var infowindow = new google.maps.InfoWindow();
var xmlObj=false;
var xmlFct=[function(){return new XMLHttpRequest()}
,function(){return new ActiveXObject("Msxml2.XMLHTTP")}
,function(){return new ActiveXObject("Msxml3.XMLHTTP")}
,function (){return new ActiveXObject("Microsoft.XMLHTTP")}];
for (var i=0;i<xmlFct.length;i++) {try{xmlObj = xmlFct[i]();}catch(e){continue;}break;}
sndRqt=function(url,cllbck,pstDta){
var req=xmlObj;
if (!req) return;
var mth=(pstDta)? "POST":"GET";
req.open(mth,url,true);
//req.setRequestHeader('User-Agent','XMLHTTP/1.0');
if (pstDta) req.setRequestHeader('Content-type','application/x-www-form-urlencoded');
req.onreadystatechange=function(){
if (req.readyState!=4) return;
if (req.status!=200 && req.status!=304) return;
cllbck(req);}
if (req.readyState==4) return;
req.send(pstDta);
};
function makeMap(){
var mapOptions = {
zoom: 7,
center: new google.maps.LatLng(46.76305556,2.424722222),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map_canvas'),mapOptions);
var stations = [[]];
stations[1]=['LFAQ','ALBERT','',' ',49.9725,2.69138888888889];
stations[2]=['LFAT','LE TOUQUET','123.125','03 21 06 62 84',50.5147222222222,1.6275];
stations[3]=['LFBA','AGEN','129.6',' ',44.1747222222222,0.590555555555556];
stations[4]=['LFBC','CAZAUX','',' ',44.535,-1.13138888888889];
stations[5]=['LFBD','BORDEAUX MERIGNAC','131.150','05 57 92 81 04',44.8286111111111,-0.715277777777778];
stations[6]=['LFBE','BERGERAC','127.475','05 53 63 53 55',44.8244444444444,0.520555555555556];
stations[7]=['LFBG','COGNAC','244.450',' ',45.6583333333333,-0.3175];
stations[8]=['LFBH','LA ROCHELLE','126.875','05 46 00 13 92',46.1791666666667,-1.19527777777778];
stations[9]=['LFBI','POITIERS','121.775',' ',46.5875,0.306666666666667];
stations[10]=['LFBL','LIMOGES','128.075','05 55 48 40 37',45.8608333333333,1.18027777777778];
for (var i = 0; i < stations.length; i++) {
var station = stations [i];
var myLatLng = new google.maps.LatLng(station[4], station[5]);
var titre=station[0]+"/"+station[1]+"\n"+station[2]+"/"+station[3]
var marker = createMarker(myLatLng,titre,map);
}
}
function createMarker(latlng, name,map) {
var marker = new google.maps.Marker({
position: latlng,
title:name,
map: map,
zIndex: Math.round(latlng.lat()*-100000)<<5
});
google.maps.event.addListener(marker, 'click', function() {
sndRqt('ajx_mtr.php?arp='+name.substr(0,4),function(r){
infowindow.setContent(r.responseText);
infowindow.open(map,marker);
});
});
}
makeMap();
</script>
</body>
</html>
php:
PHP Code:
<?php
header("Content-Type: text/html; charset=utf-8");
if (!empty($_GET["arp"])){$arp=$_GET["arp"];
I do not understand, I never see an infoWindow ! Have you tested your last proposal which «seems» to work ?
Otherwise, it seems more rational not to do all the work of interpretation all stations while the user does not click on all stations and wants to have the latest information.
I had made a localisation page (with v2) which seem to work when Google wants it (only on my computer ?).
Hi Everybody,
Thanks for your answers to my problem « assigning a js variable to a php variable » some days ago. Here’s an update of what I finally succeeded doing. In fact I made it work . Here’s how :
1) PHP :Reading a textfile (fgets) with meterological station details (code, name, latitude, longitude etc) in PHP variables indexed with (let’s say) $n. For instance : $code_station[$n] gets the station code.
3) PHP : Per station, prepare data to complete preceding PHP information.
Here I have to switch to JavaScript to display the Google Map and one marker per station. To do so, I have to recuperate the above PHP information into JS information. This was my issue when I asked for help. Here’s how it works :
4) Consider the following PHP code which does the trick :
// TRANSFERT DES DONNEES LUES DANS VARIABLE JAVASCRIPT
echo "<script>var nbre_stations=".$nbre_stations."</script>";
echo '<script>var stations = [[]]</script>';
for ($i=0;$i<$nbre_stations;$i++) // ici on va remplir une variable JS avec les données lues en PHP
{
echo "<script>stations[".$i."]=['".$code_station[$i]."','".$nom_station[$i]."','".$atis_station[$i]."','"
.$notel_station[$i]."',".$lat_station[$i].",".$lon_station[$i].",'"
.$calc_metar[$i]."','".$calc_taf[$i]."','".$srss[$i]."']</script>";
}
5) From this point on everything is Javascript, and the map is displayed with the adequate information.
You can see the result here http://www.volets10.fr/V10metartaf_carte.php . I preferred « mouseover » to « click ».
(PS. If you are interested, some parameters may be applied : ?reg=x, where x is a combination of 1,2,3,4,5 corresponding to the french telephone regions. For example : ?reg=125 will display stations from Paris region, north-west and south-west. You can add &max=y where y is the max. number of stations per region to display. You can also ask for stations individually by their OACI codes. Example : ?oaci=lfpg,lfpt,lfrh will display Charles de Gaulle, Pontoise and Lorient) .
Reply With Quote
Originally Posted by xelawho
. Here’s how :
Bookmarks