AddMapService, Custom Module, layer visibility not working

Hi,

I am trying to create a custom module extending my HTML5 viewer. The purpose of this module is to add result map services from my GPservice to the viewer. My module uses the command 'AddMapService'. I need to add around 10 different result layers, so it would be nice if I could control the visibility of the layers. e.g. turn the first layer on and keep the rest off. My problem is that all the mapservice keep getting added as visible. None of the methods regarding visibility seems to be working.

So my question is: How to control layer visibility when using the AddMapService command from a custom mudule?

My module looks like this (it's actually based on a old sample provided by latitude):

export class AddLayerModule extends ModuleBase {

	app: ViewerApplication;
	mapServiceCount: number = 1;

    initialize(configuration) {
	
		this.app.registerActivityIdHandler("PowelAddMapService", this.addLayer.bind(this));
	        
    }	
	
	private addLayer(context: ActivityContext) {
	
		var serviceUrl = context.getValue("MapServiceUrl");
        var serviceName = context.getValue("MapServiceName");
        var serviceID = context.getValue("MapServiceID");
        
		this.addMapService(serviceUrl, serviceID, serviceName);
        context.completeActivity();
	}
	
	private addMapService(url: string, id: string, name: string) {
            // Checks if map service has been added, and removes it to replace with the new one
            var msFound: MapService = null;
            var index = -1;
            var mapServiceID: string = null;
            this.app.site.essentialsMap.mapServices.some(ms => {
                index++;
                if (ms.id === id) {
                    msFound = ms;
                    return true;
                }
            });

            // If map service is already added, save ID instead of generating a new one and remove the map service
            if (msFound) {
                mapServiceID = msFound.id;
                this.app.command("RemoveMapService").execute(msFound);
            } else {
                mapServiceID = id;
                this.mapServiceCount++;
            }

            // Configure Map Service
            var newMapService: MapService;
            var layerOptions = {
                "id": mapServiceID,
                "showAttribution": false
            };
            var layer = new esri.layers.ArcGISDynamicMapServiceLayer(url, layerOptions);
            newMapService = new MapService(url);
            newMapService.mapServiceType = MapServiceType.DYNAMIC;
            (<any>newMapService).layerVisibilityEventManager = new LayerVisibilityEventManager(newMapService, layer);

            // Initialize map service after loading it
            var setupMapService = () => {
                newMapService.serviceUrl = url;
                newMapService.serviceLayer = layer;
                newMapService.id = newMapService.serviceLayer.id;
                newMapService.mapServiceType = MapServiceType.DYNAMIC;
                newMapService.isUserCreated = true;
                newMapService.essentialsMap = this.app.site.essentialsMap;
                newMapService.includeInLayerList = true;
                newMapService.isInitialized = true;
                newMapService.displayName = name;
                newMapService.disableClientCaching = true;
                newMapService.mapServiceFunction = MapServiceFunction.OPERATIONAL;
                newMapService.opacity = 1;
                layer.setOpacity(newMapService.opacity);
                
                // Setup layers

                layer.layerInfos.forEach(info => {
                    //if this is a group layer, just return, we don't want to add that to the layer list
                    if (info.subLayerIds && info.subLayerIds.length > 0) {
                        return;
                    }
                    
                    var layerUrl = url;
                    if (!url.endsWith("/")) {
                        layerUrl = url + "/";
                    }
                    var lay = new Layer();
                    lay.url = layerUrl + info.id;
                    lay.id = info.id.toString();
                    lay.mapService = newMapService;
                    lay.displayName = info.name;
                    //JS - fixed for identify bug: if module config's defaultMapScale is not set,
                    //     or is set set minScale to 0
                    if (info.minScale === 0) {
                        lay.minScale = Infinity;
                    } else {
                        lay.minScale = info.minScale;
                    }
                    lay.maxScale = info.maxScale;
                    lay.defaultVisibility = info.defaultVisibility;

                    lay.supportsIdentify = true;
                    lay.identifiable = true;
                    lay.searchable = true;
                    lay.queryable = true;
                    lay.supportsQuery = true;
                    newMapService.layers.push(lay);
                                        
                    // Adding fields
                    lay.getFeatureLayer().then(feat => {
                        feat.fields.forEach(field => {
                            var newField = new Field({
                                layer: lay, 
                                alias: field.alias,
                                dataType: field.type,
                                displayName: field.name,
                                hyperlinkLabel: "",
                                name: field.name,
                                visible: true
                            });
                            lay.fields.push(newField);
                        });
                            

                        // JS: Query builder fix
                        this.app.event("MapServiceLayersChangedEvent").publish(newMapService);
                    });
                });
            };



            // Load map service
            if (!layer.loaded) {
                layer.on("load", (args) => {
                    setupMapService();
                    this.app.command("AddMapService").execute(newMapService);

                });
                layer.on("error", (args) => {
                    console.log("Error in initializing map service: {0}".format(args.error));
                });
            } else {
                setupMapService();
                this.app.command("AddMapService").execute(newMapService);
            }
            
        }
	
}

- Jesper

Mike Ketler

06 April 2018 21:41

Unfortunately custom modules are not something the Support Team could help you with.

If you still require help then it's possible you could work with our Implementation Services team. I'd recommend opening a support ticket so we can advise you of the requirements for engaging with the Implementation Services.

Thanks,

Tyson Schoepflin

17 Februari 2020 19:56

If anyone is still looking for a solution here is a method that worked.

let url: string = "https://YOURADDRESSHERE/arcgis/rest/services/SOMEPATH/MapServer";

let workingService: MapService = new MapService(url);

let layerOptions = { "id": "dynamicLayerTestShouldBeAGUID", "opacity":1, "showAttribution": false };

let dLayer = new esri.layers.ArcGISDynamicMapServiceLayer(url, layerOptions);

dLayer.setVisibleLayers([7]);

The fix here is to use setVisibleLayers. You can use a layer ID or a layer name as a string.

dLayer.setVisibleLayers(["Some Layer Name"]);

Setup the MapService.

workingService.serviceLayer = dLayer;

workingService.mapServiceType = MapServiceType.DYNAMIC;

workingService.isUserCreated = true;

workingService.userLayerType = "LayerAddition";

workingService.includeInLayerList = true;

//workingService.essentialsMap = this.app.site.essentialsMap;

workingService.displayName = "Custom Layer";

//newMapService.disableClientCaching = true;

workingService.mapServiceFunction = MapServiceFunction.OPERATIONAL;

workingService.opacity = 1;

Finally, list for the layer to finish loading. Make any final map service changes based on the loaded layer and then use the AddMapService command.

dLayer.on("load", (args) => {

workingService.id = dLayer.id;

thisViewModel.app.commandRegistry.commands.AddMapService.execute(workingService);

});

AddMapService, Custom Module, layer visibility not working

Kommentarer

Hittade du inte vad du sökte?