Hello everyone! I am currently have an application that uses floating panes. I have a main toolbar that contains the tool icons. When a button is clicked, the floating pane will appear with the tool. However, when I close the floating pane, then click on the button to re-activate, the floating pane will not re-appear. I have read that closing the floating pane destroys the open. Has anyone come up with the solution, so that each time you close the floating pane, you can re-open by clicking on the button? The code I have is simple, both the JavaScript and HTML which is posted below. What modifications do I need to make? I appreciate any feedback. Thank you.
Here is an example for a measuring tool:
JavaScript Code
// Hide Measuring Tool Floating Pane on Load
domStyle.set("measuringToolFloatingPanePick", "visibility", "hidden");
// Measuring Tool activate Floating Pane on Click
registry.byId("measuringToolButton").on("click", function () {
openMeasuringToolFloatingPane("measuringToolFloatingPanePick");
});
// Open Measuring Tool using Floating Pane Function
function openMeasuringToolFloatingPane(paneId) {
var mtfp = registry.byId(paneId);
mtfp.show();
}
// Measuring Tool
var measurementWidget = new Measurement({
map: map,
defaultAreaUnit: esri.Units.SQUARE_FEET,
defaultLengthUnit: esri.Units.FEET
}, dom.byId("measurementDIV"));
measurementWidget.startup();
HTML Code
<!-- Measuring - Measuring Tool -->
<div id="measuringFrame">
<div data-dojo-type="dijit/form/Button" id="measuringToolButton" title="Measuring" data-dojo-props="iconClass:'measuringIcon'"></div>
</div>
Here is how my floating pane appears. It appears when clicking on the icon (within the red square). When I close, then try to re-open...it won't.
Take a look at this thread that has some alternative ways to deal with this.