0

$.get 呼び出しで持っている JSON データ変数を参照する必要があります。

取り込まれてから処理されるJSONデータがあります。

マーカーの表示と非表示に使用したいチェックボックスがいくつかあります。マーカーの forloop の下にあるチェックボックスのクリックイベントを使用して、表示と非表示の機能があります。

私が得ている問題は、最初のチェックボックスのみがすべてのマーカーを表示および非表示にし、他のすべてのチェックボックスは何もしないことです。

HTML 出力が正しいことを確認しました。show または hide 関数で console.log() を実行すると、値が関数に取り込まれて正しく表示されます。したがって、問題は show および hide 関数の forloop にあるようです。データまたは場所変数が正しく参照されていない可能性があります。

これを正しく参照する方法についての助けは素晴らしいでしょう。

// JSON feed
$.get(mapURL + 'map/locations', function(result) {
    var locations = $.parseJSON(result);


    // Markers
    var markers = [];

    // Looping through the JSON data
    for (var i = 0, length = locations.length; i < length; i++) {

        var data = locations[i];

        // Creating a marker and putting it on the map
        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(data.lat, data.long),
            map: map,
            title: data.title,
            icon: iconSrc[data.category]
        });
        markers.push(marker);


    }// END for loop




    /** Shows all markers of a particular category, and ensures the checkbox is checked **/
    function show(category) {
        console.log('show ' + data.category);
        for (var i=0; i<locations.length; i++) {
            if (data.category == category) {
                markers[i].setVisible(true);
            }
        }
    }// END function show



    /** Hides all markers of a particular category, and ensures the checkbox is cleared **/
    function hide(category) {
        console.log('hide ' + data.category);

        for (var i=0; i<locations.length; i++) {
            if (data.category == category) {
              markers[i].setVisible(false);
            }
        }
    }// END function hide


    /** Action when checkbox is clicked **/
    $(".checkbox").click(function(){
        var cat = $(this).attr("value");

        // If checked
        if ( $(this).is(":checked") ){
            show(cat);
        }
        else {
            hide(cat);
        }
    });
});
4

1 に答える 1

1

dataループで宣言していないという理由だけでそれが起こっているのではありませんか? そのはず

function show(category) {
    console.log('show ' + data.category);
    for (var i=0; i<locations.length; i++) {
        var data = locations[i]; // <---- missing line
        if (data.category == category) {
            markers[i].setVisible(true);
        }
    }
}

（またはそのようなもの）

data変数が前のループから「リーク」するため、コードはこのような効果を生み出します。

于 2013-02-21T11:42:07.200 に答える