Javascript 删除背景地图单张

我在用传单做一张欧洲的克隆植物图。我想删除贴图，以便只有cloropleth层可见（背景为白色）

我曾尝试使用不同版本的map.removeLayer，但在不删除所有图层的情况下无法进行更改

我还尝试更改css中的.传单容器

有没有关于如何删除背景地图并将彩色图层保留在国家上的想法

<script type="text/javascript" src="europe_countries.js"></script>

<script type="text/javascript">

    var map = L.map('map').setView([50.888571, 10.413779], 3);



    L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
        maxZoom: 18,
        attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
            '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
            'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
        id: 'mapbox.light'
    }).addTo(map);


    // control that shows state info on hover
    var 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>US Population Density</h4>' +  (props ?
            '<b>' + props.name + '</b><br />' + props.density + ' people / mi<sup>2</sup>'
            : 'Hover over a state');
    };

    info.addTo(map);


    // get color depending on population density value
    function getColor(d) {
        return d > 1000 ? '#800026' :
                d > 500  ? '#BD0026' :
                d > 200  ? '#E31A1C' :
                d > 100  ? '#FC4E2A' :
                d > 50   ? '#FD8D3C' :
                d > 20   ? '#FEB24C' :
                d > 10   ? '#FED976' :
                            '#FFEDA0';
    }

    function style(feature) {
        return {
            weight: 2,
            opacity: 1,
            color: 'white',
            dashArray: '3',
            fillOpacity: 0.7,
            fillColor: getColor(feature.properties.density)
        };
    }

    function highlightFeature(e) {
        var layer = e.target;

        layer.setStyle({
            weight: 2,
            color: '#666',
            dashArray: '',
            fillOpacity: 0.7
        });

        if (!L.Browser.ie && !L.Browser.opera && !L.Browser.edge) {
            layer.bringToFront();
        }

        info.update(layer.feature.properties);
    }

    var geojson;

    function resetHighlight(e) {
        geojson.resetStyle(e.target);
        info.update();
    }

    function zoomToFeature(e) {
        map.fitBounds(e.target.getBounds());
    }

    function onEachFeature(feature, layer) {
        layer.on({
            mouseover: highlightFeature,
            mouseout: resetHighlight,
            click: zoomToFeature
        });
    }

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

    map.attributionControl.addAttribution('Population data &copy; <a href="http://census.gov/">US Census Bureau</a>');


    var legend = L.control({position: 'bottomright'});

    legend.onAdd = function (map) {

        var div = L.DomUtil.create('div', 'info legend'),
            grades = [0, 10, 20, 50, 100, 200, 500, 1000],
            labels = [],
            from, to;

        for (var i = 0; i < grades.length; i++) {
            from = grades[i];
            to = grades[i + 1];

            labels.push(
                '<i style="background:' + getColor(from + 1) + '"></i> ' +
                from + (to ? '&ndash;' + to : '+'));
        }

        div.innerHTML = labels.join('<br>');
        return div;
    };

    legend.addTo(map);

  function drawMap(tile){
    map.eachLayer(function (layer) {
        map.removeLayer(layer);
    });
    map.addLayer(tile);
}

</script>

var map=L.map（'map'）.setView（[50.888571,10.413779]，3）；
L.tileLayer（'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png？access_token=pk.eyj1ijoibwwwwym94iiwiysi6imnpejy4nxvycta2emycxbdhrqcmz3n3gifq.rjfig214ariislb6b5aw'{
maxZoom:18，
属性：“映射数据©；贡献者”+
', ' +
“图像”，
id:“地图盒。灯光”
}).addTo（地图）；
//控件，该控件在悬停时显示状态信息
var info=L.control（）；
info.onAdd=函数（映射）{
这个.u div=L.DomUtil.create（'div'，'info'）；
这个.update（）；
把这个还给我；
};
info.update=功能（道具）{
这个._div.innerHTML=‘美国人口密度’+（道具？
''+props.name+'
'+props.density+'people/mi2'
：“悬停在状态上”）；
};
信息地址（地图）；
//根据“总体密度”值获取颜色
函数getColor（d）{
返回d>1000？“#800026”：
d>500？“#BD0026”：
d>200？“#E31A1C”：
d>100？“#FC4E2A”：
d>50？“#FD8D3C”：
d>20？“#2月24日c”：
d>10？“#1976年2月”：
#FFEDA0"；
}
功能样式（特征）{
返回{
体重：2，
不透明度：1，
颜色：'白色'，
dashArray:'3'，
不透明度：0.7，
fillColor:getColor（feature.properties.density）
};
}
功能高亮功能（e）{
var层=e.目标；
layer.setStyle({
体重：2，
颜色：'#666'，
dashArray:“”，
填充不透明度：0.7
});
如果（！L.Browser.ie&&！L.Browser.opera&&！L.Browser.edge）{
层。布氏体（）；
}
信息更新（图层、特征、属性）；
}
var-geojson；
功能重置突出显示（e）{
geojson.resetStyle（e.target）；
info.update（）；
}
函数ZoomTof性质（e）{
fitBounds（e.target.getBounds（））；
}
功能onEachFeature（功能，图层）{
分层({
鼠标悬停：Highlight功能，
mouseout:resetHighlight，
单击：缩放自然
});
}
geojson=L.geojson（statesData{
风格：风格，
onEachFeature:onEachFeature
}).addTo（地图）；
map.attributecontrol.addAttribute（'Population data©；'）；
var legend=L.control（{position:'bottomright'}）；
legend.onAdd=函数（映射）{
var div=L.DomUtil.create（'div'，'info legend'），
等级=[0,10,20,50,100,200,500,1000]，
标签=[]，
从,到,；
对于（变量i=0；i”）；
返回div；
};
图例。添加到（地图）；
功能绘图图（平铺）{
map.eachLayer（函数（层）{
map.removeLayer（层）；
});
添加图层（平铺）；
}

CSS:

html，正文{
身高：100%；
保证金：0；
}
#地图{
宽度：600px；
高度：400px；
}
#地图{宽度：800px；高度：500px；}
.info{padding:6px 8px；font:14px/16px Arial，Helvetica，无衬线；背景：白色；背景：白色；方框阴影：0.15px rgba（0,0,0,0.2）；边框半径：5px；}.info h4{margin:0.05px；颜色：#777；}
.legend{文本对齐：左；行高：18px；颜色：#555；}.legend i{宽度：18px；高度：18px；浮动：左；边距右：8px；不透明度：0.7；}

如果我正确理解了问题，使用您在评论中添加的示例，我相信您可以

隐藏

.leaflet-tile-container {
    display: none;
}

你能帮我把这个弄清楚吗？你试过这个吗<代码>映射移除层（映射层[索引]）@Alex I无法使其在小提琴中工作（由于本地文件，无法使其在在线托管的小提琴中工作）。但基本上这张地图只是针对欧洲的：这里有一个指向我正在使用的Europe.js的链接：@ssten谢谢，但是它删除了cloropleth层，而不是它下面的实际地图，这也是我在其他解决方案中遇到的问题。
.leaflet-tile-container {
    display: none;
}