<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" version="2.0">
  <channel>
    <title>topic Graphics layer doesn't clear properly in ArcGIS JavaScript Maps SDK Questions</title>
    <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/graphics-layer-doesn-t-clear-properly/m-p/458506#M42345</link>
    <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;SPAN&gt;Hi all, &lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;In my app, users can search for attributes and results are sent to a datagrid.&amp;nbsp; Simultaneously, the map zooms to the extent of the query results featureset.&amp;nbsp; The user can then click on a row in the grid and a graphic will be added to a graphics layer on the map.&amp;nbsp; This works well.&amp;nbsp; However, I've included a 'clear selected lots' button that clears the selected lots from the map (it simply clears the graphics layer).&amp;nbsp; This also works.&amp;nbsp; But if I click the 'clear lots' button and then pan the map, the graphics reappear on the map.&amp;nbsp; I'm relatively new to the AGS JSAPI so it's probably an easy fix.&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Thanks in advance for any help or suggestions.&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Ed&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Code:&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Adding the graphics layer:&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;PRE class="plain" name="code"&gt;
selectedLotsLayer = new esri.layers.GraphicsLayer();
map.addLayer(selectedLotsLayer);
&lt;/PRE&gt;&lt;DIV style="display:none;"&gt; &lt;/DIV&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Query function:&lt;/SPAN&gt;&lt;BR /&gt;&lt;PRE class="plain" name="code"&gt;
function doLotQuery() {

 if(dijit.byId("results").style.display = "block") {
&amp;nbsp; dijit.byId("results").style.display = "none"
 }
 dojo.connect(queryTask, "onComplete", function(featureSet) {
&amp;nbsp; //build an array of attributes
&amp;nbsp; items = dojo.map(featureSet.features, function(feature) {
&amp;nbsp;&amp;nbsp; return feature.attributes;
&amp;nbsp; });
&amp;nbsp; if(featureSet.features.length &amp;gt; 1) {
&amp;nbsp;&amp;nbsp; if(dijit.byId("results").style.display = "none") {
&amp;nbsp;&amp;nbsp;&amp;nbsp; dojo.style("results", "display", "block");
&amp;nbsp;&amp;nbsp;&amp;nbsp; dijit.byId("results").resize();
&amp;nbsp;&amp;nbsp;&amp;nbsp; var geometry, extent, ext;
&amp;nbsp;&amp;nbsp;&amp;nbsp; dojo.forEach(featureSet.features, function(feature, i) {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; geometry = feature.geometry;

&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; if( geometry instanceof esri.geometry.Extent) {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; ext = geometry;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; } else {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; ext = geometry.getExtent();
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; }
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; if(extent) {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; extent = extent.union(ext);
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; } else {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; extent = new esri.geometry.Extent(ext);
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; }
&amp;nbsp;&amp;nbsp;&amp;nbsp; });
&amp;nbsp;&amp;nbsp;&amp;nbsp; if (selectedLotsLayer.graphics.length &amp;gt; 0) {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; selectedLotsLayer.clear();
&amp;nbsp;&amp;nbsp;&amp;nbsp; }
&amp;nbsp;&amp;nbsp;&amp;nbsp; map.setExtent(extent);
&amp;nbsp;&amp;nbsp; }
&amp;nbsp; } else {
&amp;nbsp;&amp;nbsp; var singleLotResult
&amp;nbsp;&amp;nbsp; dojo.forEach(featureSet.features, function(feature) {
&amp;nbsp;&amp;nbsp;&amp;nbsp; map.graphics.add(feature);
&amp;nbsp;&amp;nbsp; });
&amp;nbsp;&amp;nbsp; dojo.forEach(map.graphics.graphics, function(graphic) {
&amp;nbsp;&amp;nbsp;&amp;nbsp; singleLotResult = graphic;
&amp;nbsp;&amp;nbsp; });
&amp;nbsp;&amp;nbsp; var singleLotResultExtent = singleLotResult.geometry.getExtent().expand(10.0);
&amp;nbsp;&amp;nbsp; singleLotResult.setSymbol(highlightSymbol);
&amp;nbsp;&amp;nbsp; map.setExtent(singleLotResultExtent);
&amp;nbsp; }
&amp;nbsp; var data = {
&amp;nbsp;&amp;nbsp; identifier : "objectid",
&amp;nbsp;&amp;nbsp; items : items
&amp;nbsp; };
&amp;nbsp; store = new dojo.data.ItemFileReadStore({
&amp;nbsp;&amp;nbsp; data : data
&amp;nbsp; });
&amp;nbsp; grid.setStore(store);
&amp;nbsp; grid.setSortIndex(1, "true");
&amp;nbsp; //sort on the section number

&amp;nbsp; dojo.forEach(featureSet.features, function(feature) {
&amp;nbsp;&amp;nbsp; map.graphics.add(feature);
&amp;nbsp; });
&amp;nbsp; document.getElementById("loader").style.visibility = "hidden";
 });
 queryTask.execute(query);
 document.getElementById("loader").style.visibility = "visible";
}
&lt;/PRE&gt;&lt;DIV style="display:none;"&gt; &lt;/DIV&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Click handler for the datagrid row:&lt;/SPAN&gt;&lt;BR /&gt;&lt;PRE class="plain" name="code"&gt;
function onRowClickHandler(evt) {

 if(dijit.byId("goToLotsButton").disabled = 'true') {
&amp;nbsp; dijit.byId("goToLotsButton").setAttribute('disabled', false)
 };
 if(dijit.byId("clearLotsButton").disabled = 'true') {
&amp;nbsp; dijit.byId("clearLotsButton").setAttribute('disabled', false)
 };
 clickedLotId = grid.getItem(evt.rowIndex).objectid;
 dojo.forEach(map.graphics.graphics, function(graphic) {
&amp;nbsp; if((graphic.attributes) &amp;amp;&amp;amp; graphic.attributes.objectid === clickedLotId) {
&amp;nbsp;&amp;nbsp; selectedLot = graphic;
&amp;nbsp;&amp;nbsp; return;
&amp;nbsp; }
 });
 selectedLot.setSymbol(highlightSymbol);
 selectedLotsLayer.add(selectedLot);
}
&lt;/PRE&gt;&lt;DIV style="display:none;"&gt; &lt;/DIV&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;The clear selected lots code:&lt;/SPAN&gt;&lt;BR /&gt;&lt;PRE class="plain" name="code"&gt;
function clearSelectedLots() {

 if(dijit.byId("goToLotsButton").disabled = 'false') {
&amp;nbsp; dijit.byId("goToLotsButton").setAttribute('disabled', true)
 };
 if(dijit.byId("clearLotsButton").disabled = 'false') {
&amp;nbsp; dijit.byId("clearLotsButton").setAttribute('disabled', true)
 };
 selectedLotsLayer.clear();
}
&lt;/PRE&gt;&lt;DIV style="display:none;"&gt; &lt;/DIV&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
    <pubDate>Fri, 03 Feb 2012 02:09:50 GMT</pubDate>
    <dc:creator>EdSaunders</dc:creator>
    <dc:date>2012-02-03T02:09:50Z</dc:date>
    <item>
      <title>Graphics layer doesn't clear properly</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/graphics-layer-doesn-t-clear-properly/m-p/458506#M42345</link>
      <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;SPAN&gt;Hi all, &lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;In my app, users can search for attributes and results are sent to a datagrid.&amp;nbsp; Simultaneously, the map zooms to the extent of the query results featureset.&amp;nbsp; The user can then click on a row in the grid and a graphic will be added to a graphics layer on the map.&amp;nbsp; This works well.&amp;nbsp; However, I've included a 'clear selected lots' button that clears the selected lots from the map (it simply clears the graphics layer).&amp;nbsp; This also works.&amp;nbsp; But if I click the 'clear lots' button and then pan the map, the graphics reappear on the map.&amp;nbsp; I'm relatively new to the AGS JSAPI so it's probably an easy fix.&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Thanks in advance for any help or suggestions.&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Ed&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Code:&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Adding the graphics layer:&lt;/SPAN&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;PRE class="plain" name="code"&gt;
