在谷歌地图上的弹出窗口中显示图片

时间:2013-05-17 19:28:50

标签: php mysql google-maps

我使用谷歌地图显示用户的位置,使用标记和一个包含每个用户名称和个人资料图片的弹出窗口

但问题是登录用户的个人资料图片显示在所有标记上,而不是所有者标记的个人资料图片,但名称是正确的名称

谁能帮助我?

我希望每个标记显示所有者标记的个人资料图片

map.php

<script type="text/javascript">
 var icon = new google.maps.MarkerImage("http://maps.google.com/mapfiles/ms/micons/blue.png",
                       new google.maps.Size(32, 32), new google.maps.Point(0, 0),
                       new google.maps.Point(16, 32));
            var center = null;
            var map = null;
            var currentPopup;
            var bounds = new google.maps.LatLngBounds();
            function addMarker(lat, lng, info) {
                var pt = new google.maps.LatLng(lat, lng);
                bounds.extend(pt);
                var marker = new google.maps.Marker({
                    position: pt,
                    icon: icon,
                    map: map
                });
                var popup = new google.maps.InfoWindow({
                    content: info,
                    maxWidth: 300
                });
                google.maps.event.addListener(marker, "click", function() {
                    if (currentPopup != null) {
                        currentPopup.close();
                        currentPopup = null;
                    }
                    popup.open(map, marker);
                    currentPopup = popup;
                });
                google.maps.event.addListener(popup, "closeclick", function() {
                    map.panTo(center);
                    currentPopup = null;
                });
            }           
            function initMap() {
                map = new google.maps.Map(document.getElementById("map"), {
                    center: new google.maps.LatLng(0, 0),
                    zoom: 14,
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    mapTypeControl: true,
                    mapTypeControlOptions: {
                        style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
                    },
                    navigationControl: true,
                    navigationControlOptions: {
                        style: google.maps.NavigationControlStyle.ZOOM_PAN
                    }
                });


<?php

$query = mysql_query("SELECT lattitude, user_name,village_name, longitude FROM members u 
                      INNER JOIN village v
                       ON u.village = v.id")or die(mysql_error());

while($row = mysql_fetch_array($query))
{
  $name = $row['user_name'];
  $lat = $row['lattitude'];
  $lon = $row['longitude'];
//****for image *****//
 $sql = mysql_query("SELECT * FROM members") or die(mysql_error());
  while($row = mysql_fetch_array($sql))
  {

     $username = $row['user_name'];

     //***************for upload img*****************
     $check_pic="members/$id/image01.jpg";
     $default_pic="members/0/image01.jpg";
     if(file_exists($check_pic))
     {
         $user_pic="<img src=\"$check_pic\"width=\"100px\"/>";
     }
     else
     {
          $user_pic="<img src=\"$default_pic\"width=\"100px\"/>";
     }

  //var_dump($query);


  }
    echo("addMarker($lat, $lon, '<b>$name</b><br /> $user_pic');\n");
}
?>
 center = bounds.getCenter();
     map.fitBounds(bounds);

     }
</script>
<script type="text/javascript">

0 个答案:

没有答案