I am trying to remove a layer from the mapView.
<SPAN class="" style="color: #101094; border: 0px; font-size: 13px;">var</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">LayertoRemove</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">=</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">map</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">findLayerById</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">(</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">layerID</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">);
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">map</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">remove</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">(</SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">LayertoRemove</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">);</SPAN>
The layer is found and is actually removed, but after it's removed it continues to throw TypeError: this.controller.destroy is not a function, and the rest of the script is not run. when I remove these two lines of code, the script works fine. the full error log is:
<SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">Uncaught</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">TypeError</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #101094; border: 0px; font-size: 13px;">this</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">controller</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">destroy is not a </SPAN><SPAN class="" style="color: #101094; border: 0px; font-size: 13px;">function</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">MapView</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">js</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #7d2727; border: 0px; font-size: 13px;">510
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">at </SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">Object</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">d</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">detach </SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">(</SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">MapView</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">js</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #7d2727; border: 0px; font-size: 13px;">510</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">)
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">at </SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">Object</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">update </SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">(</SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">MapView</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">js</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #7d2727; border: 0px; font-size: 13px;">25</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">)
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">at k</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">_animationFrame </SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">(</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">init</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">js</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #7d2727; border: 0px; font-size: 13px;">329</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">)</SPAN>
The error in the console is pointing to MapView.js and init.js of the API and not to any line in my script.
NOTE: The FeatureLayers that I am trying to remove are not hosted layers, but generated from client-side geometries (graphics are created from two csv files taken from the client); I suspect that the error is happening because of the setting of one of the properties of the layer -- which I probably need to set when the layer is created. map.remove() works fine when I tested it with with a hosted layer. The FeatureLayers are generated as follows and are added to map without any issue:
<SPAN class="" style="color: #101094; border: 0px; font-size: 13px;">function</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> createLayer</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">(</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">graphics</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">renderer</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">type</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">fields</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">title</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">){
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">lyr </SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">=</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #101094; border: 0px; font-size: 13px;">new</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #2b91af; border: 0px; font-size: 13px;">FeatureLayer</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">({
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">source</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> graphics</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">fields</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">fields</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">objectIdField</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #7d2727; border: 0px; font-size: 13px;">"ObjectID"</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">renderer</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">renderer</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">spatialReference</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">{</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">wkid</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #7d2727; border: 0px; font-size: 13px;">4326</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">},
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">geometryType</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> type</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">title</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">title</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">,
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">id</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">:</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">title
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">});
</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">map</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">.</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">add</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">(</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">lyr</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">);</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;">}</SPAN><SPAN class="" style="color: #303336; border: 0px; font-size: 13px;"> </SPAN>