|
POST
|
You mean to change from one theme (group to another group) like in the above mentioned application? example From Surface Water Bodies to Protected area and so on? You are right @ Robert Scheitlin, GISP I am not switching between web maps, its only loading another map layers.This was accomplished via a widget created for such purpose as there is no way to group service into categories as of today in arcgis api for javascript 3.xx, pardon me if there is possibility to group layers.
... View more
02-15-2018
06:19 AM
|
0
|
15
|
1479
|
|
POST
|
Hi Ikbel, Here is the code in your case. Justs copy and replace the _onCkSelectNodeClick function by this code. Couldn't find a way to upload the file. /////////
// id = "Démographie_2496" , title ="Population Totale"
//id = "Démographie_1127" , title ="Nombre de naissances"
//id = "Démographie_4091" , title ="Solde migratoire"
//id = "Démographie_2202" , title ="Nombre de mariages"
//id = "Démographie_4468" , title ="Nombre de divorces"
//id = "Démographie_7450" , title ="Nombre de décès"
//id = "Démographie_348" , title ="Taux Brut de Natalité"
//id = "Démographie_8957" , title ="Taux Global de Fécondité"
//id = "Démographie_1881" , title ="Indice Synthétique de Fécondité"
//id = "Démographie_5333" , title ="Taux d'Accoissement Naturel"
///////////////////////////////
onCkSelectNodeClick: function(layerInfo, ckSelect, evt) {
if (ckSelect.checked) {
layerInfo.setTopLayerVisible(true);
if (layerInfo.title === 'Population Totale') {
// how to find layer id
//console.log(layerInfo.id);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_8957').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === 'Nombre de naissances') {
//console.log(layerInfo.id);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_8957').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === 'Solde migratoire') {
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_8957').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === 'Nombre de mariages') {
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_8957').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === 'Nombre de divorces') {
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_8957').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === 'Nombre de décès') {
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_8957').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === 'Taux Brut de Natalité') {
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_8957').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === 'Taux Global de Fécondité') {
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === 'Taux Global de Fécondité') {
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === 'Indice Synthétique de Fécondité') {
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_8957').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_5333').setTopLayerVisible(false);
}
if (layerInfo.title === "Taux d'Accoissement Naturel") {
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2496').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1127').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4091').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_2202').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_4468').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_7450').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_348').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_8957').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Démographie_1881').setTopLayerVisible(false);
}
} else {
layerInfo.setTopLayerVisible(false);
}
evt.stopPropagation();
}, Make sure I didn't mess with the Ids
... View more
02-13-2018
04:17 AM
|
1
|
20
|
1705
|
|
POST
|
my application also toggles between many services. If you see for example the 'Surfacewater bodies' group you got many services there (use the buttons on the bottom of the application to change between groups of maps). If you can give me the Ids for you services I can provide the complete code for you. Is you app publicly available?
... View more
02-13-2018
02:42 AM
|
0
|
24
|
1705
|
|
POST
|
The code is already there and try it out and let me know
... View more
02-13-2018
02:29 AM
|
0
|
26
|
1701
|
|
POST
|
Well this is the same scenario like in my application I already provided the piece of code that does the trick. in your case the map title will for example, 'Population Totale' in the first if statement and insert the ids of the other services you want to hide: this.layerListWidget.operLayerInfos.getLayerInfoById('map Id you want to hide').setTopLayerVisible(false); If you do not know how to get the map ids just uncomment the //console.log(layerInfo.id) or you can right click on your service and see the id of the particular service in you console (see the image) onCkSelectNodeClick: function(layerInfo, ckSelect, evt) {
if (ckSelect.checked) {
layerInfo.setTopLayerVisible(true);
if (layerInfo.title === 'Population Totale') {
// how to find layer id
//console.log(layerInfo.id);
this.layerListWidget.operLayerInfos.getLayerInfoById('Nombre de naissances Id').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Solde migratoire Id').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Nobre de mariages Id ').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Nombre de divorces Id').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Nombre de deces Id').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Taux Brut de Natalite Id ').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Taux Global de Fecondite Id').setTopLayerVisible(false);
}
if (layerInfo.title === 'Nombre de naissances') {
//console.log(layerInfo.id);
this.layerListWidget.operLayerInfos.getLayerInfoById('Population Totale Id').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Solde migratoire Id').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Nobre de mariages Id ').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Nombre de divorces Id').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Nombre de deces Id').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Taux Brut de Natalite Id ').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('Taux Global de Fecondite Id').setTopLayerVisible(false);
}
if (layerInfo.title === 'Solde migratoire Id') {
//console.log(layerInfo.id);
//THE SAME IS TRUE HERE....PUT THE Id's OF MAP YOU WANT TO HIDE
}
} else {
layerInfo.setTopLayerVisible(false);
}
evt.stopPropagation();
}, Put this code in the LayerListVies.js's _onCkSelectNodeClick function. Probably you will need to delete the existing code and replace it with this code. This should work for you if you use the appropriate Id and map title.
... View more
02-13-2018
02:28 AM
|
1
|
0
|
1700
|
|
POST
|
So basically you are looking to toggle between sublayres in your Web Map? If so Robert Scheitlin, GISP got already a solution to toggle between sublayers in this thread.
... View more
02-12-2018
08:35 AM
|
0
|
31
|
1701
|
|
POST
|
This piece of code toggles between 3 services if you have 4 or more put the services to hidden or invisible on the list of if (layerInfo.title === 'the title of your map1') //you can find it from the layer list widget (title) {
// how to find layer id
//console.log(layerInfo.id);
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_2').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_3').setTopLayerVisible(false);
//THE FOUR LAYER WILL BE PUT HERE AND THE SAME IS TRUE IN THE OTHER IF STATEMENTS
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_4').setTopLayerVisible(false);
/THE FIVES LAYER WILL BE PUT HERE AND THE SAME IS TRUE IN THE OTHER IF STATEMENTS
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_5').setTopLayerVisible(false);
//AND SO ON AS MANY LAYERS AS YOUR APP GOT
} Basically the code is making everyone else invisible but but the map with the specified title, in our case 'the title of your map1'
... View more
02-12-2018
07:11 AM
|
0
|
34
|
1701
|
|
POST
|
I guess you are looking for this in the LLWidget? If so the above code I posted does the trick (Put it in layerListWieve.js ). I will post is again here. _onCkSelectNodeClick: function(layerInfo, ckSelect, evt) {
if (ckSelect.checked) {
layerInfo.setTopLayerVisible(true);
if (layerInfo.title === 'the title of your map1') //you can find it from the layer list widget (title) {
// how to find layer id
//console.log(layerInfo.id);
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_2').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_3').setTopLayerVisible(false);
}
if (layerInfo.title === 'the title of your map2') {
//console.log(layerInfo.id);
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_1').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_3').setTopLayerVisible(false);
}
if (layerInfo.title === 'the title of your map3') {
//console.log(layerInfo.id);
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_1').setTopLayerVisible(false);
this.layerListWidget.operLayerInfos.getLayerInfoById('map Id_2').setTopLayerVisible(false);
}
} else {
layerInfo.setTopLayerVisible(false);
}
evt.stopPropagation();
}, good luck!
... View more
02-12-2018
06:25 AM
|
1
|
36
|
3525
|
|
POST
|
standard layout with a dynamic legend works well but instead of the dynamic legend I want to use images if possible in the legend elements places or even on other elements. I Preferred this approach because the dynamic legend is going to be really a mess with the amount of sub layers in every service within the application.
... View more
02-07-2018
07:32 AM
|
0
|
1
|
1217
|
|
POST
|
'So you have a separate layout for each'. Do you mean I will have a layout with a static image (the legend image) for every service? if so I will have as many layout as the number of my service which are fairly many.
... View more
02-07-2018
06:57 AM
|
0
|
3
|
1217
|
|
POST
|
Robert, Thanks as always. sorry for not been clear, in my test environment I am already working with custom print templates. This custom print template has: Legend, Title text, Copyright text, Author text and some Custom text element As you recommended I can create new custom print templates without legend element, but the real problem remains where do I have to put the images (supposed to serve as legends) in the template? The images in the map printout must also change according to which service is displayed in the map as they do in legend widget in the above application.
... View more
02-07-2018
06:40 AM
|
0
|
5
|
1217
|
|
POST
|
I am developing an application based on WAB. Since I have some services with complicated legend I made the legend widget to reference to a pre made images for legend. I have my own print template with Title, Author, copyright and legend elements. I am working to include these images in the place of the legend element or any other element so that the map got an appropriate legend element in the printout. If you see the PrintTemplate() object we have access to these layout elements in the LayoutOptions object as properties. // this script is a piece from the print.js
template.layoutOptions = {
authorText: hasAuthorText ? form.author : "",
copyrightText: hasCopyrightText ? (form.copyright || this._getMapAttribution()) : "",
legendLayers: this._getLegendLayers(), // fix issue 7744
titleText: hasTitleText ? form.title : "",
customTextElements: cteArray
}; the layout elements (authorText, copyrightText, titleText....) are taking their values from the form or we can hardcode the value here. Is there a way then to place my image in any of these elements based on which layer is visible in the map for printing? the hardest thing i experienced is to access the node (the physical places) where these elements are appended in to the print template . Any Idea is appreciated. Mehretab
... View more
02-07-2018
05:45 AM
|
0
|
7
|
1739
|
|
POST
|
Hi Robert thanks again, The ArcGISDynamicMapServiceLayer class doesn't have a title or name property unlike the FeatureLayer with the name property. But I find a work around if it helps for some one looking this functionality in WAB. In jimu.js/LayerInfos/LayerInfos I passed the layer.id to be the title see line 14 in the script. _getLayerTitle: function(layer) {
if(layer.title) {
return layer.title;
}
if(lang.getObject("_wabProperties.originalLayerName", false, layer)) {
return layer.name || layer.id;
}
var title = layer.label || layer.name || "";
if (layer.url) {
var serviceName;
var index = layer.url.indexOf("/FeatureServer");
if (index === -1) {
// layer.id; instead of layer.url.indexOf("/MapServer");
index = layer.id;
}
if (index === -1) {
index = layer.url.indexOf("/service");
}
if(index > -1) {
serviceName = layer.url.substring(0, index); //THE REAL TITLE IS PUSHED HERE
serviceName = serviceName.substring(serviceName.lastIndexOf("/") + 1, serviceName.length);
if (title) {
title = serviceName + " - " + title;
} else {
title = serviceName;
}
}
}
return title || layer.id;
},
In this case we need to provide a meaningful id property to our service or the system provides for as which are in most cases layer1, layer2... I guess there is some other ways to hand this issue but that works for my case. cheers!
... View more
01-30-2018
07:16 AM
|
0
|
1
|
2120
|
|
POST
|
Yes indeed the are very different but I am looking for a means in the codes of LLW of WAB to change the display name of a layer. my ArcGISDynamicMapServiceLayer are added on run time in case you are wondering why i didn't change the tile on portal.
... View more
01-26-2018
06:37 AM
|
0
|
3
|
2120
|
|
POST
|
Hi Robert, Is this functionality also applicable in WebAppBuilder LayerList Widget? It would be good practice to change the visual layer name (ArcGISDynamicMapServiceLayer in my case) in the LayerList Widget. Enjoy your Weekend
... View more
01-26-2018
06:08 AM
|
0
|
5
|
2120
|
| Title | Kudos | Posted |
|---|---|---|
| 1 | 10-17-2019 07:01 AM | |
| 4 | 10-10-2023 02:09 AM | |
| 2 | 09-12-2023 03:03 AM | |
| 1 | 08-20-2019 02:28 AM | |
| 1 | 04-19-2022 01:18 AM |
| Online Status |
Offline
|
| Date Last Visited |
07-21-2025
07:02 AM
|