Question

我有一个谷歌地图，在我的InfoWindow中它显示信息窗口中的所有地址。当我将php变量移出我的foreach数组时，它只显示数组中的最后一项。我是否错过了完成数组或在infoWindow函数中没有正确声明它？

以下是我的支持代码：

现在更新代码MARKER_0，MARKER_1中的脉冲而不是地址（a，b，c，d）。

<script type="text/javascript">
    $(document).ready(function() {
    //create an array to store lat n lon and type
    var lat= [];  
    var lon= [];  
    var type= [];
    var address= []; 

    var restaurant = 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=B|FF0000|000000';
    var bar = 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=A|FF0000|000000';

    var x=0;    //to store index for looping  
    var map = null; //create a map and define it's value to null  
    var markerArray = []; //create a global array to store markers  
    var infowindow; //create infowindow to show marker information  


    //looping for getting value from database using php  
    <?php foreach($latlong as $row): ?>
        lat.push(<?php echo $row['lat']; ?>);  
        lon.push(<?php echo $row['long']; ?>);
        type.push(<?php echo $row['type']; ?>);
        address.push("<?php echo $row['address']; ?>");
     x++; 
    <?php endforeach; ?>

        function initialize() {  
            //set center from the map  
            var myOptions = {  
                zoom: 10,  
                center: new google.maps.LatLng(lat[0], lon[0]),  
                mapTypeControl: true,  
                mapTypeControlOptions: {  
                    style: google.maps.MapTypeControlStyle.DROPDOWN_MENU  
                },  
                navigationControl: true,  
                mapTypeId: google.maps.MapTypeId.ROADMAP  
            }  
            //make a new map  
            map = new google.maps.Map(document.getElementById("map"), myOptions);  


            //define value and size for infowindow  
            infowindow = new google.maps.InfoWindow({  
                size: new google.maps.Size(150, 50)

            });  

            // Add markers to the map  
            // Set up markers based on the number of elements within the array from database  
            for (var i = 0; i < x; i++) { 
                createMarker(new google.maps.LatLng(lat[i], lon[i]), type[i],address[i], 'marker_'+i);  
                ;
            }  
        }  
    function createMarker(latlng, type, id, address){
        var marker = new google.maps.Marker({  
            position: latlng,
            map: map,
            icon: type,
            id: id,
            address:address
        });
        google.maps.event.addListener(marker, 'mouseover', onMarkerClick);  
        markerArray.push(marker); //push local var marker into global array  
    }

    //create a function that will open infowindow when a marker is clicked  
       var onMarkerClick = function(latlng) {  
          var marker = this;  
          var latLng = marker.getPosition(); 
          infowindow.setContent('<h3>Marker address is:</h3>'+ marker.address +'</div>');
          infowindow.open(map, marker, marker.address);

        }; 


    window.onload = initialize;     
    });
</script>

在我的脚本部分的firebug中，数据输出如此，所以我知道它正在提取正确的信息！

//使用php

循环从数据库获取值

lat.push(lat);
lon.push(lng);
type.push(restaurant);
address.push("A");
x++;
lat.push(lat);
lon.push(lng);
type.push(bar);
address.push("B");
x++;
lat.push(lat);
lon.push(lng);
type.push(restaurant);
address.push("C");
x++;
lat.push(lat);
lon.push(lng);
type.push(bar);
address.push("D");
x++;

非常感谢任何帮助。

Answer 1

您将4个参数传递到createMarker函数中：

createMarker(new google.maps.LatLng(lat[i], lon[i]), type[i], address[i], 'marker_'+i);

但是你只使用其中的3个，

function createMarker(latlng, type, id){

不应该是函数声明：

function createMarker(latlng, type, address, id){

然后您可以将地址作为属性添加到标记中：

var marker = new google.maps.Marker({  
            position: latlng,
            map: map,
            icon: type,
            id: id,
            address: address
        });

你可以这样引用：

var onMarkerClick = function(latlng) {  
          var marker = this;  
          var latLng = marker.getPosition(); 
          infowindow.setContent('<h3>Marker address is:</h3>'+ marker.address +'</div>');
          infowindow.open(map, marker, marker.address);
        };

Google地图InfoWindow显示数组中的所有地址而不是1

1 个答案: