Remove Extra Graphic Created by JavaScript 3.x API Draw Toolbar

1716
9
12-21-2020 07:21 AM
ChristopherEby2
New Contributor III

When using esri/toolbars/draw in versions of the JavaScript API starting at 3.31 there is an extra graphic added to the map when using the arrow, circle, triangle, and ellipse tools. It appears in the center of the graphic, where you click to start creating the graphic. When you zoom in or out, these graphics locations are not adjusted and if you are trying to add your graphics to a GraphicsLayer they are not removed when the layer is cleared even through the final graphic is. The graphics I am talking about appear in red in this image:

chrome_DzJnVNq6yM.png

You can see this with the draw toolbar sample (https://developers.arcgis.com/javascript/3/sandbox/sandbox.html?sample=toolbar_draw). If you bump the version in the sample back to 3.30, this issue goes away so it seems like a bug in the API. Is there a workaround to prevent these graphics from being created?

Tags (2)
9 Replies
RobertScheitlin__GISP
MVP Emeritus

I don't see any issue in Chrome using the 3.35 CDN.

0 Kudos
ChristopherEby2
New Contributor III

I am seeing it on Chrome 87.0.4280.88, 86.0.4240.183, and 79.3945.130. Each of those versions are on a different PC. It does work correctly for me in Firefox. @RobertScheitlin__GISP are you using the arrow, circle, triangle, or ellipse options? Because the point, line, polygon, etc options don't seem to have this issue.

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

I am using Version 87.0.4280.88 (Official Build) (64-bit) of Chrome and using circle and arrow drawing tools and there is no extra graphic. I remember some people having an issue and it was hardware related, Best to call tech support on this.

0 Kudos
ChristopherEby2
New Contributor III

I tested on another machine today where it worked correctly in Chrome. So it does appear to be hardware related but I can't control what hardware my users have. I have submitted a ticket to tech support.

0 Kudos
ChristopherEby2
New Contributor III

I may have a workaround. It seems that the unwanted graphics are being added to the map's GraphicsLayer. In my application I am adding the graphics created by the draw tool to a custom graphics layer so I can do a map.graphics.clear() call and remove the graphics from the map's layer every time I create a new graphic. This removes the unwanted graphics but still allows the final graphic to show on the map since it's in my custom layer. Now I just have to make sure nothing else in my map is added to the map.graphics layer because that will get wiped out using this solution.

0 Kudos
MAYUR2812
New Contributor II

We are experiencing the same issue in versions 3.35 and 3.37 too using the same ESRI sample. 
Most of the machines are not able to reproduce (working as expected).

The machine on which it reproduces is using the latest Chrome(92.0.4515.107).

Reproducible on EDGE too on the same machine. 

Note: When changed the API version to 3.30, it works as expected.

0 Kudos
ChristopherEby1
New Contributor II

The result of my support ticket with Esri was that they couldn't reproduce it on any of their machines so they closed the case.

MAYUR2812
New Contributor II

Thanks for the information. Looks like I will have to create a new ticket.

0 Kudos
Henry
by
Occasional Contributor II

This has been showing up for one of our users as well, for a markup tool in another application that must use the Esri JavaScript API.

I've created a support ticket with Esri as well to see if the issue for the user can be resolved. Will update if any fixes are found, but seeing as I can't replicate the issue and that Esri might not be able to either - not sure what the fix may be.

Henry
0 Kudos