0

Google マップに JSON データを入力しました。マップに表示するデータのカテゴリを選択するためのチェックボックスがいくつかありました。チェックボックスをクリックすると、Ajax を介して新しい JSON データが呼び出されます。ボックスのチェックを外すと、すべてのマーカーの配列がループされ、カテゴリがチェックされていないすべてのマーカーが削除されます。

ほとんどの場合は機能しますが、マーカーが消えて再び表示されることがあります。彼らはまだ配列か何かにいるようです...

$( "input[type=checkbox]" ).change(function() {
        var data ='';
        var checkbox = $(this);
        var checkboxVal = $(this).val();
        console.log('click');

        if (checkbox.is(':checked')) {
            $('.loader').show();

            $("input:checkbox[name=poi_categories]:checked").each(function() {
                data = data + checkboxVal + ',';
                $.ajax({
                    type: "POST",
                    url: window.location.pathname,
                    data: "categorie=" + data,
                    success:function(response){

                        json = JSON.parse(response);

                        for (var i = 0; i < json.length; i++) {
                            createMarker(json[i], data);
                        }
                        $('.loader').hide();
                    }
                });
            });
        } else {

            for (var i in markersArray) {
                if ( markersArray[i] != undefined) {
                    if( null == markersArray[i].cat || markersArray[i].cat == checkboxVal) {
                        markersArray[i].setMap(null);
                        delete(markersArray[i]);
                    }
                }
            }
        } 
    });

最後のforループに間違いがあると確信していますが、何がわかりません...

編集 ：

Jsコード全体は次のとおりです：http://jsfiddle.net/5bMQm/

4

3 に答える 3

1

完全に誤解されています。ユーザーがチェックボックスをクリックするたびに、これを複数回行います。これが、マップから削除されたマーカーをmarkersArrayからも削除したい理由です。

根本的な問題を見つけたと思います。

あなたが持っている

createMarker(json[i], data);

だけ

function createMarker(marker) {

あなたが設定した

cat : marker.img

しかし、比較して

markersArray[i].cat == checkboxVal

あなたが仮定する（私は推測する）が含まれている必要があります

var checkboxVal = $(this).val();
..
data = data + checkboxVal + ',';

しかし、決してしません！data/checkboxval がマーカーに割り当てられることはありません!

for (var i in markersArray) {
    if ( markersArray[i] != undefined) {
        if( null == markersArray[i].cat || markersArray[i].cat == checkboxVal) {
            markersArray[i].setMap(null);
            markersArray[i] = undefined; // <---
        }
    }
}
//cleanup
for (var i=markersArray.length;i>0;i--) {
    if (markersArray[i]==undefined]) {
        markersArray.splice(i, 1);
    }
}
于 2013-09-30T13:51:43.530 に答える
1

編集：あなたが今何をしようとしているのか理解しています。

for (var i = 0, l = markersArray.length; i < l; i++) {
  if ( markersArray[i] != undefined) {
    if( null == markersArray[i].cat || markersArray[i].cat == checkboxVal) {
      markersArray[i].setMap(null);
      markersArray.splice(i, 1);
      i--; l--;
    }
  }
}
于 2013-09-30T13:20:58.583 に答える