Custom layerlist widget

10639
13
02-12-2017 04:02 AM

Custom layerlist widget

The change in this widget is that when turn on sublayer its turn on the root service and the parent layers.

my services was included maximum 4 levels of layers

(root service -> parent -> parent -> parent- >sublayer )

so it's aims for my needs but can configure for more lavels.

Attachments
Comments

Hi ofrigmops‌,

Will it be possible to see a demo?.

Baba

I don't have any demo online.

Sorry

Ofri G,

I'll add this to the resource list, but can you add the date to the title...and change the date in the title if you update?  This make it easier for those to know if they need to redownload if you make any other changes to just the test.  That will also make it auto update the title in the /blogs/myAlaskaGIS/2016/03/09/web-appbuilder-developer-edition-customization-resource-list

Thanks

(notice, I added the date in that title too....practice what I preach.    )

edit:  I had also added it to the newer /blogs/myAlaskaGIS/2017/03/04/web-appbuilder-the-custom-widgets-list-332017 

Hey great work ofrigmops ! This is a massive improvement on the out-of-the-box LayerList widget.

I want to tweak your code slightly so that selecting the parent layer enables all child layers, deselecting the parent layers disables all child layers -  exactly how this article demos in the Indeterminate Checkboxes codepen. (https://css-tricks.com/indeterminate-checkboxes/)

Do you think this would be difficult to implement? if you could give pointers where to look and tweak in your code that would be greatly appreciated!

Thanks.

Hi Alex,

First, the most simple way is to check all sub layers in the basemap.

If you want it in the code,

You can change the function  _onCkSelectNodeClick in the LayerListView.js 

To:

_onCkSelectNodeClick: function(layerInfo, ckSelect, evt) {

array.forEach(layerInfo.newSubLayers,function (e) {

layerInfo.setTopLayerVisible(ckSelect.checked)

console.log(e.isVisible());

if (e.newSubLayers){

array.forEach(e.newSubLayers,function (f) {

f.setTopLayerVisible(ckSelect.checked)

 

})}

e.setTopLayerVisible(ckSelect.checked)

} )

},

 

Hope that’s what you wanted.

Hey ofri g , yes kind of! but also a combination of the existing logic you had - so that when you click a sub layer it also turns on the parent layer, with this new code it breaks that. Hope this makes sense!

Was trying to have a go at refactoring your code but didn't have much luck - still trying to improve my JS skills! 

ofri g  What file do I change to set the parameters for the sub layers? So, (root service -> parent -> parent -> parent- >sublayer ) what would this look like in the code? I can tinker with code and copy/paste, I can change some things and get it to work, but for many of the technical pieces I am lost. Can you help me out? Thanks! 

I made the changes in the LayerListView.js under the _onCkSelectNodeClick function

Hello everyone! thank you for this widget, does anyone have a demo link that we can check?

How does this widget work?  I installed it but it doesn't seem to do anything.  Maybe someone can post a screenshot?

I'm looking to group layers into a category, is this what this widget does?

Some examples of how to use this widget will be very helpful.  I agree with Walid, it does not seem to do anything.  Please help.

Dear Sir,

I've downloaded your custom layerlist widget V2.0, and I replaced it in the widgets folder. I was wondering how can I add layers with "parent" => "parent" => "child" pattern in the layerlist widget, actually, I don't know how can I define the group layers. I know how we can group layers with "parent" => "child" pattern but I don't have any idea to define a group layers with "parent" => "parent" => "child" pattern. I'd appreciate it if you guide me regarding this issue.

Thanks in advance,

-Sadegh,

Dear,

I would like to ask how to localization layers name?

In Widget.js in end of  function showLayers i write next code:

this.layerListView = (new g({
operLayerInfos: this.operLayerInfos,
layerListWidget: this,
layerFilter: this.layerFilter,
config: this.config
})).placeAt(this.layerListBody);
for (i = 0; i < this.layerListView.operLayerInfos._operLayers.length; i++)
for (j = 0; j < this.layerListView.operLayerInfos._operLayers.layers.length; j++) 
console.log("Layer  name ", this.layerListView.operLayerInfos._operLayers.layers.name)

I would like to change name of layers from Macedonian into English language. I would like to use strings.js into nls folder(strings.js into mk folder).

How to solved this problem?

Best Regards

Version history
Last update:
‎02-12-2017 04:02 AM
Updated by:
Contributors