setIcon,setVisible,setPosition在谷歌地图中不起作用

时间:2014-07-10 13:55:53

标签: javascript php google-maps

我将位置从php传递到javascript,而我使用marker.setIcon,marker.setVisible它无法正常工作。在这里我给出示例代码。

<?php
$location = '';
    $location .= '[';
    $counting = count($map_data);   
    // die;
    foreach($map_data as $key=>$feed){      
        if($key>0){
            $location .= ',';   
        }       

        $location .= "['".$feed['Attraction']['location']."', '".$feed['Attraction']['id']."']";
    }
    $location .= ']';
?>

如果我创建数组并使用json_encode则显示缺失;在我的身份之后。所以只有我使用这种方法。将鼠标悬停在标记上时,可以使用设置图标。触发事件时,seticon不起作用。并且js低于

var marker, i;
var markers = new Array();
var locations = "<?php echo $location; ?>";
var geocoder = new google.maps.Geocoder();

function initialize(locations){
        var pointA = new google.maps.LatLng(-12.449380,-50.339844);     
        var zoom_level = 4;

    var mapOpt = { 
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        center: pointA,
        zoom: zoom_level,
        disableDefaultUI: false,
        zoomControl: true,
        panControl:false,
        scrollwheel: true,
        styles: [
        {
           "featureType": "landscape.natural",
           "elementType": "geometry.fill",
           "stylers": [
           { "color": "#ffffff" }
            ]
        },
        {
           "featureType": "landscape.man_made",
           "stylers": [
           { "color": "#ffffff" },
           { "visibility": "off" }
           ]
        },
        {
           "featureType": "water",
           "stylers": [
           { "color": "#80C8E5" },  // applying map water color
           { "saturation": 0 }
           ]
        },
        {
           "featureType": "road.arterial",
           "elementType": "geometry",
           "stylers": [
           { "color": "#999999" }
            ]
        }
        ,{
           "elementType": "labels.text.stroke",
           "stylers": [
           { "visibility": "off" }
          ]
        }
        ,{
           "elementType": "labels.text",
           "stylers": [
           { "color": "#333333" }
           ]
        }
        ,{
           "featureType": "poi",
           "stylers": [
           { "visibility": "off" }
           ]
        }
        ]
    };
    map = new google.maps.Map(document.getElementById("map"), mapOpt);

    for(var i=0;i<locations.length;i++){        
        (function(address,attr_id) {
            geocoder.geocode({
               'address': address
            }, function(results) {
                var marker = new google.maps.Marker({
                   map: map,
                   position: results[0].geometry.location,
                   icon:"http://maps.google.com/mapfiles/ms/icons/blue.png"
                });

                    markers.push(marker);   

                    google.maps.event.addListener(marker, 'mouseover', function() {
                        marker.setIcon("http://maps.google.com/mapfiles/ms/icons/red.png");
                    });
                    google.maps.event.addListener(marker, 'mouseout', function() {
                        marker.setIcon("http://maps.google.com/mapfiles/ms/icons/blue.png");
                    });

            });
        })(locations[i][0],locations[i][1]);
    }
}
function mouseover_event(index){
    markers[index].setVisible(false);
    map.panTo(markers[index].getPosition());    
    google.maps.event.trigger(markers[index], 'mouseover');
}
function mouseout_event(index){ 
    markers[index].setVisible(true);
    map.panTo(markers[index].getPosition());
    google.maps.event.trigger(markers[index], 'mouseout');
}

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

请帮助解决这个问题

1 个答案:

答案 0 :(得分:-1)

我找到了解决方案。

而不是var markers = new Array();我使用了var markers = {};并且在推动标记时使用markers[i] = marker;代替markers.push(marker);

由于