mheinrich86

Legend disappears on scrolling

Discussion created by mheinrich86 on May 6, 2013
I have a problem with a basic template I am creating.
Initally all FeatureLayer URLs get loaded from an array (later from a csv). From those all Layers are created and a Legend should be rendered.

Which almost works. The Legend itself gets displayed with 5 additional lines of "Legend is being created..." If I turn the mouswheel or just zoom in or out, all symbols but one random layer disappear in the legend. From time to time the dev-console throws an error, that the image could not be loaded similar to this: http://forums.arcgis.com/threads/9657-Unable-to-draw-graphic-(null)-Deferred-Cancelled.

I can't figure out why.

This is the code so far:

/// <reference path="jsapi_vsdoc10_v34.js" />
var visible = [];
window.featureLayers = [];
window.layerUrls = [];
window.outFields = ["*"];
window.BaseUrl = 'http://defg1gis01/ArcGIS/rest/services/bohrarchiv_da/MapServer/'

require(["esri/map", "esri/layers/FeatureLayer", "dojo/parser", "dojo/domReady!", "dojo/on", "dojo/dom", "dojo/ready", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/layout/AccordionContainer", "esri/dijit/Legend", "dojo/_base/array", "dijit/form/Button", "esri/dijit/OverviewMap"],
function (Map, FeatureLayer, parser, array, on, dom, ready, array) {
    ready(function () {
        //Parser wandelt alle DOM Elemente mit data-dojo-type=... in Dijits um
        parser.parse();
        window.infoTemplate = new esri.InfoTemplate("Attributes", "${*}");
        /*basemap definieren und buttons mit funktion hinterlegen für Layout*/
        window.map = new esri.Map("map", {
            basemap: "topo",
            center: [12.8, 51],
            zoom: 9
        });

        on(dom.byId("btnStreets"), "click", function () {
            window.map.setBasemap("streets");
        });
        on(dom.byId("btnSatellite"), "click", function () {
            window.map.setBasemap("satellite");
        });
        on(dom.byId("btnHybrid"), "click", function () {
            window.map.setBasemap("hybrid");
        });
        on(dom.byId("btnTopo"), "click", function () {
            window.map.setBasemap("topo");
        });
        on(dom.byId("btnGray"), "click", function () {
            window.map.setBasemap("gray");
        });
        on(dom.byId("btnNatGeo"), "click", function () {
            window.map.setBasemap("national-geographic");
        });

        layerUrls.push('http://defg1gis01/ArcGIS/rest/services/bohrarchiv_da/MapServer/1');
        layerUrls.push('http://defg1gis01/ArcGIS/rest/services/bohrarchiv_da/MapServer/2');
        layerUrls.push('http://defg1gis01/ArcGIS/rest/services/bohrarchiv_da/MapServer/3');
        layerUrls.push('http://defg1gis01/ArcGIS/rest/services/bohrarchiv_da/MapServer/4');
        layerUrls.push('http://defg1gis01/ArcGIS/rest/services/bohrarchiv_da/MapServer/5');
        layerUrls.push('http://defg1gis01/ArcGIS/rest/services/bohrarchiv_da/MapServer/6');

        dojo.connect(window.map, 'onLoad', function (theMap) {
            dojo.forEach(window.layerUrls, function (info, idx) {
                window.featureLayers[idx] = new esri.layers.FeatureLayer(
                window.layerUrls[idx], {
                    infoTemplate: infoTemplate,
                    mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
                    outFields: window.outFields
                }
            );
                map.addLayers([window.featureLayers[idx]]);
            });
        });

        dojo.connect(window.map, 'onLayersAddResult', function (results) {
            var layerInfo = dojo.map(results, function (layer, index) {
                return { layer: layer.layer, title: layer.layer.name };
            });
            var legendDiv = dijit.byId('legendDiv');
            if (legendDiv) {
                legendDiv.destroyRecursive(true);
            }
            //dojo.byId(legendDiv).innerHtml = '';
            var legendDijit = new esri.dijit.Legend({
                map: map,
                layerInfos: layerInfo
            }, 'legendDiv');
            legendDijit.startup();

        });

    });
});


I hope you can point me to my error. Thank you in advance

Outcomes