This sample shows how to add an instance of MapImageLayer to a Map in a MapView and update thedefinition
of a sublayer.
// This layer has four sublayers. You can define the definitionExpression in each sublayer.
const layer = new MapImageLayer({
url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer",
sublayers: [
{
id: 3,
visible: false
},
{
id: 2,
visible: true
},
{
id: 1,
visible: true
},
{
id: 0,
visible: true,
definitionExpression: "pop2000 > 100000"
}
]
});
...
/*****************************************************************
* Listen for events on when the slider values have changed.
* When the slider value changes, apply the new value to the
* MapImageLayer definitionExpression.
*****************************************************************/
layer.when(() => {
const cities = layer.findSublayerById(0);
// calciteSliderChange is fired if the value changes after the mouse is released
function onChange(event) {
const value = event.currentTarget.value;
selectedPopulation = +value;
cities.definitionExpression = "pop2000 > " + selectedPopulation;
}
slider.addEventListener("calciteSliderChange", onChange);
// calciteSliderInput is fired any time the value changes, also when dragging
function onInput(event) {
const value = event.currentTarget.value;
sliderCount.innerHTML = value;
}
slider.addEventListener("calciteSliderInput", onInput);
});