GraphicsLayer

deleted-user-yA_w_FC9FKe5

I am trying to clear out graphics on a graphicsLayer so that I can get a new selection.  Everything works with my Query task but I can't seem to clear out the old results.  All I end up doing is adding to the new results.  I've tried a lot of different stuff but it is not working.  How can I do this?  I thought a graphics layer would allow me to do this and seems to be my best choice since I have a couple of other layers I want to be able to filter as well as different results.


I tried up at the top putting the code up top where I add in some ArcGISDynamicMapServiceLayers but in my function it does not recognize my add layer and just bombs out.  Works in my function though.  However, I have a feeling it is creating multiple instances of otherRetailers.


//Where should I put this in my code. 
otherRetailerLayer = new esri.layers.GraphicsLayer();
otherRetailerLayer.id = 'otherRetailers';   
map.addLayer(otherRetailerLayer);

//Why does this not clear out my layer?
map.graphics.clear(otherRetailerLayer);

 function showCEResults(featureSet) {       //  Clear Datagrid          //create an empty store and then bind to grid var emptyCells = { items: "" }; var emptyStore = new dojo.data.ItemFileWriteStore({data: emptyCells});    grid = dijit.byId('gridCE');       grid.setStore(emptyStore); //alert ("Found InfoTemplate"); //Popup window settings  var content = "<b>FID</b>: ${FID}"  +               "<br><b>MALLID</b>: ${MALLID}" +        "<br><b>Mall Grade</b>: ${MALL_GRADE}" +      "<br><b>District</b>: ${DISTRICT}" +      "<br><b>MALL NAME</b>: ${MALLNAME}";                     var infoTemplate = new esri.InfoTemplate("${DIVISIONNA}", content);   var symbol = new esri.symbol.SimpleMarkerSymbol({   "color": [120,120,120,255],   "size": 8,   "type": "esriSMS",   "style": "esriSMSSquare",   "outline": {     "color": [0,0,0,255],     "width": 2,     "type": "esriSLS",     "style": "esriSLSSolid"  }});   var symbolRedShinyPin = new esri.symbol.PictureMarkerSymbol({  "angle": 0, "xoffset": 0, "yoffset": 12, "type": "esriPMS",  "url": "http://static.arcgis.com/images/Symbols/Basic/RedShinyPin.png",  "contentType": "image/png", "width": 18, "height": 18  });  var symbolShinyPin = new esri.symbol.PictureMarkerSymbol({  "angle": 0, "xoffset": 0, "yoffset": 12, "type": "esriPMS",  "url": "http://static.arcgis.com/images/Symbols/Basic/ShinyPin.png",  "contentType": "image/png", "width": 18, "height": 18  });      //alert ("Found DataGrid and Graphics");    var dataForGrid = [];  var temp = "";  var varRetailer = "";       //remove all graphics on the maps graphics layer                otherRetailerLayer = new esri.layers.GraphicsLayer();    otherRetailerLayer.id = 'otherRetailers';         map.addLayer(otherRetailerLayer);       //map.graphics.clear(otherRetailerLayer);              //Performance enhancer - assign featureSet array to a single variable.          var resultFeatures = featureSet.features;          //Loop through each feature returned           for (var i=0, il=resultFeatures.length; i<il; i++) {            //Get the current feature from the featureSet.            //Feature is a graphic            var graphic = resultFeatures;            varRetailer = resultFeatures.attributes.RETAILERID;         if (varRetailer == "3000"){      resultFeatures.setSymbol(symbolRedShinyPin );       }           else {      resultFeatures.setSymbol(symbolShinyPin);          }       resultFeatures.setInfoTemplate(infoTemplate);   otherRetailerLayer.add(resultFeatures);              //Put values in array for datagrid      var attValues = resultFeatures.attributes;                      dataForGrid.push(attValues);       };  //var grid = registry.byId("gridCE");        var data = {   identifier : "FID",   label : "FID",         items : dataForGrid         };      var store = new dojo.data.ItemFileReadStore({data: data});  grid.setSortIndex(2,"true"); //sort on the state name      grid.setStore(store);   grid.on("rowclick", onRowClickHandler);        //window.map.centerAndZoom(graphic.geometry);    }

DanielWebb2

Iâ??m still new to javascript and coding but Iâ??ll try to give what Iâ??ve found and used.

If the function canâ??t see the layer, it sounds there is a problem with scope. Is the function in a separate .js file? Or maybe the layer and function are within their own curly braces? Things like this â??hideâ?? things from one another.

But I discovered if you donâ??t use the var keyword, than that variable becomes global and can be seen by everything, even by other .js files further down the file structure (though not â??upâ?? the file structure). So you might try declaring your graphics layer variable with no var keyword and see if that works.

Thatâ??s what Iâ??ve done. I declared and added the graphics layers (with no var keyword) at the same time as the other service layers using map.addLayer(graphicsLayer). Then, wherever I fire a function that creates a graphic (even one in a separate .js file), I add the graphic to that layer using graphicsLayer.add(graphic).

This strategy seems to work well for me, though there may be better ways. Like I said, Iâ??m still new to all this.

Hope this helps.

Almost forgot! No need to add the graphic using map.graphics.add(graphic); That will also put the graphic in the default graphics layer. I was doing this and getting multiple graphics I didn't want.