javascript - 为谷歌地图上的每个位置设置位置标记

Question

我有我正在使用的代码(我不是自己写的)，它根据我数据库中的经度和纬度条目在谷歌地图上创建折线。它现在运作良好。我想为 map 上构成线条的每个位置添加一个标记，这样我就可以单击它并从该点的数据库记录中查看时间、经度和纬度信息。

这是当前代码:

<?php

function flightpath($days = 1) {



  if (($days > 100) || ($days < 1) || (!is_numeric($days))) {
    echo 'Please specify a correct number of days (maximum 100 days)';
    return;
  }


  $flightpath_part[0] = "<script>
      function initialize() {
        var myLatLng = new google.maps.LatLng(";

  $flightpath_part[1] = ");
        var mapOptions = {
          zoom: 11,
          center: myLatLng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

        var flightPlanCoordinates = [
";

  $flightpath_part[2] = "
        ];
        var flightPath = new google.maps.Polyline({
          path: flightPlanCoordinates,
          strokeColor: '#FF0000',
          strokeOpacity: 1.0,
          strokeWeight: 3
        });

        flightPath.setMap(map);
      }

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

    </script>
";



  $conn = mysqli_connect($dbhost, $dbuser, $dbpass, $dbname);
  if (mysqli_connect_errno()) {
    echo 'Connection with MySQL database failed!';
    exit();
  }
  $query = "SELECT `log`, `lat`, `lon` FROM `location` WHERE `log` >= ( DATE_SUB( CURDATE( ), INTERVAL " . ($days -1) . " DAY ) ) AND user_id = '$user_idA' ORDER BY `log` ASC";
  $result = mysqli_query($conn, $query);
  $rowcount = mysqli_num_rows($result);

  if ($rowcount == 0) {
    echo "<br /><br /><br /><center><p>You have no locations in your database for this period!</p></center>";

  } else {

    $lat_sum = 0;
    $lon_sum = 0;
    $loc_sum = 0;
    $flightpath = '';


    while ($line = mysqli_fetch_array($result, MYSQLI_ASSOC)) {

        foreach ($line as $col_value) {

            $lon = $line['lon'];
            $lat = $line['lat'];

        $lon_sum = $lon_sum + $lon;
        $lat_sum = $lat_sum + $lat;
        $loc_sum = $loc_sum + 1;

            if ($lon && $lat) {
                $flightpath .= "          new google.maps.LatLng(";
                $flightpath .= $line['lat'];
                $flightpath .= ", ";
                $flightpath .= $line['lon'];
                $flightpath .= "),\r\n";
            }
        }
    }


    $lon_center = $lon_sum / $loc_sum;
    $lat_center = $lat_sum / $loc_sum;
    $flightpath = substr_replace($flightpath, "", -3);


    $flightpath = $flightpath_part[0] . $lat_center . ', ' . $lon_center . $flightpath_part[1] . $flightpath . $flightpath_part[2];    
  }


  mysqli_close($conn);


  return $flightpath;
}

?>

    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;libraries=visualization"></script>    
    <?php echo flightpath($days); ?>

Answer 1

由于数据库存储了经度和纬度坐标，您可以使用它们来创建 map 标记。你可以尝试这样的事情:

function flightmarkers($days=1){
     $conn = mysqli_connect($dbhost, $dbuser, $dbpass, $dbname);
      if (mysqli_connect_errno()) {
        echo 'Connection with MySQL database failed!';
        exit();
      }
      $query = "SELECT `log`, `lat`, `lon` FROM `location` WHERE `log` >= ( DATE_SUB( CURDATE( ), INTERVAL " . ($days -1) . " DAY ) ) AND user_id = '$user_idA' ORDER BY `log` ASC";
      $result = mysqli_query($conn, $query);
      $rowcount = mysqli_num_rows($result);

      if ($rowcount == 0) {
        echo "<br /><br /><br /><center><p>You have no locations in your database for this period!</p></center>";

      } else {
        $flightmarkers= '';
        while ($line = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
            foreach ($line as $col_value) {
                $lon = $line['lon'];
                $lat = $line['lat'];
                if ($lon && $lat) {
                    $flightmarkers.= 
                         'marker = new google.maps.Marker({
                          position: new google.maps.LatLng('.$line['lat'].','.$line['lon'].'),
                          map: map
                          });
                          ';
                }
        }
        return $flightmarkers;
  }
 <?php echo flightpath($days); ?>
 <?php echo flightmarkers($days); ?>

我无法测试它，我不确定 *_sum vars 的意义，因为它们被静态设置为 0，所以它们实际上什么都不做。为了简单起见，我删除了它们。这至少可以让您朝着正确的方向开始。

这个链接也有很多关于 map 标记的信息 Google Maps JS API v3 - Simple Multiple Marker Example