AnsweredAssumed Answered

ArcGISDynamicMapServiceLayer + LayerList + Popup?

Question asked by amoore4 on Oct 14, 2015
Latest reply on Oct 16, 2015 by amoore4

Hello, first time posting question here so apologies if I omit something obvious or format incorrectly.

 

I am attempting to convert a Flex web application I inherited at work to a JavaScript application for enhanced functionality and better future stability.

 

I require my end users to be able to click on points/polylines to get their attributes, and to be able to toggle layers contained in an ArcGISDynamicMapServiceLayer (contains 10+ individual layers).

 

I've achieved both these functionalities in separate dev projects (one project using a LayerList widget allowing toggling of individual layers within the map service, and the other project using a popup while using an executeIdentifyTask with a map.on("click") function to get feature attributes.

 

Once I attempt to combine these functionalities, I run into buggy issues, ex:

     - Each LayerList widget containing layers from ALL my ArcGISDynamicMapServiceLayers (I have 4, attempting to separate their toggle-ability into separate AccordionContainers to keep them organized.

     - All layers seem to be out of scale, even if they are set to be viewable at any scale.

     - LayerList check boxes have no functionality behind them.

 

Is it possible to combine the functionalities of a ArcGISDynamicMapServiceLayer, LayerList, and popup + identify task upon "click"?

 

I tried using FeatureLayers, but performance suffered to the point of not being usable.

 

Thanks for any and all responses!

 

 

Will attempt to post sample code. New to JavaScript.

 

FYI I am working in NetBeans 8.0.2.

 

EDIT: script post attempt below:

 

var popup = new Popup({

        lineSymbol: new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,

                new Color([0, 245, 255, 0.85]), 8),

        markerSymbol: new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 10,

                new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, 10,

                                new Color([0, 255, 0, 0.25]),

                                new Color([0, 245, 255, 0])))

    }, domConstruct.create("div"));

 

...

 

var map = new Map("mapDiv", {

        basemap: "national-geographic",

        center: [-83.7, 33.9],

        zoom: 6,

        infoWindow: popup

    });

    map.on("load", mapReady);

 

...

 

var IT_ml = "MapService_URL";

    map.addLayer(new ArcGISDynamicMapServiceLayer(IT_ml));

 

...

 

var LL1 = new LayerList({

        map: map,

        layer: [ArcGISDynamicMapServiceLayer(IT_ml)]

    }, "ow_layers");

    LL1.startup();

...

 

function mapReady() {
        map.on("click", executeIdentifyTask);
        //create identify tasks and setup parameters
        identifyTask = new IdentifyTask(IT_ml);
        identifyParams = new IdentifyParameters();
        identifyParams.tolerance = 3;
        identifyParams.returnGeometry = true;
        identifyParams.layerIds = [0, 2, 3, 10];
        identifyParams.layerOption = IdentifyParameters.LAYER_OPTION_VISIBLE;
        identifyParams.width = map.width;
        identifyParams.height = map.height;
    }

    function executeIdentifyTask(event) {
        identifyParams.geometry = event.mapPoint;
        identifyParams.mapExtent = map.extent;
        var deferred = identifyTask
                .execute(identifyParams)
                .addCallback(function (response) {
                    return arrayUtils.map(response, function (result) {
                        var feature = result.feature;
                        var layerName = result.layerName;
                        feature.attributes.layerName = layerName;
                        if (layerName === xxx) {
                            var xxxTemplate = new InfoTemplate("xxx",
                                    "field1: ${field1}</br>field2: ${field2}");
                            feature.setInfoTemplate(xxxTemplate);
                        }

return feature;

                    });

                });

        map.infoWindow.setFeatures([deferred]);

        map.infoWindow.show(event.mapPoint);

    }

Outcomes