topic Re: How to remove the 2d map from the dom in ArcGIS JavaScript Maps SDK Questions

How to remove the 2d map from the dom

AndreaWeeg — Wed, 22 Mar 2017 19:27:49 GMT

the way our UI works the map can be opened or closed depending on what the user is doing, when i remove the map from the dom it seems to still be holding on to memory, it just keeps going up and up until the browser becomes unresponsive. is there a better way to do this? this is my current code

this.$mainDiv.find(".arc-div").remove();
this.ArcView.map = null;
this.ArcMap.removeAll();
this.ArcMap = null;
this.ArcView = null;

it seems like the tiles are still in memory they get orphaned so it never gets cleaned up. any help would be awesome! thanks!

Re: How to remove the 2d map from the dom

RobertScheitlin__GISP — Wed, 22 Mar 2017 19:35:04 GMT

Andrea,

You should call the destroy method on the map them remove it from the dom:

https://developers.arcgis.com/javascript/3/jsapi/map-amd.html#destroy

Re: How to remove the 2d map from the dom

AndreaWeeg — Thu, 23 Mar 2017 13:29:51 GMT

I tried that but it throws an error (just says script error), this is what I changed it to (using js 4.2)

this.ArcMap.destroy(); //errors when using this

this.ArcView.destroy(); //this works but map is still in the memory heap (using chrome's memory profiler) and tiles seem to still be there

Re: How to remove the 2d map from the dom

RobertScheitlin__GISP — Sun, 12 Dec 2021 04:38:31 GMT

Andrea,

The view has a reference to the map. Try something like this:

this.ArcView.map = null;
this.ArcMap.removeAll();
this.ArcMap = null;
this.ArcView.destroy();
this.$mainDiv.find(".arc-div").remove();‍‍‍‍‍

Re: How to remove the 2d map from the dom

AndreaWeeg — Thu, 23 Mar 2017 14:48:58 GMT

i'll try that but i did write a simpler html with one of the samples they gave and this is the error it gets

init.js:formatted:10450 Uncaught TypeError: Cannot read property 'remove' of undefined at Object.destroy (init.js:formatted:10450) at Object.destroy (init.js:formatted:5872) at closemap (arctest.html:42) at HTMLButtonElement.onclick (arctest.html:49)

not sure if any esri developers monitor this site but this is the code that breaks

this._layersHandle.remove(); <--this line _layersHandle is null
this._layersHandle = null;
this.layers.drain(this._lyrRemove, this)

Re: How to remove the 2d map from the dom

AndreaWeeg — Thu, 23 Mar 2017 17:45:40 GMT

still has a leak. and if i destroy the view it doesn't seem to work when i try to reload the map i just get a white screen so that seems to be a bug too

Re: How to remove the 2d map from the dom

ThomasSolow — Sun, 12 Dec 2021 04:38:33 GMT

I'm unsure about the best way to remove a map and/or a view. Map.destroy and MapView/SceneView.destroy aren't documented in the 4.X SDK, which sometimes means they're a little rough around the edges.

I would expect that

view.destroy();
view = null‍‍

as well as removing all your other references to the view should be enough. Looking at the state of the view after .destroy is called, most of its properties are set to null and the suspended property is set to true, so even if you didn't set it to null, it's not going to be doing a whole lot after destroy is called.

I can confirm that map.destroy() is throwing an error, but it's not clear to me you would necessarily want to destroy the map when the user toggles the view open and closed, especially if they may toggle that map open again.

Can I ask what happens if you leave the map alone and just destroy/recreate the view (based on the original map) when the user toggles the map closed and back open? Another thing to test would be not destroying anything and just changing the visibility of the div containing the view.

Re: How to remove the 2d map from the dom

AndreaWeeg — Fri, 24 Mar 2017 13:48:55 GMT

I am opening a support ticket with them, could be a bug in the api since is so new there are things they might have missed. For now I think I am going to try to just have a global map and view so I don't need to destroy them I can just keep reusing them...not sure if it'll work and might be a lot of code change on my side but if it keeps the browser from crashing might be a good option until they can get someone to work on the ticket.

thanks for your help!

Andrea

Re: How to remove the 2d map from the dom

BjornSvensson — Thu, 06 Apr 2017 00:10:45 GMT

view.container = null

should have been enough, but there is a bug with it. We will look at fixing that for next version (4.4).

Re: How to remove the 2d map from the dom

JonMullen — Fri, 10 Nov 2017 00:13:32 GMT

Has this been fixed? I have come across the same issue with 4.5. I see extra DOM elements from previously adding and removing a MapView from the DOM.

Re: How to remove the 2d map from the dom

BjornSvensson — Wed, 20 Dec 2017 17:14:21 GMT

Jon Mullen‌ - yes, this was fixed in 4.4 (as far as we know). Do you have a simple test app for 4.5 (or even better 4.6) that shows the issue you're seeing?

Re: How to remove the 2d map from the dom

JonMullen — Wed, 17 Jan 2018 22:41:52 GMT

Sorry for taking a while to respond, but I had a mistake in my code. Thanks.

Re: How to remove the 2d map from the dom

Anonymous User — Wed, 06 Jun 2018 18:38:47 GMT

view.container = null is illustrated on the following example which toogle view from 2D to 3D:

Switch view from 2D to 3D | ArcGIS API for JavaScript 4.7

But in Typescript, container property has to be an HTLMDivElement so you get an error (constructor accepts undefined though).

What would be the Typescript way then ?

Cheers !

Re: How to remove the 2d map from the dom

BjornSvensson — Mon, 11 Jun 2018 23:22:38 GMT

null should work.

Maybe you have enabled "--strictNullChecks" in your tsconfig?
https://www.typescriptlang.org/docs/handbook/compiler-options.html