此问题与previous question。
有关我的Mapbox地图中有一个按钮列表,还有一个jQuery函数可以对它们的值进行排序,并相应地向我显示特定的图层。因为这部分交互是关于显示栅格地图图层,所以我希望每个选择都有一个fitBounds
事件。
我想知道我是否可以使用getLayer
提取边界?由于它为每个给定的层提供了一系列属性,因此我需要提取源链接,然后可以将其与getBounds
一起使用。但是如何?
这是我的代码。
$("#yearselect button").click(function(){
var mapnum = $.text(this);
if ($(this).hasClass("selected")) {
$(this).removeClass("selected");
map.setLayoutProperty(mapnum, "visibility", "none");
basicreset(); // resets other filters
yearreset(); // resets previous selections
}
else {
$(this).addClass("selected");
$("#yearselect button").not(this).removeClass("selected");
$("#typeselect input").prop("checked", true);
$("#yearselect button").each(function() {
map.setLayoutProperty(($.text(this)), "visibility", "none");
});
map.setLayoutProperty("railway", "visibility", "visible");
map.setLayoutProperty("railway case", "visibility", "visible");
map.setLayoutProperty("sat", "visibility", "visible");
map.setLayoutProperty(mapnum, "visibility", "visible");
map.setFilter("vislis-1sep2017", ["none", [">=", "Opening date", mapnum],["<=", "Closing date", mapnum], ["in", "Opening date", "Closing date", "??"]]);
map.setFilter("railway", ["none", [">", "Opening date", mapnum],["<", "Closing date", mapnum], ["in", "Opening date", "Closing date", "??"]]);
map.setFilter("railway case", ["none", [">", "Opening date", mapnum],["<", "Closing date", mapnum], ["in", "Opening date", "Closing date", "??"]]);
map.setPaintProperty("limits", "line-color", "#ffffff");
document.getElementById('active-year').innerText = mapnum; // updates time slider
document.getElementById('ranger').value = mapnum; // moves time slider's range
$("#resetslider").hide();
}
});
答案 0 :(得分:0)
如果我理解正确,您需要设置地图的视口以匹配给定图层的边界。你应该能够这样做:
map.fitBounds(map.getSource(map.getLayer('my-layer').source).bounds);