I have an esri popup in my web app MapView:
// Add the map to a MapView
const view = new MapView({
container: "viewDiv",
map: map,
center: [-82.9001, 32.1656],
zoom: 8,
popup: {
//actions: [risk_snapshot],
actions: [],
dockEnabled: true,
dockOptions: {
buttonEnabled: true,
breakpoint: false
}
}
});
...
view.popup.open({
// Set the popup's title to the coordinates of the clicked location
title: "Location Coordinates: [" + lon + ", " + lat + "]",
location: event.mapPoint, // Set the location of the popup to the clicked location
content: setContentInfo(view.center, view.scale),
actions: [risk_snapshot]
});
I also have a simple Bootstrap Navbar in my app:
<nav class="navbar navbar-inverse navbar-dark bg-dark" style="margin-bottom: 5px;">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#collapibleMenu">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#" class="navbar-brand" style="color: cornflowerblue;">GA Map Viewer</a>
</div>
<div class="collapse navbar-collapse" id="collapibleMenu">
<ul class="nav navbar-nav navbar-right">
<li><a href="#" style="color: cornflowerblue;">Home</a></li>
</ul>
</div>
</div>
</nav>
<div id="viewDiv"></div>
For some reason, whenever, I close the popup, the navbar disappears. Any reason why this would happen or suggestions on how to fix it?