Question

我有两个mysql表：＆＃34;汽车＆＃34;和＆＃34;地点＆＃34;。

通过使用字段＆＃34; location_id＆＃34;将汽车分配到某个位置。 in＆＃34; cars＆＃34;表。我正在谷歌地图中显示位置，从＆＃34;位置＆＃34;表

我想做的是在Google地图标记的信息窗口中显示（标记位置）哪些车辆被分配到此位置。

我使用此代码的get_locations.php从DB中检索信息：

  $query_cars = "SELECT * FROM cars where location_lat not like ''";
  $cars = $db->query($query_cars);
  $row_cars = $cars->fetchAll(PDO::FETCH_ASSOC);

  $query_locations = "SELECT id, name, gpslat, gpslong FROM locations where name not like '%/ Zona%' and status='Activa'";
  $locations = $db->query($query_locations);
  $rowLocations = $locations->fetchAll(PDO::FETCH_ASSOC);

  echo json_encode($rowLocations);

我用这段代码从html页面调用这个脚本：

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map-canvas { height: 100% }
    </style>

    <script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=API KEY">
    </script>

    <script type="text/javascript">
      function makeRequest(url, callback) {
        var request;
          if (window.XMLHttpRequest) {
              request = new XMLHttpRequest(); // IE7+, Firefox, Chrome, Opera, Safari
          } else {
              request = new ActiveXObject("Microsoft.XMLHTTP"); // IE6, IE5
          }
          request.onreadystatechange = function() {
              if (request.readyState == 4 && request.status == 200) {
                  callback(request);
              }
          }
        request.open("GET", url, true);
        request.send();
      }

      var geocoder = new google.maps.Geocoder();
      var infowindow = new google.maps.InfoWindow();

      function initialize() {
        var mapOptions = {
          center: new google.maps.LatLng(40.430013, -3.695854),
          zoom: 12
        };
        var map = new google.maps.Map(document.getElementById("map-canvas"),
            mapOptions);

        makeRequest('get_locations.php', function(data) {
            var data = JSON.parse(data.responseText);         
            for (var i = 0; i < data.length; i++) {
              displayLocation(data[i]);
            }
        });

        var image = 'http://www.bluemove.es/equipo/images/car_location_Normal.png';

        function displayLocation(location) {
          var content = '<div class="infoWindow">' + location.name; // content of the pop up window
          if (parseInt(location.gpslat) == 0) {
              geocoder.geocode( { 'address': location.address }, function(results, status) {
                  if (status == google.maps.GeocoderStatus.OK) {

                      var marker = new google.maps.Marker({
                          map: map, 
                          position: results[0].geometry.location,
                          title: location.name,
                          incon: image
                      });

                      google.maps.event.addListener(marker, 'click', function() {
                          infowindow.setContent(content);
                          infowindow.open(map,marker);
                      });
                  }
              });
          } else {
              var position = new google.maps.LatLng(parseFloat(location.gpslat), parseFloat(location.gpslong));
              var marker = new google.maps.Marker({
                  map: map, 
                  position: position,
                  title: location.name,
                  icon: image
              });

              google.maps.event.addListener(marker, 'click', function() {
                  infowindow.setContent(content);
                  infowindow.open(map,marker);
              });
          }
        }
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>

  <body>
    <div id="map-canvas"/>
  </body>

</html>

因此，单击标记时，位置名称将显示在信息窗口中。但正如我所说，我也希望显示分配给该位置的汽车名称。

有人有任何想法吗？

谢谢！

Answer 1

您必须进行INNER JOIN查询，以便$ rowLocations包含两个表值。

类似的东西：

SELECT * FROM cars AS c INNER JOIN locations AS l ON c.cars = l.location_id 
WHERE c.location_lat NOT LIKE "'" AND l.name NOT LIKE '%/ Zona%';

Answer 2

我对谷歌地图API很陌生，但有一天我做了一些研究，我看到了这一点。

https://developers.google.com/maps/documentation/javascript/examples/infowindow-simple

将php放入contentString

就好了吗？

谷歌地图，在标记信息窗口中显示mysql信息

2 个答案: