Google Maps setVisible is not a function
Here is my markers[]
array:
partnerMarkers = [
// London
{ lat: 51.515482718, lng: -0.142903122, name: "London", content: "Our home town and international hub." },
// Dubai
{ lat: 25.2644444, lng: 55.3116667, name: "Middle East", content: "Dubai desc" }
];
I have this function, looping through the array of markers (triggered by a button elsew开发者_运维技巧here):
function toggle_layer(markers) {
for (var i=0; i<markers.length; i++) {
markers[i].setVisible(false);
}
}
I get markers[i].setVisible is not a function
- but then this works fine:
function toggle_layer(markers) {
for (var i=0; i<markers.length; i++) {
console.log(markers[i]);
}
}
Why does setVisible not work in this context?
Here is the JSFiddle Demo:
Seems like your markers are just objects instead of google.maps.Markers
, and thus it does not have setVisible()
function within it. You basically want to convert the data within your Object into a google.maps.Marker
object. I created a global array gooMarker
to hold the Markers. By clicking on the link below the map, it'll hide the markers. Here is the way to create Markers and then hide them:
HTML Markup:
<div id='parent'>
<div id="map_canvas" style="width: 650px; height: 550px;"></div>
</div>
<div id='hidemark'>Click to hide markers</div>
JavaScript + Google Map V3 API:
var map;
var gooMarker = [];
var partnerMarkers = [
{
lat: 51.515482718,
lng: -0.142903122,
name: "London",
content: "Our home town and international hub."},
{
lat: 25.2644444,
lng: 55.3116667,
name: "Middle East",
content: "Dubai desc"}
];
function initialize() {
var london = new google.maps.LatLng(51.5, 0);
var myOptions = {
backgroundColor: '#FFFFF',
zoom: 2,
center: london,
navigationControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map_canvas = document.getElementById("map_canvas");
map = new google.maps.Map(map_canvas, myOptions);
for (var i = 0; i < partnerMarkers.length; i++) {
gooMarker.push(new google.maps.Marker({
position: new google.maps.LatLng(partnerMarkers[i].lat, partnerMarkers[i].lng),
map: map,
title: partnerMarkers[i].name
}));
}
}
function hideMarkers(){
for(var i=0; i<gooMarker.length; i++){
gooMarker[i].setVisible(false);
}
}
document.getElementById('hidemark').onclick = hideMarkers;
window.onload = initialize;
kjy112 is on the spot, simplified to plugin direct to your code:
partnerMarkers = [
// London
new google.maps.Marker(
{ position: new google.maps.LatLng(51.515482718, -0.142903122),
title: "London - Our home town and international hub." },
// Dubai
new google.maps.Marker(
{ position: new google.maps.LatLng(25.2644444, 55.3116667),
title: "Middle East - Dubai desc" }
];
I'm not seeing the Marker constructor in your code
new google.maps.Marker
精彩评论