Javascript SetMap（null）不使用google maps v3中的标记
我正在创建一个web应用程序，在页面加载时，从一个点到多个点绘制多条多段线。也绘制了相应的标记。在下拉列表中更改时，多段线和标记应消失 当前代码输出 更改下拉列表时，标记和相应的多段线应消失，但当前只有标记消失，而不是多段线 HTML代码Javascript SetMap（null）不使用google maps v3中的标记,javascript,google-maps,google-maps-api-3,google-polyline,Javascript,Google Maps,Google Maps Api 3,Google Polyline,我正在创建一个web应用程序，在页面加载时，从一个点到多个点绘制多条多段线。也绘制了相应的标记。在下拉列表中更改时，多段线和标记应消失 当前代码输出 更改下拉列表时，标记和相应的多段线应消失，但当前只有标记消失，而不是多段线 HTML代码 <div class="filter-set"> <label for="ship-select">See most popular destinations from an area:</label>
<div class="filter-set">
<label for="ship-select">See most popular destinations from an area:</label>
<select id="type" onchange="filterAirports(this.value);">
<option value="-1">Any</option>
<option value="0">20001, Northwest Washington, Washington</option>
<option value="1">512, 2001 Pennsylvania Ave NW, Washington, DC</option>
</select><br/><br/>
</div>
<div id="map_wrapper">
<div id="us_map" class="mapping"></div>
</div>
var gmarkers1 = [];
var airport_location = [];
var marker_element = [];
var polyline=null,polyline1=null;
var infowindow = new google.maps.InfoWindow({
content: ''
});
var activities = document.getElementById("type");
// start coordinates
var start = [['20001, Northwest Washington, Washington',38.912068, -77.019023,1],
['512, 2001 Pennsylvania Ave NW, Washington, DC',38.90167,-77.045169,2]
//['2000 H St NW, Washington, DC',38.89856,-77.045791]
];
//2d array having multiple points for each point above
airport_location = [[
['800 Gregorio Drive, Montgomery Knolls, Silver Spring', 39.009814, -76.99548, 1,2331], //
['9200 Whitney Street, Silver Spring', 39.005551, -77.003279, 2,2320], //
['100 Melbourne Avenue, Silver Spring', 39.006549, -77.011154, 3,2265], //
['8600 Lancaster Drive, Bethesda', 38.996859 , -77.088684, 4,2186], //
['8600 Irvington Avenue, Bradmoor, Bethesda', 38.996353 , -77.118253, 5,2159], //
['2400 Lyttonsville Place, Silver Spring', 38.998812, -77.052447, 6,2144], //
['8500 Glenville Road, Takoma Park', 38.994632, -76.993937, 7,2111], //
['8600 Cunningham Drive, Berwyn Heights', 38.991265 , -76.913815, 8,2097], //
['4800 Del Ray Avenue, Woodmont Triangle, Bethesda', 38.991144 , -77.097584, 9,2089],//
['8600 22nd Avenue, Hyattsville', 38.997182 , -76.968822, 10,2071] //
],
[
['9500 Elvis Lane, Lanham-Seabrook, Goddard', 38.985575 , -76.844996, 1,2547], //
['2700 Phelps Avenue, District Heights', 38.851711, -76.868447, 2,2469], //
['1800 Metzerott Road, Adelphi', 39.004447 , -76.977798, 3,2459], //
['3800 Forestville Road, District Heights', 38.836892 , -76.875601, 4,2366], //
['600 Cappy Avenue, Capitol Heights', 38.879616, -76.887745, 5,2360], //
['1700 Ritchie Road, District Heights', 38.866842, -76.862023, 6,2359], //
['6800 Asset Drive, Landover, 13, Kent, Prince George County, Maryland, United States, 20785)', 38.907013 , -76.890744, 7,2341], //
['5900 Cherrywood Lane, Greenbelt', 39.004776, -76.907918, 8,2319], //
['8600 22nd Avenue, Hyattsville', 38.997182, -76.968822, 9,2279],//
['1100 Valley Drive, College Park', 39.175554, -78.17089, 10,2274] //
]];
//gmarkers1 = airport_location.slice();
//Function to plot map intially on page load
function initialize() {
var center = new google.maps.LatLng(38.8977, -77.0365);
var mapOptions = {
zoom: 8,
center: center,
//mapTypeId: google.maps.MapTypeId.TERRAIN
};
map = new google.maps.Map(document.getElementById('us_map'), mapOptions);
for (i = 0; i < airport_location.length; i++) {
//addMarker(start[i]);
for(var j=0; j < airport_location[i].length; j++){
//console.log("Marker array is:" +airport_location[i][j]);
addMarker(airport_location[i][j],i,j);
}
}
console.log("gmarker array is: "+gmarkers1.length)
var bounds = new google.maps.LatLngBounds();
var paths = [];
for (var i=0; i < airport_location.length; i++){
for(var j=0; j < airport_location[i].length; j++){
// var startCoords = start[i].split(",");
var startPt = new google.maps.LatLng(start[i][1],start[i][2]);
//var endCoords = end[i].split(",");
var endPt = new google.maps.LatLng(airport_location[i][j][1],airport_location[i][j][2]);
if(i ==0){
calcRoute(startPt, endPt);
//paths.push([startPt, endPt]);
}else{
calcRoute1(startPt, endPt);
}
bounds.extend(startPt);
bounds.extend(endPt);
}
}
map.fitBounds(bounds);
}
// Initialize Google Maps API
initialize();
//Function to plot airports on the map
function calcRoute(source,destination){
polyline = new google.maps.Polyline({
path: [source, destination],
strokeColor: 'red',
strokeWeight: 2,
strokeOpacity: 1
});
polyline.setMap(map);
}
activities.addEventListener("change", function() {
console.log("change called")
polyline.setMap(null);
//polyline = null;
console.log("polyline "+polyline);
polyline1.setMap(null);
//polyline.setPath([]);
});
function calcRoute1(source,destination){
polyline1 = new google.maps.Polyline({
path: [source, destination],
strokeColor: 'red',
strokeWeight: 2,
strokeOpacity: 1
});
polyline1.setMap(map);
}
function addMarker(marker,i,j) {
console.log("i value is :"+i)
var elevation = marker[4];
var title = marker[0];
var pos = new google.maps.LatLng(marker[1], marker[2]);
var content = marker[0];
marker1 = new google.maps.Marker({
title: title,
position: pos,
elevation: elevation,
map: map
});
//console.log("marker is: "+marker1)
gmarkers1.push(marker1);
// Fuction to display text on click
google.maps.event.addListener(marker1, 'click', (function (marker1, content) {
return function () {
// console.log('Gmarker 1 gets pushed');
infowindow.setContent(content);
infowindow.open(map, marker1);
map.panTo(this.getPosition());
}
})(marker1, content));
}
// function to add/remove markers based on filter
filterAirports = function (elevation) {
console.log("Condition: "+elevation)
for (i = 0; i < gmarkers1.length; i++) {
marker = gmarkers1[i];
if(elevation == 0){
if (i >=0 && i<= 9) {
marker.setVisible(true);
}
else {
marker.setVisible(false);
}
}else if(elevation == 1){
if (i >=10 && i<= 19) {
marker.setVisible(true);
}
else {
marker.setVisible(false);
}
}else if(elevation == 2){
}else if(elevation == -1){
marker.setVisible(true);
}
}
}
从某个区域查看最受欢迎的目的地：
任何
20001，华盛顿州华盛顿西北部
华盛顿特区宾夕法尼亚大道西北512号，2001
<div class="filter-set">
<label for="ship-select">See most popular destinations from an area:</label>
<select id="type" onchange="filterAirports(this.value);">
<option value="-1">Any</option>
<option value="0">20001, Northwest Washington, Washington</option>
<option value="1">512, 2001 Pennsylvania Ave NW, Washington, DC</option>
</select><br/><br/>
</div>
<div id="map_wrapper">
<div id="us_map" class="mapping"></div>
</div>
var gmarkers1 = [];
var airport_location = [];
var marker_element = [];
var polyline=null,polyline1=null;
var infowindow = new google.maps.InfoWindow({
content: ''
});
var activities = document.getElementById("type");
// start coordinates
var start = [['20001, Northwest Washington, Washington',38.912068, -77.019023,1],
['512, 2001 Pennsylvania Ave NW, Washington, DC',38.90167,-77.045169,2]
//['2000 H St NW, Washington, DC',38.89856,-77.045791]
];
//2d array having multiple points for each point above
airport_location = [[
['800 Gregorio Drive, Montgomery Knolls, Silver Spring', 39.009814, -76.99548, 1,2331], //
['9200 Whitney Street, Silver Spring', 39.005551, -77.003279, 2,2320], //
['100 Melbourne Avenue, Silver Spring', 39.006549, -77.011154, 3,2265], //
['8600 Lancaster Drive, Bethesda', 38.996859 , -77.088684, 4,2186], //
['8600 Irvington Avenue, Bradmoor, Bethesda', 38.996353 , -77.118253, 5,2159], //
['2400 Lyttonsville Place, Silver Spring', 38.998812, -77.052447, 6,2144], //
['8500 Glenville Road, Takoma Park', 38.994632, -76.993937, 7,2111], //
['8600 Cunningham Drive, Berwyn Heights', 38.991265 , -76.913815, 8,2097], //
['4800 Del Ray Avenue, Woodmont Triangle, Bethesda', 38.991144 , -77.097584, 9,2089],//
['8600 22nd Avenue, Hyattsville', 38.997182 , -76.968822, 10,2071] //
],
[
['9500 Elvis Lane, Lanham-Seabrook, Goddard', 38.985575 , -76.844996, 1,2547], //
['2700 Phelps Avenue, District Heights', 38.851711, -76.868447, 2,2469], //
['1800 Metzerott Road, Adelphi', 39.004447 , -76.977798, 3,2459], //
['3800 Forestville Road, District Heights', 38.836892 , -76.875601, 4,2366], //
['600 Cappy Avenue, Capitol Heights', 38.879616, -76.887745, 5,2360], //
['1700 Ritchie Road, District Heights', 38.866842, -76.862023, 6,2359], //
['6800 Asset Drive, Landover, 13, Kent, Prince George County, Maryland, United States, 20785)', 38.907013 , -76.890744, 7,2341], //
['5900 Cherrywood Lane, Greenbelt', 39.004776, -76.907918, 8,2319], //
['8600 22nd Avenue, Hyattsville', 38.997182, -76.968822, 9,2279],//
['1100 Valley Drive, College Park', 39.175554, -78.17089, 10,2274] //
]];
//gmarkers1 = airport_location.slice();
//Function to plot map intially on page load
function initialize() {
var center = new google.maps.LatLng(38.8977, -77.0365);
var mapOptions = {
zoom: 8,
center: center,
//mapTypeId: google.maps.MapTypeId.TERRAIN
};
map = new google.maps.Map(document.getElementById('us_map'), mapOptions);
for (i = 0; i < airport_location.length; i++) {
//addMarker(start[i]);
for(var j=0; j < airport_location[i].length; j++){
//console.log("Marker array is:" +airport_location[i][j]);
addMarker(airport_location[i][j],i,j);
}
}
console.log("gmarker array is: "+gmarkers1.length)
var bounds = new google.maps.LatLngBounds();
var paths = [];
for (var i=0; i < airport_location.length; i++){
for(var j=0; j < airport_location[i].length; j++){
// var startCoords = start[i].split(",");
var startPt = new google.maps.LatLng(start[i][1],start[i][2]);
//var endCoords = end[i].split(",");
var endPt = new google.maps.LatLng(airport_location[i][j][1],airport_location[i][j][2]);
if(i ==0){
calcRoute(startPt, endPt);
//paths.push([startPt, endPt]);
}else{
calcRoute1(startPt, endPt);
}
bounds.extend(startPt);
bounds.extend(endPt);
}
}
map.fitBounds(bounds);
}
// Initialize Google Maps API
initialize();
//Function to plot airports on the map
function calcRoute(source,destination){
polyline = new google.maps.Polyline({
path: [source, destination],
strokeColor: 'red',
strokeWeight: 2,
strokeOpacity: 1
});
polyline.setMap(map);
}
activities.addEventListener("change", function() {
console.log("change called")
polyline.setMap(null);
//polyline = null;
console.log("polyline "+polyline);
polyline1.setMap(null);
//polyline.setPath([]);
});
function calcRoute1(source,destination){
polyline1 = new google.maps.Polyline({
path: [source, destination],
strokeColor: 'red',
strokeWeight: 2,
strokeOpacity: 1
});
polyline1.setMap(map);
}
function addMarker(marker,i,j) {
console.log("i value is :"+i)
var elevation = marker[4];
var title = marker[0];
var pos = new google.maps.LatLng(marker[1], marker[2]);
var content = marker[0];
marker1 = new google.maps.Marker({
title: title,
position: pos,
elevation: elevation,
map: map
});
//console.log("marker is: "+marker1)
gmarkers1.push(marker1);
// Fuction to display text on click
google.maps.event.addListener(marker1, 'click', (function (marker1, content) {
return function () {
// console.log('Gmarker 1 gets pushed');
infowindow.setContent(content);
infowindow.open(map, marker1);
map.panTo(this.getPosition());
}
})(marker1, content));
}
// function to add/remove markers based on filter
filterAirports = function (elevation) {
console.log("Condition: "+elevation)
for (i = 0; i < gmarkers1.length; i++) {
marker = gmarkers1[i];
if(elevation == 0){
if (i >=0 && i<= 9) {
marker.setVisible(true);
}
else {
marker.setVisible(false);
}
}else if(elevation == 1){
if (i >=10 && i<= 19) {
marker.setVisible(true);
}
else {
marker.setVisible(false);
}
}else if(elevation == 2){
}else if(elevation == -1){
marker.setVisible(true);
}
}
}
var gmarkers1=[]；
var机场位置=[]；
var标记元素=[]；
var polyline=null，polyline1=null；
var infowindow=new google.maps.infowindow({
内容：“”
});
var活动=document.getElementById（“类型”）；
//起始坐标
var start=['20001，华盛顿西北部，38.912068，-77.019023,1]，
['512，2001宾夕法尼亚大道西北，华盛顿特区'，38.90167，-77.045169,2]
//[华盛顿特区西北大街2000号，38.89856，-77.045791]
];
//上面每个点都有多个点的二维阵列
机场位置=[[
['800格雷戈里奥大道，蒙哥马利诺尔斯，银泉'，39.009814，-76.995481231]//
[银泉惠特尼街9200号，39.005551，-77.0032792320]//
['100墨尔本大道，银泉'，39.006549，-77.011154，32265]//
[贝塞斯达兰开斯特大道8600号，38.996859，-77.08868442186]//
['8600 Irvington Avenue，Bradmoor，Bethesda'，38.996353，-77.11825352159]//
['2400莱顿斯维尔广场，银泉'，38.998812，-77.05244762144]//
['Takoma公园格伦维尔路8500号'，38.994632，-76.99393772111]//
['8600坎宁安大道，伯温高地'，38.991265，-76.913815，82097]//
[贝塞斯达伍德蒙特三角区德雷大道4800号，38.991144，-77.09758492089]//
['8600海茨维尔第22大道'，38.997182，-76.968822，102071]//
],
[
['9500埃尔维斯巷，兰厄姆西布鲁克，戈达德'，38.985575，-76.84499612547]//
['2700菲尔普斯大道，区高地'，38.851711，-76.86844722469]//
[Adelphi Metzerott路1800号，39.004447，-76.97779832459]//
[38.836892，-76.87560142366]区高地福里斯特维尔路3800号]//
['600 Cappy Avenue，Capitol Heights'，38.879616，-76.88774552360]//
['1700里奇路，区高地'，38.866842，-76.86202362359]//
【美国马里兰州乔治王子县肯特郡兰多弗13号资产大道6800号，20785】、38.907013、-76.89074472341】//
['5900绿带樱桃木巷'，39.004776，-76.907918182319]//
[Hyattsville第22大道8600号，38.997182，-76.968822，92279]//
[学院公园山谷大道1100号，39.175554，-78.17089102274]//
]];
//gmarkers1=airport_location.slice（）；
//用于在页面加载时初始绘制地图的函数
函数初始化（）{
var center=newgoogle.maps.LatLng（38.8977，-77.0365）；
变量映射选项={
缩放：8，
中心:中心,，
//mapTypeId:google.maps.mapTypeId.TERRAIN
};
map=new google.maps.map（document.getElementById（'us_-map'），mapOptions）；
对于（i=0；i