Basically yes, see the code below, very simplified, but no cloning of the object that defines the layers. I Couldnt' find a way to share that sandbox
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<title>Switch view from 2D to 3D - 4.14</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
#infoDiv {
position: absolute;
top: 15px;
left: 60px;
}
#infoDiv input {
border: none;
box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 2px;
}
</style>
<link
rel="stylesheet"
href="https://js.arcgis.com/4.14/esri/themes/light/main.css"
/>
<script src="https://js.arcgis.com/4.14/"></script>
<script>
var is3D = false;
var map, mapView;
var viewLayers = {
basemap: {
baseLayers: []
},
ground: [],
layers: []
};
function load() {
require([
"esri/views/MapView",
"esri/views/SceneView",
"esri/WebMap",
"esri/WebScene",
"esri/Map",
"esri/layers/TileLayer"
], function(MapView, SceneView, WebMap, WebScene, Map, TileLayer) {
var basemaps = [{
url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer'
}]
basemaps.forEach(function(basemap) {
console.log('creating basemap tile layer')
var tileLayer = new TileLayer({
url: basemap.url
});
viewLayers.basemap.baseLayers.unshift(tileLayer);
});
var appConfig = {
mapView: null,
sceneView: null,
activeView: null,
container: "viewDiv" // use same container for views
};
// Set the map
map = new Map(viewLayers);
var options = {
zoom: 12,
center: [-122.43759993450347, 37.772798684981126],
container: appConfig.container,
map: map
};
// Set the view
mapView = is3D ? new SceneView(options) : new MapView(options);
});
}
// Switches the view from 2D to 3D and vice versa
function switchView() {
if (is3D) {
switchButton.value = is3D ? '2D' : '3D';
}
is3D = !is3D;
load()
}
require(["dojo/ready"], function(ready){
ready(function(){
load();
// switch the view between 2D and 3D each time the button is clicked
var switchButton = document.getElementById("switch-btn");
switchButton.addEventListener("click", function() {
switchView();
});
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
<div id="infoDiv">
<input
class="esri-component esri-widget--button esri-widget esri-interactive"
type="button"
id="switch-btn"
value="3D"
/>
</div>
</body>
</html>