empicard

remove previous graphic

Discussion created by empicard on Apr 9, 2012
Latest reply on May 11, 2012 by empicard
as many have read by now, I've got a data grid populated by a spatial query, and corresponding points in a map (red circles).

when you click on a record in the table, I would like a graphic added to the map to highlight (green circle) an already existing point(red circle). when you click a different record in the grid, i would like the first highlighter to disappear, and a new one appear.
right now, things go 2 ways, either the selected point never clears, and it adds more and more graphic points, or the last of the red query point graphics to be drawn disappears. 

how do i specifically remove a graphic from selectedRepGraphic, not just the last graphic added, which is what happens now?


      function onRowClickHandler(evt){
        var clickedRep = grid.getItem(evt.rowIndex).rep_no;
        var selectedRep;
        var selectedRepSymbol = new esri.symbol.SimpleMarkerSymbol();
        selectedRepSymbol.style = esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE;
        selectedRepSymbol.setSize(10);
        selectedRepSymbol.setColor(new dojo.Color([0,255,0, 1]));   
        dojo.forEach(map.graphics.graphics,function(graphic){
          if((graphic.attributes) && graphic.attributes.rep_no === clickedRep){
            selectedRep = graphic;
            var selectedRepGraphic = new esri.Graphic(selectedRep, selectedRepSymbol);
            selectedRepGraphic.setSymbol(selectedRepSymbol);
            
            var selInfoTemplate = new esri.InfoTemplate("Sales Rep: ${NAME}", ("${*}")); //"Rep # : ${rep_no}", "Address : ${ADDR1}");
            map.infoWindow.setTitle(selectedRepGraphic.getContent("${NAME}"));
            map.infoWindow.setContent(selectedRepGraphic.getContent("Sales Rep: ${NAME}", "Rep #: ${rep_no}", "Address : ${ADDR1}"));
            selectedRepGraphic.setInfoTemplate(selInfoTemplate);
            map.infoWindow.show(selectedRepGraphic.geometry);

            if (selectedRepGraphic != undefined){
              map.graphics.remove(map.graphics.graphics[map.graphics.graphics.length - 1]);
            };
            
            map.graphics.add(selectedRepGraphic);
            

            return;
          };
        });
            return;
      };

Outcomes