topic Remove Extra Graphic Created by JavaScript 3.x API Draw Toolbar in ArcGIS JavaScript Maps SDK Questions

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

ChristopherEby2 — Mon, 21 Dec 2020 21:07:08 GMT

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:

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?

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

RobertScheitlin__GISP — Mon, 21 Dec 2020 17:00:23 GMT

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

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

ChristopherEby2 — Mon, 21 Dec 2020 18:58:06 GMT

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.

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

ChristopherEby2 — Mon, 21 Dec 2020 19:28:31 GMT

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.

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

RobertScheitlin__GISP — Mon, 21 Dec 2020 20:34:52 GMT

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.

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

ChristopherEby2 — Tue, 22 Dec 2020 13:30:14 GMT

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.

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

MAYUR2812 — Fri, 23 Jul 2021 12:17:20 GMT

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.

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

ChristopherEby1 — Fri, 23 Jul 2021 14:53:26 GMT

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.

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

MAYUR2812 — Mon, 26 Jul 2021 07:04:47 GMT

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

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

Henry — Thu, 22 Jun 2023 18:22:10 GMT

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.