1

好的,我已经为此苦苦挣扎了将近一个星期,无论我尝试什么,我似乎都无法使其正常工作。

我已经成功地运行了一个计时器(setInterval)来从 mysql 表中检索值,这个文件是调用 apijson.php 并将它们返回到字符串和它的罚款。(转到输出 div)

我遇到了将其集成到谷歌地图 api 以将标记移动和平移到刚刚检索到的坐标的问题。

我希望我对我试图实现的目标有意义。

<html>
  <head>
  <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map-canvas { height: 100% }
    </style>
    <script language="javascript" type="text/javascript" src="jquery.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
    <script>
function initialize() {
  var myLatlng = new google.maps.LatLng(55.953429,-3.188095);
  var mapOptions = {
    zoom: 11,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      title: 'Marker'
  });

  moveBus( map, marker );
}

function moveBus( map, marker ) {

    marker.setPosition( new google.maps.LatLng( 0, 0 ) );
    map.panTo( new google.maps.LatLng( 0, 0 ) );

};

google.maps.event.addDomListener(window, 'load', initialize);

    </script>
  </head>
  <body>
  <div id="map-canvas"></div>
  <div id="output"></div>

  <script id="source" language="javascript" type="text/javascript">
  setInterval(function() 
  {

    $.ajax({                                      
      url: 'apijson.php',                  //the script to call to get data          
      data: "Driver=<?php echo $_GET['Driver']; ?>",                        //you can insert url argumnets here to pass to api.php for example "id=5&parent=6"
      dataType: 'json',                //data format      
      success: function(data)          //on recieve of reply
      {
        var xx = data[7];              //latitude
        var xy = data[8];           //longtude
        var drv = data[2];           //driver
        var clsn = data[1];           //id
        marker.setPosition( new google.maps.LatLng( data[7], data[8] ) );
    map.panTo( new google.maps.LatLng( data[7], data[8] ) );

        $('#output').html("<b>Lat : </b>"+xx+"<b> Long : </b>"+xy+"<b> Driver : </b>"+drv+" ("+clsn+")");     //Set output element html

      } 
    }, 5000);

  }); 


  </script>

  </body>
</html>  
4

1 回答 1

0

您设置本地变量,即marker,在您initialize尝试在 ajaxsuccess事件中访问的函数内部。例如,如果它是全局的,window.myTestMarker = /* .... */;然后您可以window.myTestMarkersuccess事件中使用它来访问它,那么您应该更接近您想要的结果。

于 2013-05-28T02:06:32.107 回答