0

我有这张谷歌地图:

<?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>

发生的事情是它没有向我显示多线。这个想法是单击标记以打开到其他标记的多段线网络。标记显示没有问题,但单击它们时不会出现折线。

4

1 回答 1

0

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

于 2013-07-24T03:26:02.793 回答