Leaflet access dynamic layers globally
3
I am adding layers to my map dynamically based on whats available in the MapServer. I am looping over them so I can add them in the LayerControl.
My issue is that I dont have access to the layers outside of the scope of the function which I need to run a map.hasLayer() function. What can I do to access the layers outside the fetch function to perform removeLayer and other things?
let url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Energy/Infrastructure/MapServer";
let serviceUrl = url+'?f=pjson';
fetch(serviceUrl, {method:"get"})
.then(function(response) {
return response.json();
})
.then(function(esriService) {
esriService.layers.forEach(function(layer) {
let layerName = layer.name.replace(/s/g, "");
let fullName = layer.name // return string
layerName = L.esri.dynamicMapLayer({
url: url,
layers: [layer.id]
}).addTo(map);
layerControl.addOverlay(layerName, fullName)
})
});
map.on('click', function (e) {
if (!map.hasLayer(mydefinedlayer)) {
console.log("Layer not displayed on map")
} else {
console.log("Layer displayed on map")
}
});
leaflet esri-leaflet
edited 8 hours ago
Vince
14.5k32748
asked 9 hours ago
geogrowgeogrow
6921620
add a comment |
3
I am adding layers to my map dynamically based on whats available in the MapServer. I am looping over them so I can add them in the LayerControl.
My issue is that I dont have access to the layers outside of the scope of the function which I need to run a map.hasLayer() function. What can I do to access the layers outside the fetch function to perform removeLayer and other things?
let url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Energy/Infrastructure/MapServer";
let serviceUrl = url+'?f=pjson';
fetch(serviceUrl, {method:"get"})
.then(function(response) {
return response.json();
})
.then(function(esriService) {
esriService.layers.forEach(function(layer) {
let layerName = layer.name.replace(/s/g, "");
let fullName = layer.name // return string
layerName = L.esri.dynamicMapLayer({
url: url,
layers: [layer.id]
}).addTo(map);
layerControl.addOverlay(layerName, fullName)
})
});
map.on('click', function (e) {
if (!map.hasLayer(mydefinedlayer)) {
console.log("Layer not displayed on map")
} else {
console.log("Layer displayed on map")
}
});
leaflet esri-leaflet
edited 8 hours ago
Vince
14.5k32748
asked 9 hours ago
geogrowgeogrow
6921620
add a comment |
3
3
3
I am adding layers to my map dynamically based on whats available in the MapServer. I am looping over them so I can add them in the LayerControl.
My issue is that I dont have access to the layers outside of the scope of the function which I need to run a map.hasLayer() function. What can I do to access the layers outside the fetch function to perform removeLayer and other things?
let url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Energy/Infrastructure/MapServer";
let serviceUrl = url+'?f=pjson';
fetch(serviceUrl, {method:"get"})
.then(function(response) {
return response.json();
})
.then(function(esriService) {
esriService.layers.forEach(function(layer) {
let layerName = layer.name.replace(/s/g, "");
let fullName = layer.name // return string
layerName = L.esri.dynamicMapLayer({
url: url,
layers: [layer.id]
}).addTo(map);
layerControl.addOverlay(layerName, fullName)
})
});
map.on('click', function (e) {
if (!map.hasLayer(mydefinedlayer)) {
console.log("Layer not displayed on map")
} else {
console.log("Layer displayed on map")
}
});
leaflet esri-leaflet
edited 8 hours ago
Vince
14.5k32748
asked 9 hours ago
geogrowgeogrow
6921620
I am adding layers to my map dynamically based on whats available in the MapServer. I am looping over them so I can add them in the LayerControl.
My issue is that I dont have access to the layers outside of the scope of the function which I need to run a map.hasLayer() function. What can I do to access the layers outside the fetch function to perform removeLayer and other things?
let url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Energy/Infrastructure/MapServer";
let serviceUrl = url+'?f=pjson';
fetch(serviceUrl, {method:"get"})
.then(function(response) {
return response.json();
})
.then(function(esriService) {
esriService.layers.forEach(function(layer) {
let layerName = layer.name.replace(/s/g, "");
let fullName = layer.name // return string
layerName = L.esri.dynamicMapLayer({
url: url,
layers: [layer.id]
}).addTo(map);
layerControl.addOverlay(layerName, fullName)
})
});
map.on('click', function (e) {
if (!map.hasLayer(mydefinedlayer)) {
console.log("Layer not displayed on map")
} else {
console.log("Layer displayed on map")
}
});
leaflet esri-leaflet
leaflet esri-leaflet
edited 8 hours ago
Vince
14.5k32748
asked 9 hours ago
geogrowgeogrow
6921620
edited 8 hours ago
Vince
14.5k32748
asked 9 hours ago
geogrowgeogrow
6921620
edited 8 hours ago
Vince
14.5k32748
edited 8 hours ago
Vince
14.5k32748
edited 8 hours ago
Vince
14.5k32748
14.5k32748
asked 9 hours ago
geogrowgeogrow
6921620
asked 9 hours ago
geogrowgeogrow
6921620
asked 9 hours ago
geogrowgeogrow
6921620
6921620
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
3
Just keep their names in an array in the window object, such as:
window.dynamicLayerNames = ;
let url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Energy/Infrastructure/MapServer";
let serviceUrl = url+'?f=pjson';
fetch(serviceUrl, {method:"get"})
.then(function(response) {
return response.json();
})
.then(function(esriService) {
esriService.layers.forEach(function(layer) {
let layerName = layer.name.replace(/s/g, "");
let fullName = layer.name // return string
layerName = L.esri.dynamicMapLayer({
url: url,
layers: [layer.id]
}).addTo(map);
layerControl.addOverlay(layerName, fullName);
window.dynamicLayerNames.push(layerName);
})
});
answered 9 hours ago
UlasUlas
1889
Thanks will have a go with that. Not sure if the hasLayer() function can take the layer itself or if it has to be the variable name of the layer
– geogrow
9 hours ago
I think it did work, that you. That will move me forward
– geogrow
9 hours ago
Methodmap.hasLayer()requires layer object. It worked because what you calllayerNamein your code is actually layer object.
– TomazicM
8 hours ago
add a comment |
Your Answer
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "79"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fgis.stackexchange.com%2fquestions%2f311609%2fleaflet-access-dynamic-layers-globally%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
3
Just keep their names in an array in the window object, such as:
window.dynamicLayerNames = ;
let url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Energy/Infrastructure/MapServer";
let serviceUrl = url+'?f=pjson';
fetch(serviceUrl, {method:"get"})
.then(function(response) {
return response.json();
})
.then(function(esriService) {
esriService.layers.forEach(function(layer) {
let layerName = layer.name.replace(/s/g, "");
let fullName = layer.name // return string
layerName = L.esri.dynamicMapLayer({
url: url,
layers: [layer.id]
}).addTo(map);
layerControl.addOverlay(layerName, fullName);
window.dynamicLayerNames.push(layerName);
})
});
answered 9 hours ago
UlasUlas
1889
Thanks will have a go with that. Not sure if the hasLayer() function can take the layer itself or if it has to be the variable name of the layer
– geogrow
9 hours ago
I think it did work, that you. That will move me forward
– geogrow
9 hours ago
Methodmap.hasLayer()requires layer object. It worked because what you calllayerNamein your code is actually layer object.
– TomazicM
8 hours ago
add a comment |
3
Just keep their names in an array in the window object, such as:
window.dynamicLayerNames = ;
let url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Energy/Infrastructure/MapServer";
let serviceUrl = url+'?f=pjson';
fetch(serviceUrl, {method:"get"})
.then(function(response) {
return response.json();
})
.then(function(esriService) {
esriService.layers.forEach(function(layer) {
let layerName = layer.name.replace(/s/g, "");
let fullName = layer.name // return string
layerName = L.esri.dynamicMapLayer({
url: url,
layers: [layer.id]
}).addTo(map);
layerControl.addOverlay(layerName, fullName);
window.dynamicLayerNames.push(layerName);
})
});
answered 9 hours ago
UlasUlas
1889
Thanks will have a go with that. Not sure if the hasLayer() function can take the layer itself or if it has to be the variable name of the layer
– geogrow
9 hours ago
I think it did work, that you. That will move me forward
– geogrow
9 hours ago
Methodmap.hasLayer()requires layer object. It worked because what you calllayerNamein your code is actually layer object.
– TomazicM
8 hours ago
add a comment |
3
3
3
Just keep their names in an array in the window object, such as:
window.dynamicLayerNames = ;
let url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Energy/Infrastructure/MapServer";
let serviceUrl = url+'?f=pjson';
fetch(serviceUrl, {method:"get"})
.then(function(response) {
return response.json();
})
.then(function(esriService) {
esriService.layers.forEach(function(layer) {
let layerName = layer.name.replace(/s/g, "");
let fullName = layer.name // return string
layerName = L.esri.dynamicMapLayer({
url: url,
layers: [layer.id]
}).addTo(map);
layerControl.addOverlay(layerName, fullName);
window.dynamicLayerNames.push(layerName);
})
});
answered 9 hours ago
UlasUlas
1889
Just keep their names in an array in the window object, such as:
window.dynamicLayerNames = ;
let url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Energy/Infrastructure/MapServer";
let serviceUrl = url+'?f=pjson';
fetch(serviceUrl, {method:"get"})
.then(function(response) {
return response.json();
})
.then(function(esriService) {
esriService.layers.forEach(function(layer) {
let layerName = layer.name.replace(/s/g, "");
let fullName = layer.name // return string
layerName = L.esri.dynamicMapLayer({
url: url,
layers: [layer.id]
}).addTo(map);
layerControl.addOverlay(layerName, fullName);
window.dynamicLayerNames.push(layerName);
})
});
answered 9 hours ago
UlasUlas
1889
answered 9 hours ago
UlasUlas
1889
answered 9 hours ago
UlasUlas
1889
answered 9 hours ago
UlasUlas
1889
1889
Thanks will have a go with that. Not sure if the hasLayer() function can take the layer itself or if it has to be the variable name of the layer
– geogrow
9 hours ago
I think it did work, that you. That will move me forward
– geogrow
9 hours ago
Methodmap.hasLayer()requires layer object. It worked because what you calllayerNamein your code is actually layer object.
– TomazicM
8 hours ago
add a comment |
Thanks will have a go with that. Not sure if the hasLayer() function can take the layer itself or if it has to be the variable name of the layer
– geogrow
9 hours ago
I think it did work, that you. That will move me forward
– geogrow
9 hours ago
Methodmap.hasLayer()requires layer object. It worked because what you calllayerNamein your code is actually layer object.
– TomazicM
8 hours ago
Thanks will have a go with that. Not sure if the hasLayer() function can take the layer itself or if it has to be the variable name of the layer
– geogrow
9 hours ago
Thanks will have a go with that. Not sure if the hasLayer() function can take the layer itself or if it has to be the variable name of the layer
– geogrow
9 hours ago
I think it did work, that you. That will move me forward
– geogrow
9 hours ago
I think it did work, that you. That will move me forward
– geogrow
9 hours ago
Method
map.hasLayer() requires layer object. It worked because what you call layerName in your code is actually layer object.– TomazicM
8 hours ago
Method
map.hasLayer() requires layer object. It worked because what you call layerName in your code is actually layer object.– TomazicM
8 hours ago
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Geographic Information Systems Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fgis.stackexchange.com%2fquestions%2f311609%2fleaflet-access-dynamic-layers-globally%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