selectedLotsLayer = new esri.layers.GraphicsLayer();
map.addLayer(selectedLotsLayer);
&lt;/PRE&gt;&lt;DIV style="display:none;"&gt; &lt;/DIV&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Query function:&lt;/SPAN&gt;&lt;BR /&gt;&lt;PRE class="plain" name="code"&gt;
function doLotQuery() {

 if(dijit.byId("results").style.display = "block") {
&amp;nbsp; dijit.byId("results").style.display = "none"
 }
 dojo.connect(queryTask, "onComplete", function(featureSet) {
&amp;nbsp; //build an array of attributes
&amp;nbsp; items = dojo.map(featureSet.features, function(feature) {
&amp;nbsp;&amp;nbsp; return feature.attributes;
&amp;nbsp; });
&amp;nbsp; if(featureSet.features.length &amp;gt; 1) {
&amp;nbsp;&amp;nbsp; if(dijit.byId("results").style.display = "none") {
&amp;nbsp;&amp;nbsp;&amp;nbsp; dojo.style("results", "display", "block");
&amp;nbsp;&amp;nbsp;&amp;nbsp; dijit.byId("results").resize();
&amp;nbsp;&amp;nbsp;&amp;nbsp; var geometry, extent, ext;
&amp;nbsp;&amp;nbsp;&amp;nbsp; dojo.forEach(featureSet.features, function(feature, i) {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; geometry = feature.geometry;

&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; if( geometry instanceof esri.geometry.Extent) {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; ext = geometry;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; } else {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; ext = geometry.getExtent();
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; }
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; if(extent) {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; extent = extent.union(ext);
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; } else {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; extent = new esri.geometry.Extent(ext);
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; }
&amp;nbsp;&amp;nbsp;&amp;nbsp; });
&amp;nbsp;&amp;nbsp;&amp;nbsp; if (selectedLotsLayer.graphics.length &amp;gt; 0) {
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; selectedLotsLayer.clear();
&amp;nbsp;&amp;nbsp;&amp;nbsp; }
&amp;nbsp;&amp;nbsp;&amp;nbsp; map.setExtent(extent);
&amp;nbsp;&amp;nbsp; }
&amp;nbsp; } else {
&amp;nbsp;&amp;nbsp; var singleLotResult
&amp;nbsp;&amp;nbsp; dojo.forEach(featureSet.features, function(feature) {
&amp;nbsp;&amp;nbsp;&amp;nbsp; map.graphics.add(feature);
&amp;nbsp;&amp;nbsp; });
&amp;nbsp;&amp;nbsp; dojo.forEach(map.graphics.graphics, function(graphic) {
&amp;nbsp;&amp;nbsp;&amp;nbsp; singleLotResult = graphic;
&amp;nbsp;&amp;nbsp; });
&amp;nbsp;&amp;nbsp; var singleLotResultExtent = singleLotResult.geometry.getExtent().expand(10.0);
&amp;nbsp;&amp;nbsp; singleLotResult.setSymbol(highlightSymbol);
&amp;nbsp;&amp;nbsp; map.setExtent(singleLotResultExtent);
&amp;nbsp; }
&amp;nbsp; var data = {
&amp;nbsp;&amp;nbsp; identifier : "objectid",
&amp;nbsp;&amp;nbsp; items : items
&amp;nbsp; };
&amp;nbsp; store = new dojo.data.ItemFileReadStore({
&amp;nbsp;&amp;nbsp; data : data
&amp;nbsp; });
&amp;nbsp; grid.setStore(store);
&amp;nbsp; grid.setSortIndex(1, "true");
&amp;nbsp; //sort on the section number

&amp;nbsp; dojo.forEach(featureSet.features, function(feature) {
&amp;nbsp;&amp;nbsp; map.graphics.add(feature);
&amp;nbsp; });
&amp;nbsp; document.getElementById("loader").style.visibility = "hidden";
 });
 queryTask.execute(query);
 document.getElementById("loader").style.visibility = "visible";
}
&lt;/PRE&gt;&lt;DIV style="display:none;"&gt; &lt;/DIV&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;Click handler for the datagrid row:&lt;/SPAN&gt;&lt;BR /&gt;&lt;PRE class="plain" name="code"&gt;
function onRowClickHandler(evt) {

 if(dijit.byId("goToLotsButton").disabled = 'true') {
&amp;nbsp; dijit.byId("goToLotsButton").setAttribute('disabled', false)
 };
 if(dijit.byId("clearLotsButton").disabled = 'true') {
&amp;nbsp; dijit.byId("clearLotsButton").setAttribute('disabled', false)
 };
 clickedLotId = grid.getItem(evt.rowIndex).objectid;
 dojo.forEach(map.graphics.graphics, function(graphic) {
&amp;nbsp; if((graphic.attributes) &amp;amp;&amp;amp; graphic.attributes.objectid === clickedLotId) {
&amp;nbsp;&amp;nbsp; selectedLot = graphic;
&amp;nbsp;&amp;nbsp; return;
&amp;nbsp; }
 });
 selectedLot.setSymbol(highlightSymbol);
 selectedLotsLayer.add(selectedLot);
}
&lt;/PRE&gt;&lt;DIV style="display:none;"&gt; &lt;/DIV&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;SPAN&gt;The clear selected lots code:&lt;/SPAN&gt;&lt;BR /&gt;&lt;PRE class="plain" name="code"&gt;
function clearSelectedLots() {

 if(dijit.byId("goToLotsButton").disabled = 'false') {
&amp;nbsp; dijit.byId("goToLotsButton").setAttribute('disabled', true)
 };
 if(dijit.byId("clearLotsButton").disabled = 'false') {
&amp;nbsp; dijit.byId("clearLotsButton").setAttribute('disabled', true)
 };
 selectedLotsLayer.clear();
}
&lt;/PRE&gt;&lt;DIV style="display:none;"&gt; &lt;/DIV&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
      <pubDate>Fri, 03 Feb 2012 02:09:50 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/graphics-layer-doesn-t-clear-properly/m-p/458506#M42345</guid>
      <dc:creator>EdSaunders</dc:creator>
      <dc:date>2012-02-03T02:09:50Z</dc:date>
    </item>
  </channel>
</rss>

