2013-07-03 60 views
0

我有这样的谷歌地图:Google地图和

<?php 
//Conexion db 

$query = mysql_query("SELECT * FROM routes"); 

?> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<style type="text/css"> 
    html { height: 100% } 
    body { height: 100%; margin: 0px; padding: 0px } 
    #map_canvas { height: 100% } 
</style> 
<script type="text/javascript" 
    src="http://maps.google.com/maps/api/js?sensor=false&amp;language=es"> 
</script> 
<script type="text/javascript"> 


window.onload = function() { 
    var options = { 
    zoom: 5, 
    center: new google.maps.LatLng(40.84706, -2.944336), 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    map = new google.maps.Map(document.getElementById('map_canvas'), options); 


    <?php 
     for($i = 0; $i < mysql_num_rows($query); $i++){ 
      $icao = mysql_result($query, $i, 'from'); 
      $query = mysql_query("SELECT * FROM airports WHERE icao='$icao'"); 
      $latitude = mysql_result($query, 0, 'latitude'); 
      $longitude = mysql_result($query, 0, 'longitude'); 
      $city = mysql_result($query, 0, 'city'); 
     ?> 
    var Airport1 = '<h3 align="center" style="font-family:Arial, Helvetica, sans-serif"><?php echo $icao; ?> - <?php echo $city; ?></h3>'; 
    var image = 'http://i46.tinypic.com/33zbm09.png'; 
    var latLonCenter = new google.maps.LatLng(<?php echo $latitude; ?>, <?php echo $longitude; ?>); 
    marker = new google.maps.Marker({ 
    position: latLonCenter, 
    map: map, 
    draggable: false, 
    icon: image, 
    title: '<?php echo $icao; ?> - <?php echo $city; ?>', 
    Airport1: Airport1 
    }); 



    var infowindow = new google.maps.InfoWindow({ 
    content: Airport1 
    }); 


    google.maps.event.addListener(marker, 'click', function() { 
     var n = 1; 
     var infowindow = new google.maps.InfoWindow({ 
     content: "", 
     maxWidth: 320, 
     zIndex: n 
     }); 

     infowindow.setContent(this.Airport1); 
     infowindow.setZIndex(n++); // superpone el último infowindows 
     infowindow.open(map, this); 
    }); 

    <?php 
    $query = mysql_query("SELECT * FROM routes WHERE from='$icao'"); 


    for($i = 0; $i < mysql_num_rows($query); $i++){ 
    $destination = mysql_result($query, $i, 'to'); 
    $query = mysql_query("SELECT * FROM airports WHERE icao='$destiantion'"); 
    $latitudeD = mysql_result($query, 0, 'latitude'); 
    $longitudeD = mysql_result($query, 0, 'longitude'); 
    ?> 

    var PolyLine = new google.maps.Polyline({ 
     strokeColor: "#FF0000", 
     strokeOpacity: 2.0, 
     strokeWeight: 2 
    }); 

    var polyCords = [ 
    new google.maps.LatLng(<?php echo $latitude; ?>, <?php echo $longitude; ?>), 
    new google.maps.LatLng(<?php echo $latitudeD; ?>, <?php echo $longitudeD; ?>) 
    ]; 


    google.maps.event.addListener(marker, 'click', function() { 


    PolyLine.setPath(polyCords); 

    PolyLine.setMap(map); 
    }); 

<?php } } ?> 



} 
</script> 
    </head> 

    <body> 
    <center><div id="map_canvas" style="width:850px; height:560px;"></div></center> 
    </body> 

什么情况是,它doesn'tshows我polilyne。这个想法是点击标记打开多段线到其他标记的网络。标记显示没有问题,但点击它们时不会出现折线。

回答

0

你将不得不使用ajax。点击标记将不得不加载折线的JSON数据。另外我注意到你正在通过PHP查询加载坐标。我建议你在单独的页面上执行此操作,然后以JSON格式输出它,然后通过ajax将其动态显示到地图上。