MapImageLayer - 切换子图层可见性
这个示例展示了如何使用 MapImageLayer 的子图层并切换它们的可见性。各个子图层的属性在该图层的 子图层 属性中处理。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
// This layer has four sublayers. You can define the visibility of these layers in the
// sublayers property.
const layer = new MapImageLayer({
url: "https://sampleserver6.geosceneonline.cn/arcgis/rest/services/USA/MapServer",
sublayers: [
{
id: 3,
visible: false
},
{
id: 2,
visible: true
},
{
id: 1,
visible: true
},
{
id: 0,
visible: true
}
]
});
...
/*****************************************************************
* Listen for when buttons on the page have been clicked to turn
* layers on and off in the Map Service. You can find a sublayer
* using mapImageLayer.findSublayerById.
*****************************************************************/
const sublayersElement = document.querySelector(".sublayers");
on(sublayersElement, ".sublayers-item:click", (event) => {
const id = event.target.getAttribute("data-id");
if (id) {
const sublayer = layer.findSublayerById(parseInt(id));
const node = document.querySelector(".sublayers-item[data-id='" + id + "']");
sublayer.visible = !sublayer.visible;
node.classList.toggle("visible-layer");
}
});