我正在尝试使用两个可能的值(女性和男性)过滤标记。我正在使用https://jsfiddle.net/peter/drytwvL8/处的函数,并试图创建一个下拉框。当我运行代码时,它告诉我属性的性别是未定义的。我以为我已经将性别定义为 var性别=位置。性别 当我选择一个值(例如“ Female”)时,我希望只显示包含值“ Female”的标记,而所有“ Male”点都被隐藏。
var locations = [{
lat:42.4135648,
lon:-83.1775028,
Address: 'address values',
Program_Name: 'program values',
Service_Restriction: 'service values',
Gender: 'Female'
];
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: {lat:42.3965006 , lng: -83.2464787}
});
var i;
var infowindow = new google.maps.InfoWindow({
content: ''
});
gmarker.push(marker);
for (i = 0; i < locations.length; i++) {
var marker = new google.maps.Marker({
map: map,
title: locations[i].Program_Name,
position: new google.maps.LatLng(locations[i].lat,
locations[i].lon),
gender: locations.Gender
});
// place content you wound like to show in there
bindInfoWindow(marker,map,infowindow,"<p>" +'Program:
'+locations[i].Program_Name +"<br/>" + "Address: "
+locations[i].Address +"<br/>"+ 'Service Restriction: ' +
locations[i].Service_Restriction + "<br/>" + "Gender:
"+locations[i].Gender+ "</br>" +"</p>", locations[i].Program_Name);
}
}
var gmarker =[];
function bindInfoWindow(marker, map, infowindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(html);
infowindow.open(map, marker);
map.panTo(this.getPosition());
});
var gender = locations.Gender
filterMarkers = function (gender) {
for (i = 0; i < locations.length; i++) {
marker = gmarker[i];
// If is same category or category not picked
if (marker.gender == gender || gender.length === 0) {
marker.setVisible(true);
}
// Categories don't match
else {
marker.setVisible(false);
}
}
}
}
<select id="type" onchange="filterMarkers(this.value);">
<option value="">Please select category</option>
<option value="Male">Male</option>
<option value="Female">Female</option>
我收到的消息是 未捕获的TypeError:无法读取未定义的属性“性别”