Updating geometry (position) of graphics in 4.4 doesn't visually update the layer.

[MatthewPilz]

I have found that when I try updating the location of a given graphic that has already been placed on a layer in 4.4 (graphic.geometry), the changes do not visually update on the layer and the marker remains at the position it was when instantiated (or at the location from the very first call to update geometry). I did not experience this in 3.2.

For instance, if you create a Point graphic with marker symbol, and add it to the layer at particular coordinates and then create a timer to programmatically update its location every 5 seconds using a bank of coordinates, it will only update visually on the screen the first time that method is called. By contrast, if you change the marker color etc. each frame it is updated to reflect accordingly.

If you delete the graphic and remove it from the layer, then define a new one with the updated geometry position, it updates successfully. But I feel this shouldn't be necessary. Does anyone have any thoughts on why we cannot reassign graphic.geometry to new values more than once in 4.4? Does any sample exist to illustrate how to dynamically update the position of a graphic without deleting it each call, and without resorting to using the track widget?

[RobertScheitlin__GISP · Accepted solution]

Matthew,

  According to the 4.x functionality matrix:

Functionality matrix | ArcGIS API for JavaScript 4.4 

Modify graphics

Coming soon

To modify a graphic that is already added to the layer: you need to clone it, make modifications, add it to the layer and remove the original graphic. In-place modification of graphic objects will not trigger display refresh.

See this thread for a clone example:

https://community.esri.com/thread/177053#comment-679223 

[ThomasSolow]

Robert's answer covers this well, but I would add that the thing to do might be to write your own move function:

function move(graphic, geometry){
  newGraphic = graphic.clone();
  newGraphic.geometry = geometry;
  graphic.layer.remove(graphic);
  graphic.layer.add(newGraphic);
}‍‍‍‍‍‍

This may cut down on boilerplate if moving a graphic is something you're doing a lot.

That example work for a graphics layer.  For other kinds of layers, it may be more complicated and you should handle each layer type and the view's graphics layer (view.graphics) differently.

[MatthewPilz]

Thank you both for the added clarification and example. I was achieving this similarly but missed the detail in the documentation that modifying graphics isn't yet natively supported in 4.x, which had me baffled for awhile. I appreciate your help!