11

API を使用してカスタム コントロールを Google マップに追加しようとしています。既に 2 つのカスタム コントロールが追加されており、問題なく動作します。3 番目のコントロールのコードをコピーして貼り付けようとしましたが (もちろん、関連する変数を変更します)、上記のエラーが表示され続けます (タイトルに)。

Chrome コンソールと Firebug は、特定の問題を指摘していないようです (Google マップ API コード内で壊れています)。行を徐々にコメントアウトすることで、次の特定の行に絞り込みました。

map.controls[google.maps.ControlPosition.TOP_RIGHT].push(churchControlDiv);

コントロールを追加するための完全なコードは次のとおりです。

function ChurchControl(churchControlDiv, map) {
churchControlDiv.style.padding = '5px 0px';
var churchControlUI = document.createElement('DIV');
churchControlUI.style.backgroundColor = 'white';
churchControlUI.style.borderStyle = 'solid';
churchControlUI.style.borderWidth = '1px';
churchControlUI.style.borderColor = 'gray';
churchControlUI.style.boxShadow = 'rgba(0, 0, 0, 0.398438) 0px 2px 4px';
churchControlUI.style.cursor = 'pointer';
churchControlUI.style.textAlign = 'center';
churchControlUI.title = 'Click to see Churches';
churchControlDiv.appendChild(churchControlUI);
var churchControlText = document.createElement('DIV');
churchControlText.style.fontFamily = 'Arial,sans-serif';
churchControlText.style.fontSize = '13px';
churchControlText.style.padding = '1px 6px';
churchControlText.style.fontWeight = 'bold';
churchControlText.innerHTML = 'Churches<br>แสดงจำนวนคริสเตียน';
churchControlUI.appendChild(churchControlText);

google.maps.event.addDomListener(churchControlUI, 'click', function() {
    toggle(churches);
    if (churchControlText.style.fontWeight == 'bold') {
        churchControlText.style.fontWeight = 'normal';
    } else {
        churchControlText.style.fontWeight = 'bold';
    }
});

google.maps.event.addDomListener(churchControlUI, 'mouseover', function() {
    churchControlUI.style.backgroundColor = '#e8e8e8';
});

google.maps.event.addDomListener(churchControlUI, 'mouseout', function() {
    churchControlUI.style.backgroundColor = 'white';
});
}

function initialize(){
    map = new google.maps.Map(document.getElementById("map_canvas"), {
    center: centerLatLng,
    zoom: 7,
    streetViewControl: false,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var churchControlDiv = document.createElement('DIV');
    var churchControlDiv = new ChurchControl(churchControlDiv, map);
    churchControlDiv.index = 3;
    map.controls[google.maps.ControlPosition.TOP_RIGHT].push(churchControlDiv);
}

何か案は？3つのコントロールを持つことが問題になる理由は何ですか?

4

3 に答える 3

2

あなたのコードに非常に近いチュートリアルに従いました。

末尾近くのこの行を変更する必要があります

var churchControlDiv = new ChurchControl(churchControlDiv, map);

ChurchControlDiv は上書きされるべきではないためchurchControlDiv、または別の名前に置き換えます。churchControl

ここを参照してくださいhttp://jsfiddle.net/FTjnE/2/

//CHANGEDクリックのアラートと新しいマップセンターで変更をマークしました

于 2012-04-20T13:59:35.000 に答える