传单-根据下拉菜单中的项目选择图层



我有一些代码可以生成一个简单的下拉菜单:

<select id="menu" onchange="updateOptions(this)">
<option value="option1" data-path="option1">option1</option>
<option value="option2" data-path="option2">option2</option>
<option value="option3" data-path="option3">option3</option>
</select><br>

我想做的是将选定的选项(指向已声明的传单tilelayer(作为层添加到传单贴图中。以下函数和变量的代码:

var option1 = L.tileLayer('mapelements/basestructure/option1/{z}/{x}/{y}.png'),
option2= L.tileLayer('mapelements/basestructure/option2/{z}/{x}/{y}.png')
option3= L.tileLayer('mapelements/basestructure/option3/{z}/{x}/{y}.png')
var menufaults = document.getElementById("menu");
function updateFaults(menufaults) {
map.eachLayer(function (layer) {
map.removeLayer(layer);
});
var menuoption1 = menufaults.options[menufaults.selectedIndex].value;
map.addLayer(menuoption1);
};

变量menuoption1从菜单中提取正确的选项值,但map.addLayer函数不喜欢将其作为输入。我得到一个"提供的对象不是层"错误。有没有办法将"选项值"传递给函数,使其与已声明为变量的平铺层相对应?

您可以创建一个对象来将每个选项的值映射到一个层,下面是一个示例:

const layersMap = { option1, option2, option3 };

然后做:

map.addLayer(layersMap[menuoption1]);

最新更新