如何使标记/折线可点击?

时间:2015-01-24 14:38:47

标签: javascript google-maps events google-maps-api-3

我在地图上创建了一堆(自定义)标记和折线,并希望能够根据用户偏好隐藏/显示它们。

我也想让这些标记/折线可以点击,这样他们就可以打开一个新的窗口去另一页。

我设法让它们可以点击,但是我无法根据需要显示/隐藏标记。如果我将页面更改为能够隐藏/显示标记组,那么我就无法使它们可点击。

有没有办法一起完成这一切?我当前的页面如下所示:

        function initialize() {

      mapOptions   = {center: new google.maps.LatLng(30.7838001251, 114.2080001831), zoom: 5, mapTypeId: google.maps.MapTypeId.TERRAIN, streetViewControl: false, scaleControl: true, zoomControl: true, zoomControlOptions: { style: google.maps.ZoomControlStyle.SMALL }};
      map          = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
      var marker   = new google.maps.Marker({map: map, position: new google.maps.LatLng(30.7838001251, 114.2080001831), title: 'WUH' });
      setPlanes(map, airborne);

    var apts = [
        new google.maps.Marker({map: map, position: new google.maps.LatLng(23.3924007416, 113.2990036011), icon: new google.maps.MarkerImage('marker/red_MarkerA.png', null, null, new google.maps.Point(10,34), new google.maps.Size(20,34)), shape: {coord: [1, 1, 1, 20, 18, 20, 18 , 1], type: 'poly'}, title: 'CAN, Guangzhou (10)', zIndex: 1, url: 'app/info/airports/553', visible: false}),
        new google.maps.Marker({map: map, position: new google.maps.LatLng(40.0801010132, 116.5849990845), icon: new google.maps.MarkerImage('marker/red_MarkerA.png', null, null, new google.maps.Point(10,34), new google.maps.Size(20,34)), shape: {coord: [1, 1, 1, 20, 18, 20, 18 , 1], type: 'poly'}, title: 'PEK, Beijing (10)', zIndex: 1, url: 'app/info/airports/598', visible: false}),
        new google.maps.Marker({map: map, position: new google.maps.LatLng(31.1434001923, 121.8050003052), icon: new google.maps.MarkerImage('marker/red_MarkerA.png', null, null, new google.maps.Point(10,34), new google.maps.Size(20,34)), shape: {coord: [1, 1, 1, 20, 18, 20, 18 , 1], type: 'poly'}, title: 'PVG, Shanghai Pu Dong (10)', zIndex: 1, url: 'app/info/airports/605', visible: false})
    ];
    var routes = [
        //new google.maps.InfoWindow({ content: 'From WUH to BHY', position: new google.maps.LatLng(21.5394001007, 109.2939987183) }),
        new google.maps.Polyline({map: map, path: [new google.maps.LatLng(30.7838001251, 114.2080001831), new google.maps.LatLng(21.5394001007, 109.2939987183)], strokeColor: '#FF0000', strokeOpacity: 1, strokeWeight: 7, title: 'WUH to BHY', geodesic: true, url: 'fp.asp?F=7807505', visible: false }),
        new google.maps.Polyline({map: map, path: [new google.maps.LatLng(30.7838001251, 114.2080001831), new google.maps.LatLng(39.49, 109.861388889)], strokeColor: '#FF0000', strokeOpacity: 1, strokeWeight: 7, title: 'WUH to BHY', geodesic: true, url: 'fp.asp?F=7807538', visible: false }),

    ];

    var dest = [
        new google.maps.Marker({map: map, position: new google.maps.LatLng(39.49, 109.861388889), icon: new google.maps.MarkerImage('marker/airport.png', null, null, new google.maps.Point(8,14), new google.maps.Size(20,20)), title: 'BHY', visible: false}),
        new google.maps.Marker({map: map, position: new google.maps.LatLng(21.5394001007, 109.2939987183), icon: new google.maps.MarkerImage('marker/airport.png', null, null, new google.maps.Point(8,14), new google.maps.Size(20,20)), title: 'BHY', visible: false})
    ];


    $('#dispToggle').on('change', function(){
        toggleVisibility(this.checked, apts)
    });

    $('#RouteToggle').on('change', function(){
        toggleVisibility(this.checked, routes)
    });

    $('#DestToggle').on('change', function(){
        toggleVisibility(this.checked, dest)
    });

    var toggleVisibility = function(show, markers){
       for (var i = 0, length = markers.length; i < length; i++)
            markers[i].setVisible(show);
    }

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

我展示的飞机是使用功能setPlanes(地图,空降)创建的可点击的,但我不知道如何使用功能显示/隐藏它们。这是创建其他标记的功能:

var airborne = [
     ['CRK', 31.493233, 114.460702, 1, 'RCE 1081', 'm 36.058,339.97614 c -0.53772,-0.5377 -0.2453,-4.1087 0.40047,-4.8902 0.35578,-0.4306 3.80733,-2.9025 7.6701,-5.4932 l 7.02319,-4.7103 -0.1095,-1.7426 c -0.06,-0.9584 -0.4833,-3.5337 -0.9401,-5.7229 -0.8138,-3.9001 -0.8624,-4.0045 -2.4143,-5.1882 -1.8109,-1.3812 -2.8515,-1.5341 -3.1896,-0.4687 -0.36244,1.1419 -0.86775,0.8858 -1.64163,-0.8317 -1.50648,-3.3434 -2.41751,-7.0772 -2.42102,-9.9224 -0.005,-3.8897 0.27025,-4.1642 3.95859,-3.9507 l 2.87636,0.1665 0,-12.3001 c 0,-6.76509 -0.1339,-12.38279 -0.2974,-12.48389 -0.1636,-0.1011 -3.19926,-0.013 -6.74599,0.1949 -6.33865,0.3724 -6.60937,0.4234 -15.87452,2.9899 -5.18425,1.436 -9.67543,2.7385 -9.98039,2.8944 -0.30495,0.1559 -1.5525,0.5613 -2.77232,0.9008 -6.1915297,1.7236 -6.8548497,2.0387 -9.0434297,4.29629 -1.15757,1.194 -2.21620999,2.171 -2.35250999,2.171 -1.08259,0 2.40537999,-7.96559 4.31143999,-9.84609 0.72504,-0.7154 11.2290697,-6.8677 32.5899097,-19.0883 4.26938,-2.4425 8.29551,-4.8353 8.94701,-5.3173 l 1.1845,-0.8763 0.1374,-28.7339 c 0.1039,-21.7301 0.2526,-29.1843 0.6098,-30.582 0.5808,-2.2724 2.9647,-7.4336 4.0123,-8.6866 1.0806,-1.2926 1.7604,-0.7705 3.6653,2.8151 2.9941,5.636 2.8416,3.7794 2.979,36.2686 l 0.1224,28.9186 1.1845,0.8764 c 0.6515,0.4821 4.6777,2.8749 8.9471,5.3174 21.3608,12.2206 31.8648,18.3729 32.5899,19.0883 1.9061,1.8805 5.394,9.84609 4.3114,9.84609 -0.1363,0 -1.1949,-0.977 -2.3525,-2.171 -2.1886,-2.25759 -2.8519,-2.57269 -9.0434,-4.29629 -1.2198,-0.3395 -2.4674,-0.7449 -2.7723,-0.9008 -0.305,-0.1559 -4.7961,-1.4584 -9.9804,-2.8944 -9.2651,-2.5665 -9.5359,-2.6175 -15.8745,-2.9899 -3.5467,-0.2083 -6.5824,-0.296 -6.746,-0.1949 -0.1636,0.1011 -0.2974,5.7188 -0.2974,12.48389 l 0,12.3001 2.919,-0.169 c 2.837,-0.1642 2.9371,-0.1413 3.5653,0.8175 0.5381,0.8212 0.6096,1.5067 0.4272,4.0923 -0.1206,1.7083 -0.4774,3.6052 -0.793,4.2155 -0.3156,0.6103 -0.5754,1.4089 -0.5774,1.7748 0,0.8901 -1.7242,4.5465 -2.138,4.5465 -0.18,0 -0.5213,-0.4259 -0.7585,-0.9465 l -0.4313,-0.9465 -1.5214,0.8541 c -0.8368,0.4698 -1.8086,1.2187 -2.1595,1.6643 -0.5422,0.6886 -1.4931,4.7208 -2.3987,10.1726 l -0.228,1.3722 7.2124,4.8174 c 3.9668,2.6497 7.4483,5.1927 7.7365,5.6512 0.2884,0.4584 0.6318,1.598 0.7632,2.5324 0.2886,2.051 -0.378,2.9216 -1.7424,2.2758 -2.2124,-1.047 -3.8286,-1.635 -8.7973,-3.2004 -2.9649,-0.9341 -5.5057,-1.6983 -5.6462,-1.6983 -0.1406,0 -0.4174,0.4258 -0.6153,0.9463 -0.361,0.9495 -1.1005,0.9346 -1.1005,-0.022 0,-0.281 -0.1635,-0.6119 -0.3633,-0.7354 -0.4248,-0.2626 -11.74819,3.2672 -13.76086,4.2896 -1.48079,0.7522 -1.88167,0.8319 -2.2634,0.4502 z', 197, 653, 'CIF-WUH', 30, 51, 7807468],
     ['CR7', 35.648097, 114.788644, 19, 'RCE 5023', 'm 29.348411,339.99457 c -0.352539,-0.4248 0.08544,-4.10558 0.566345,-4.75957 0.377494,-0.51336 1.392823,-1.22356 10.467847,-7.32209 2.451607,-1.6475 4.512698,-3.08484 4.5802,-3.19407 0.200434,-0.3243 -0.313601,-3.79948 -1.175516,-7.9472 -0.443649,-2.13491 -0.86159,-4.02319 -0.928758,-4.19617 -0.157621,-0.40592 -2.990782,-2.16044 -3.239957,-2.00644 -0.104189,0.0644 -0.305808,0.61303 -0.448048,1.21921 -0.515943,2.1988 -0.95408,2.29727 -1.444013,0.32454 -0.151712,-0.61087 -0.457548,-1.25548 -0.679637,-1.43247 -0.274673,-0.21889 -0.512061,-0.88982 -0.742353,-2.09809 -0.242827,-1.27403 -0.483794,-1.93409 -0.852218,-2.33439 -0.407291,-0.44253 -0.556385,-0.92047 -0.719956,-2.3079 -0.224569,-1.90483 -0.0852,-5.48748 0.247505,-6.36257 0.403544,-1.0614 2.448215,-1.39522 5.561073,-0.90793 0.411262,0.0644 0.420721,-0.0677 0.475069,-6.6347 0.0305,-3.68521 -0.0167,-6.76488 -0.104904,-6.84371 -0.15178,-0.13566 -1.569371,-0.0736 -9.683649,0.4238 -3.077709,0.18867 -3.738709,0.30094 -6.29426,1.06909 -3.429465,1.03083 -5.178097,1.55309 -9.464391,2.82668 -1.788619,0.53146 -4.007346,1.19249 -4.930504,1.46896 -0.9231578,0.27647 -2.6698148,0.79663 -3.8814598,1.15592 -4.794024,1.42156 -4.77301,1.4122 -5.480286,2.4402 -0.70977999,1.03162 -0.96799999,0.9959 -1.15476999,-0.15974 -0.0799,-0.49459 0.0582,-1.17069 0.44631,-2.18488 0.30914,-0.80776 0.63984999,-2.06771 0.73492999,-2.79987 0.222907,-1.71664 0.492551,-1.99275 3.770011,-3.86047 1.44537,-0.82368 3.209257,-1.85079 3.919751,-2.28248 1.3968568,-0.84872 5.2737078,-3.10127 9.6182428,-5.58846 1.500132,-0.8588 3.766066,-2.18158 5.035408,-2.93951 5.083656,-3.03548 7.438149,-4.42881 9.44139,-5.58718 4.523859,-2.61593 7.675873,-4.47978 7.820834,-4.62463 0.08354,-0.0835 0.203118,-9.70337 0.265722,-21.37754 0.103512,-19.30231 0.147387,-21.36835 0.484174,-22.79933 1.103324,-4.68788 3.220923,-9.12299 4.872612,-10.20522 0.518064,-0.33945 0.585112,-0.33928 1.210565,0.003 1.253608,0.68617 3.331069,4.09283 4.302321,7.05503 0.957712,2.9209 0.94081,2.51827 1.065681,25.38483 l 0.119721,21.92298 2.622609,1.54788 c 2.770913,1.63541 3.371658,1.98483 8.707059,5.06439 4.043336,2.33378 6.564678,3.81157 13.32285,7.80866 2.827171,1.67212 6.131658,3.61051 7.343303,4.30753 6.057877,3.48491 7.055807,4.09577 7.388005,4.52239 0.19768,0.25386 0.417435,0.88643 0.488347,1.40571 0.07091,0.51928 0.363292,1.76571 0.649733,2.76985 0.537947,1.88582 0.603154,3.62931 0.135736,3.62931 -0.140274,0 -0.532746,-0.43788 -0.872158,-0.97308 -0.67935,-1.07123 -0.148983,-0.84169 -6.00629,-2.59949 -8.602983,-2.5818 -13.914961,-4.19453 -15.840553,-4.80924 -4.680448,-1.49415 -4.918136,-1.53183 -11.644381,-1.84625 -3.461843,-0.16182 -6.341467,-0.22517 -6.399164,-0.14077 -0.0577,0.0844 -0.104904,3.16001 -0.104904,6.83471 l 0,6.68125 0.524521,-0.0864 c 0.288487,-0.0475 1.421454,-0.0896 2.517704,-0.0936 2.29354,-0.008 3.246938,0.34077 3.511255,1.28528 0.235756,0.84245 0.131443,6.12091 -0.140954,7.13251 -0.128843,0.47849 -0.380219,1.01594 -0.558615,1.19433 -0.178396,0.1784 -0.557562,1.19578 -0.842594,2.26084 -0.285029,1.06507 -0.687318,2.12713 -0.893973,2.36015 -0.206656,0.23301 -0.540906,0.87213 -0.74278,1.42025 -0.530096,1.43931 -0.654481,1.36425 -1.564537,-0.94414 -0.285054,-0.72305 -0.506459,-0.71937 -1.810027,0.0301 -1.512939,0.86983 -1.739331,1.21117 -2.110843,3.18263 -0.183476,0.97363 -0.610092,3.01142 -0.948035,4.52842 -0.337943,1.51698 -0.671625,3.45247 -0.741517,4.30108 l -0.127074,1.54289 5.110865,3.37618 c 2.810975,1.85689 6.303697,4.15568 7.761605,5.1084 1.545488,1.00995 2.748363,1.94648 2.884869,2.24608 0.279604,0.61367 0.307686,3.61975 0.0378,4.04623 -0.226471,0.35787 -0.414454,0.30967 -9.245063,-2.37019 -3.288751,-0.99806 -6.32978,-1.87256 -6.757843,-1.94337 -0.756473,-0.12509 -0.788093,-0.10422 -1.127767,0.74471 -0.398968,0.99712 -0.724104,1.01376 -1.041904,0.0533 -0.367948,-1.11203 -0.485944,-1.13416 -2.516948,-0.47177 -2.206933,0.71977 -8.163556,2.59638 -11.739394,3.69846 -1.384737,0.42677 -2.577816,0.81024 -2.651287,0.85214 -0.07347,0.0419 -0.234881,-0.0459 -0.358689,-0.19504 z', 186, 672, 'XIL-WUH', 30, 51, 7807565],
     ['CRK', 30.701054, 115.2897, 20, 'RCE 1005', 'm 36.058,339.97614 c -0.53772,-0.5377 -0.2453,-4.1087 0.40047,-4.8902 0.35578,-0.4306 3.80733,-2.9025 7.6701,-5.4932 l 7.02319,-4.7103 -0.1095,-1.7426 c -0.06,-0.9584 -0.4833,-3.5337 -0.9401,-5.7229 -0.8138,-3.9001 -0.8624,-4.0045 -2.4143,-5.1882 -1.8109,-1.3812 -2.8515,-1.5341 -3.1896,-0.4687 -0.36244,1.1419 -0.86775,0.8858 -1.64163,-0.8317 -1.50648,-3.3434 -2.41751,-7.0772 -2.42102,-9.9224 -0.005,-3.8897 0.27025,-4.1642 3.95859,-3.9507 l 2.87636,0.1665 0,-12.3001 c 0,-6.76509 -0.1339,-12.38279 -0.2974,-12.48389 -0.1636,-0.1011 -3.19926,-0.013 -6.74599,0.1949 -6.33865,0.3724 -6.60937,0.4234 -15.87452,2.9899 -5.18425,1.436 -9.67543,2.7385 -9.98039,2.8944 -0.30495,0.1559 -1.5525,0.5613 -2.77232,0.9008 -6.1915297,1.7236 -6.8548497,2.0387 -9.0434297,4.29629 -1.15757,1.194 -2.21620999,2.171 -2.35250999,2.171 -1.08259,0 2.40537999,-7.96559 4.31143999,-9.84609 0.72504,-0.7154 11.2290697,-6.8677 32.5899097,-19.0883 4.26938,-2.4425 8.29551,-4.8353 8.94701,-5.3173 l 1.1845,-0.8763 0.1374,-28.7339 c 0.1039,-21.7301 0.2526,-29.1843 0.6098,-30.582 0.5808,-2.2724 2.9647,-7.4336 4.0123,-8.6866 1.0806,-1.2926 1.7604,-0.7705 3.6653,2.8151 2.9941,5.636 2.8416,3.7794 2.979,36.2686 l 0.1224,28.9186 1.1845,0.8764 c 0.6515,0.4821 4.6777,2.8749 8.9471,5.3174 21.3608,12.2206 31.8648,18.3729 32.5899,19.0883 1.9061,1.8805 5.394,9.84609 4.3114,9.84609 -0.1363,0 -1.1949,-0.977 -2.3525,-2.171 -2.1886,-2.25759 -2.8519,-2.57269 -9.0434,-4.29629 -1.2198,-0.3395 -2.4674,-0.7449 -2.7723,-0.9008 -0.305,-0.1559 -4.7961,-1.4584 -9.9804,-2.8944 -9.2651,-2.5665 -9.5359,-2.6175 -15.8745,-2.9899 -3.5467,-0.2083 -6.5824,-0.296 -6.746,-0.1949 -0.1636,0.1011 -0.2974,5.7188 -0.2974,12.48389 l 0,12.3001 2.919,-0.169 c 2.837,-0.1642 2.9371,-0.1413 3.5653,0.8175 0.5381,0.8212 0.6096,1.5067 0.4272,4.0923 -0.1206,1.7083 -0.4774,3.6052 -0.793,4.2155 -0.3156,0.6103 -0.5754,1.4089 -0.5774,1.7748 0,0.8901 -1.7242,4.5465 -2.138,4.5465 -0.18,0 -0.5213,-0.4259 -0.7585,-0.9465 l -0.4313,-0.9465 -1.5214,0.8541 c -0.8368,0.4698 -1.8086,1.2187 -2.1595,1.6643 -0.5422,0.6886 -1.4931,4.7208 -2.3987,10.1726 l -0.228,1.3722 7.2124,4.8174 c 3.9668,2.6497 7.4483,5.1927 7.7365,5.6512 0.2884,0.4584 0.6318,1.598 0.7632,2.5324 0.2886,2.051 -0.378,2.9216 -1.7424,2.2758 -2.2124,-1.047 -3.8286,-1.635 -8.7973,-3.2004 -2.9649,-0.9341 -5.5057,-1.6983 -5.6462,-1.6983 -0.1406,0 -0.4174,0.4258 -0.6153,0.9463 -0.361,0.9495 -1.1005,0.9346 -1.1005,-0.022 0,-0.281 -0.1635,-0.6119 -0.3633,-0.7354 -0.4248,-0.2626 -11.74819,3.2672 -13.76086,4.2896 -1.48079,0.7522 -1.88167,0.8319 -2.2634,0.4502 z', 275, 590, 'HSN-WUH', 30, 51, 7807576]
    ];

function setPlanes(map, locations) {
        var mu = 'marker/';
        var as = 'fp.asp?F=';
        for (var i = 0; i < locations.length; i++) {
            var place = locations[i];
            var plane = { path: place[5], strokeColor: '#000', fillColor: '#000', fillOpacity: 1, rotation: place[6], anchor: new google.maps.Point(179, 170), scale: 0.10 };
            var myLatLng = new google.maps.LatLng(place[1], place[2]);
            var marker   = new google.maps.Marker({position: myLatLng, map: map, icon: plane, title: place[4]+ ': ' + place[8] + ' ('+place[0]+') @ ' + place[7] + 'km/h', zIndex: place[3], url: as+place[11]});
            google.maps.event.addListener(marker, 'click', function() { NewWindow(this.url,'name','770','490','Yes');return false; });
        }
    }

似乎show / hide功能相当慢并且使用了大量资源。使用自定义图层进行此操作会更容易,更快捷吗?我也尝试过这种方法,但我也无法做到这一点。

任何帮助高度赞赏。提前谢谢。

2 个答案:

答案 0 :(得分:0)

在尝试了一些之后,我已经解决了这个问题。

首先需要在initialize()

之前定义变量
var apts = [];

然后我可以简单地添加一个

apts.push(marker);

在创建标记的函数中的标记定义之后。

整个代码看起来像是:

    var as = 'app/info/airports/';
    var apt    = new google.maps.MarkerImage('marker/airport.png', null, null, new google.maps.Point(8,14), new google.maps.Size(20,20));
    var shape = {coord: [1, 1, 1, 20, 18, 20, 18 , 1], type: 'poly'};
    var mu = 'marker/';
    var as = 'fp.asp?F=';
    var apts = [];

    function initialize() {

      mapOptions   = {center: new google.maps.LatLng(30.7838001251, 114.2080001831), zoom: 5, mapTypeId: google.maps.MapTypeId.TERRAIN, streetViewControl: false, scaleControl: true, zoomControl: true, zoomControlOptions: { style: google.maps.ZoomControlStyle.SMALL }};
      map          = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
      setMarkers(map, points);

    $('#dispToggle').on('change', function(){
        toggleVisibility(this.checked, apts)
    });

    var toggleVisibility = function(show, markers){
       for (var i = 0, length = markers.length; i < length; i++)
            markers[i].setVisible(show);
    }

    function setMarkers(map, locations) {
        for (var i = 0; i < locations.length; i++) {
            var place = locations[i];
            var flag = new google.maps.MarkerImage(mu+place[5], null, null, new google.maps.Point(place[8],place[7]), new google.maps.Size(place[6],place[7]));
            flag.size = new google.maps.Size(place[9], place[10]);
            var myLatLng = new google.maps.LatLng(place[1], place[2]);
            var marker = new google.maps.Marker({map: map, position: myLatLng, icon: flag, shape: shape, title: place[0]+', '+place[4]+' ('+place[8]+')', zIndex: place[3], url: as+place[11], visible: false});
            google.maps.event.addListener(marker, 'click', function() {window.open(this.url, 'AS'); });
            apts.push(marker);
        }
    }

    var points = [
     ['CAI', 30.1219005585, 31.4055995941, 1, 'Cairo', 'orange_MarkerC.png', 16, 27, 8, 28, 48, '8'],
     ['BNE', -27.3841991425, 153.1170043945, 2, 'Brisbane', 'orange_MarkerC.png', 16, 27, 8, 28, 48, '219'],
     ['BRU', 50.9014015198, 4.4844398499, 3, 'Brussels Zaventem', 'orange_MarkerC.png', 16, 27, 8, 28, 48, '357'],
     ['CGH', -23.6261100769, -46.6563873291, 4, 'Sao Paulo Congonhas', 'orange_MarkerC.png', 16, 27, 8, 28, 48, '479']
    ];

虽然这对于标记很有用,但它对于折线根本不起作用。如何将它们组合在一起并听取鼠标事件并仍然可以打开和关闭它们?

答案 1 :(得分:0)

经过多次尝试和搜索,我终于找到了一条路。这是所需的代码。

    // First define the variable
    var flt    = [];

    function initialize() {
      mapOptions   = {center: new google.maps.LatLng(30.7838001251, 114.2080001831), zoom: 4, mapTypeId: google.maps.MapTypeId.TERRAIN, streetViewControl: false, scaleControl: true, zoomControl: true, zoomControlOptions: { style: google.maps.ZoomControlStyle.SMALL }};
      map          = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

      // This is to attach the polylines to the map or remove them
      // It cycles through all the values in the array
      var toggleRoutes = function(show, markers){
         for (var i = 0, length = markers.length; i < length; i++)
              if (show) {
                markers[i].setMap(map);
              } else {
                markers[i].setMap(null);
              }
      }
    }

    // This is the JSON that holds the information for the polylines
    var routes = [
     ['WUH', 'BHY', 30.7838001251, 114.2080001831, 21.5394001007, 109.2939987183, 1, 7, 7807505, '#FF0000', '530'],
     ['WUH', 'DSN', 30.7838001251, 114.2080001831, 39.49, 109.861388889, 1, 7, 7807538, '#FF0000', '3923'],
     ['WUH', 'UYN', 30.7838001251, 114.2080001831, 38.2691993713, 109.7310028076, 1, 7, 7807557, '#FF0000', '643']
    ];

    // Using this function, I can create a polyline for each record in the JSON
    function setRoutes(map, flights) {
        for (var j = 0; j < flights.length; j++) {
            var route  = flights[j];
    // Add the [j] to number the polyline in the array
            flt[j] = new google.maps.Polyline({path: [new google.maps.LatLng(route[2], route[3]), new google.maps.LatLng(route[4], route[5])], strokeColor: route[9], strokeOpacity: route[6], strokeWeight: route[7], geodesic: true, url: fp+route[8], visible: true });
            google.maps.event.addListener(flt[j], 'click', function() { NewWindow(this.url,'name','770','490','Yes');return false; });
        }
    }

希望它也会帮助其他人。