4
4

3 に答える 3

4

私はこの同じ問題を自分で抱えていて、それを解決しました。

グローバル環境 (使用している関数の外側) で空の変数を定義する必要がありました。これは完全なスクリプトなどではありませんが、私が説明している一般的な考え方は次のとおりです。

    var info;  // CREATING INFO VARIABLE IN GLOBAL ENVIRONMENT
    function makeMap() {
    ..... geojsons, styles, other stuff ....

    // REMOVING PREVIOUS INFO BOX
    if (info != undefined) {
    info.removeFrom(map)
    }

    // making current layer's info box
    info = L.control();

    info.onAdd = function (map) {
    this._div = L.DomUtil.create('div', 'info');
    this.update();
    return this._div;
    };

    info.update = function (props) {
    this._div.innerHTML = '<h4>Data by Zip Code</h4>' + (props ?
    '<b>Zip Code:  ' + props.id + '</b><br />Value:  ' + matchKey(props.id, meanById)
    : 'Hover over a zip code');
    };

    info.addTo(map);

    ..... other stuff again ......

    } // end function

私は Leaflet と JavaScript の両方に非常に慣れていないため、提供したマップ リンクに投稿したコードの info.removeFrom(map) 行をどこに配置すればよいか正確にはわかりませんが、 'info.removeFrom(map)' で正しいトラック。

ここをいじることで、動的な凡例と情報ボックスで問題を解決することができました: http://jsfiddle.net/opensas/TnX96/

于 2013-08-13T20:07:04.080 に答える
2

追加したのと同じようにコントロールを削除したいと思います。

この場合、リーフレットはremove()メソッドと同様の直接メソッドを提供しますaddTo(map)。

ここに画像の説明を入力

例-

凡例コントロールを削除するときはいつでも、次のコードを使用します-

コントロールの作成-

var legendControl = L.control({position: 'bottomleft'});
    legendControl.addTo(mymap);

コントロールを削除-

legendControl.remove();

詳細については、こちらを参照/クリックしてください...

于 2017-09-19T12:56:14.950 に答える
0

この質問が 1 年前に出されたという事実にもかかわらず、私は最近、同様の問題に対する解決策を自分で考え出さなければならなかったので、他の誰かが私のようにここにたどり着いた場合に備えて共有する必要があるように感じます.

LeafletのL.control()オブジェクトは技術的にはレイヤーではありません。これが、レイヤーの場合と同じようにオブジェクトを追加および削除しようとしてもうまくいかない理由です。

http://leafletjs.com/reference.html#icontrol

L.controlコンストラクターは「コントロールに必要なすべての DOM 要素を作成する」ことだけを要求するため、それ自体の HTML コンテンツは必要divに応じて更新および削除できます。したがって、コントロール フィーチャをマップに表示または非表示にするには、オブジェクトを追加または削除する代わりに、オブジェクトに含まれるL.controlの HTML コンテンツを調整するだけです。div空のdiv場合、コントロール フィーチャはマップに表示されません。

したがって、上記のスニペットは次のようになります。

//construct control, initialize div

info = L.control();
info.onAdd = function (map) {
this._div = L.DomUtil.create('div', 'info');
this.update();
return this._div;
};
if (two == true && black == true) { 
            function blkNineStyle(feature) {
                return {
                fillColor: getColor(feature.properties.pctBlack9000),
                weight: 2,
                opacity: 1,
                color: '#666',
                dashArray: '2',
                fillOpacity: 0.9
                };
            }

//set div content to empty string; makes control disappear from map

            info.getContainer().innerHTML='';

            map.removeLayer(geojson);
            geojson = L.geoJson(tracts, {style: blkNineStyle, onEachFeature: onEachFeature}).addTo(map);

//update content of control to make the control reappear

            info.update = function (props) {
                this._div.innerHTML = '<h4>Percent White population change</h4>' + (props ? '<b>' + props.name + '</b><br />' + props.pctBlack9000 + '%' : 'Hover over a tract');
            };

        }

 //other cases...
if (two == false && black == true) { 

//delete and update control where necessary

    info.getContainer().innerHTML='';
于 2014-10-08T16:45:59.703 に答える