I wrote this code:
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<title>TEST ArcGIS JS </title>
<style>
html,
body {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
overflow: hidden;
}
#viewDiv {
position: absolute;
right: 0;
left: 40%;
top: 0;
bottom: 0;
}
#sideDiv {
position: absolute;
left:5%;
width: 35%;
}
</style>
<link rel="stylesheet" href="https://js.arcgis.com/4.20/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.20/"></script>
<script>
require(["esri/config","esri/views/MapView", "esri/WebMap", "esri/widgets/LayerList"],
function(esriConfig, MapView, WebMap, LayerList) {
esriConfig.apiKey = "APIKey"
esriConfig.portalUrl = "portalURL"
var webmapids = ["12345"];
var webmaps = webmapids.map(function(webmapid) {
return new WebMap({
portalItem: {
// autocasts as new PortalItem()
id: webmapid
}
});
});
var view = new MapView({
map: webmaps[0],
container: "viewDiv"
});
let layerlist = new LayerList({
view: view,
container:"sideDiv"
});
});
</script>
</head>
<body>
<div id="viewDiv" class="esri-widget"></div>
<div id="sideDiv" class="esri-widget"></div>
</body>
</html>
I would like to display layers on a side bar but layer options do not appear. The eye sign is visible and working fine but options not.
Do you have any idea what I am doing wrong?
