删除传单中的控制

joe*_*-gz 4 javascript leaflet

我在传单地图上有一个控件,可以在单击时创建另一个控件。第二次单击时,应删除第二个控件。我正在使用map.removeControl(customControl),但出现错误

未捕获的类型错误:t.remove 不是函数

对我在这里想念的东西有什么想法吗?

var customControl = L.Control.extend({

    options: {
        position: 'topleft'
    },

    onAdd: function (map) {
        var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control leaflet-control-custom toggleContainer');
        return container;
    }
});

var menuControl = L.Control.extend({

    options: {
        position: 'topleft'
    },

    onAdd: function (map) {
        var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control leaflet-control-custom menuControl');
        container.onclick = function() {
            if (menuControlActive === true) {
                this.style.backgroundImage = 'url(./assets/close.jpg)'
                map.addControl(new customControl());
                menuControlActive = false
            } else {
                this.style.backgroundImage = 'url(./assets/open.jpg)'
                map.removeControl(customControl);
                menuControlActive = true
            }
        }
        return container;
    }
});
Run Code Online (Sandbox Code Playgroud)

joe*_*-gz 7

最终我自己想通了:

function createControl() {
customControl = L.control({position: 'topleft'});

    customControl.onAdd = function (map) {
        var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control leaflet-control-custom toggleContainer');
        return container;
    }
customControl.addTo(map)
}

var menuControl = L.Control.extend({

    options: {
        position: 'topleft'
    },

    onAdd: function (map) {
        var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control leaflet-control-custom menuControl');
        container.onclick = function() {
            if (menuControlActive === true) {
                this.style.backgroundImage = 'url(./assets/close.jpg)'
                createControl()
                menuControlActive = false
            } else {
                this.style.backgroundImage = 'url(./assets/open.jpg)'
                map.removeControl(customControl);
                menuControlActive = true
            }
        }
        return container;
    }
});
Run Code Online (Sandbox Code Playgroud)