0

ディレクトリを作成しています。この例では、医師用のディレクトリです。「locations」という JavaScript 配列を作成しました。訪問者は、マップ上のチェックボックスをオンにして、表示する医師の種類を選択できます。

これは、for ループでループする場所の配列のサンプルです。

var locations = [
    [0, 'Total Care', 1, 0, 0, 0, 0, 0, 'Lake Elsinore', '92530', 'CA', 33.6603, -117.3830, '(951) 674-8779', 1],
    ... etc
    ];

これは各キーを説明します

locations[i][0] = business claimed or not (0 = unclaimed and 1 is claimed)  
locations[i][1] = name  
locations[i][2] = if general practitioner = 1, else = 0  
locations[i][3] = if surgeon = 1, else = 0  
locations[i][4] = if cardiologist = 1, else = 0  
locations[i][5] = if urologist = 1, else = 0    
locations[i][6] = if gynecologist = 1, else = 0  
locations[i][7] = if pulmonologist = 1, else = 0  
locations[i][8] = city  
locations[i][9] = zip code  
locations[i][10] = state  
locations[i][11] = latitude  
locations[i][12] = longitude  
locations[i][13] = phone number  
locations[i][14] = z-index

すべて正常に動作します。訪問者が名前で検索できるように、検索機能があります。以下の Google マップ コードでは、検索機能に入力された医師のマーカーで infoBox を開く方法を見つけたいと考えてい ます

ここ }

過去 3 日間、解決策を見つけようとしていましたが、見つからないので、助けていただければ幸いです。これは Google マップ コードです。

var infoBox = null;  
function initialize()  
    {  
    var centerMap = new google.maps.LatLng(33.6603, -117.3830);  
    var mapOptions = {zoom: 11,center: centerMap,mapTypeId: google.maps.MapTypeId.ROADMAP}  
    var map = new google.maps.Map(document.getElementById('googleMap'), mapOptions);  
    setMarkers(map, locations);  
    }

function setMarkers(map, markers)  
    {  
    var image = {url: 'images/marker.png',size: new google.maps.Size(17, 23),origin: new google.maps.Point(0,0),anchor: new google.maps.Point(8, 23)};  
    gpr = $('#check1').is(':checked') ? 1 : 0; // general practitioner  
    srg = $('#check2').is(':checked') ? 1 : 0; // surgeon  
    car = $('#check3').is(':checked') ? 1 : 0; // cardiologist  
    uro = $('#check4').is(':checked') ? 1 : 0; // urologist  
    gyn = $('#check5').is(':checked') ? 1 : 0; // gynecologist  
    pul = $('#check6').is(':checked') ? 1 : 0; // pulmonologist

    for (var i = 0; i < markers.length; i ++)  
        {  
        var locations = markers[i];  
        var siteLatLng = new google.maps.LatLng(locations[11], locations[12]);  
        var boxText = document.createElement('div');  
        boxText.style.cssText = 'some styling';  
        link = locations[1].replace(' ','_');
        link = link.toLowerCase();  

        // find out if this genre of doctor was searched for  
        setMarker = 0;  
        if (gpr == 1){if (locations[2] == 1){setMarker = 1;}}  
        if (srg == 1){if (locations[3] == 1){setMarker = 1;}}  
        if (car == 1){if (locations[4] == 1){setMarker = 1;}}  
        if (uro == 1){if (locations[5] == 1){setMarker = 1;}}  
        if (gyn == 1){if (locations[6] == 1){setMarker = 1;}}  
        if (pul == 1){if (locations[7] == 1){setMarker = 1;}}  

        // if one of the checkboxes was checked  
        if (setMarker == 1)  
            {
            if (locations[0])
                {  
                boxText.innerHTML = 'some html with link'; // claimed business  
                }  
            else  
                {  
                boxText.innerHTML = 'some html without link'; // unclaimed business  
                }  
            var infoBoxOptions = {content: boxText,disableAutoPan: false,maxWidth: 0,pixelOffset: new google.maps.Size(5, -80),zIndex: locations[14],boxStyle: {background: "url('images/tip.png') no-repeat",opacity: 0.9,width: "405px",height: "75px",border: '0px solid #900'},closeBoxMargin: "13px 5px 5px 5px",closeBoxURL: "images/close.gif",infoBoxClearance: new google.maps.Size(1, 1),isHidden: false,pane: "floatPane",enableEventPropagation: false};
            var marker = new google.maps.Marker({position: siteLatLng,map: map,title: locations[1],zIndex: locations[14],icon: image,html: boxText});  
            google.maps.event.addListener(marker, 'click', function (e) {infoBox.setContent(this.html);infoBox.open(map, this);});  
            var infoBox = new InfoBox(infoBoxOptions);  
            }  
        }  
    }  

あなたの助けは大歓迎です。ありがとうございました。

4

1 に答える 1

0

誤解していない限り、タイトルが検索テキストと一致するまでマーカーをループして、そのマーカーで適切な情報ボックスを開くことができます。何かのようなもの:

$('#searchButton').click(function() {
    var searchText = $('#searchBox').val();
    for (var i = 0; i < markers.length; i++) {
        if (markers[i].title.indexOf(searchText) > -1)
            infoBoxes[i].open(map, markers[i]);
    }
});

この例では、2 つの既存のマーカーの並列配列とそれに対応する情報ボックスがあることを前提としています。

于 2013-09-21T01:10:34.883 に答える