AnsweredAssumed Answered

GraphicsLayer removeall graphics come back after zoom

Question asked by on Dec 14, 2017
Latest reply on Dec 18, 2017 by

I'm using JavaScript API 4.5 and my application is using webmap. I want to highlight the feature that the user clicks on (polygon) and clear the current one and highlight the new one every time the user clicks on a new feature. 


I created a GraphicsLayer for it and use removeall() to remove all the graphics before draw the new one. This works fine until I zoom the map. When I zoom the map all the graphics come back and I can't figure out where they are stored. I checked the graphics layer and there is always one graphic in it which is the most recent selected feature.


highlightFeature(graphic) {
let theComponent = this;
let graphicsLayerMap;

  if (layer.type === 'graphics') {
    graphicsLayerMap = layer;
// SimpleFillSymbolProperties only necessary because of tight coupling of object types. Normally outside of Angular/Webpack we wouldn't need a fake SimpleFillSymbolProperties class
let symbolProps = new SimpleFillSymbolProperties({
  style: 'none',
  outline: {
   width: 2,
   color: [0, 197, 255, 1]
let highlightSymbol = new SimpleFillSymbol(symbolProps);
graphic.symbol = highlightSymbol;
if (graphicsLayerMap !== undefined) {
  // not the first time click on the map
  } else {
  // if this is the first click on this map, add a graphicsLayer to the map
  // add graphic to GraphicsLayer
  let graphicsLayer = new GraphicsLayer({
   graphics: [graphic],
   listMode: 'hide'

 Any help would be appreciated!