2016-04-13 11 views
1

ユーザのテキスト入力に基づいてマーカーをフィルタリングしようとしていますが、それを動作させる方法がわかりません。私はjavascriptとleaflet.jsを使用しています。これは、ハードコーディングされたフィルタを持つコードの例ですが、私はユーザーの入力に基づいてデータをフィルタリングできるようにしたいと考えています。ユーザの入力に基づいたフィルタマーカーleaflet.js

var stops = L.geoJson(points, { 
    onEachFeature: function (feature, layer) //functionality on click on feature 
    { 
    layer.bindPopup(String('Stop Name:' + ' ' + feature.properties.Stop_Name + '</br>' + 'Route:' + ' ' + feature.properties.Route)); 

    layer.on('mouseover', function (e) { 
     this.openPopup(); 
    }); 
    layer.on('mouseout', function (e) { 
     this.closePopup(); 
    }); 


    } 
    , filter: function(feature, layer) { 
    return feature.properties.Route == '10'; 
}}); 

私はすでにフィルタに結果を解析する方法がわから自分のページ上の検索ボックスを持っていなく

filter:function(feature, layer){ return feature.properties.Route == 'USER INPUT';} 

を設定する方法があります。

答えて

1

ユーザー入力をフィルタとして使用したり、イベントリスナーを使用したり、入力(「クリック」)またはサブスクリプションなどを使用して入力を取得して変数に配置し、次にその関数を呼び出して新しいgeojsonを追加できます新しいgeojsonを追加します。以下のような

何か:

function onSubmit() { 
    var results = L.geoJson(null, { 
    filter: function(feature, layer) { 
     return feature.properties.zonecode == userinput; 
    } 
    }).addTo(map); 
    results.addData(stops.toGeoJSON()); 
} 

古い結果を削除し、新しいものを追加する必要がありますが、これはあなたが始める必要があります。

関連する問題