nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Trouble deactivating the drawing toolbar when I close my floating pane

TracySchloss

I have decided that I don't like the new measurement widget, so I'm going back to basics. I have a floating pane containing two buttons and a display field. One button for measuring area and the other for measuring length.

I think I have the geometry service calls sorted out, but when I close my floating pane, which should also deactivate the toolbar I created, I continue to have the tooltips for 'Click to start drawing'. The lines for 'measureActive = true' are used to keep the identify I have defined elsewhere from firing on my click event until I close the measure pane.

Here are the relevant functions:

//functions for measurement  function closeMeasure () {     console.log ("closeMeasure");     measureActive = false;     dojo.disconnect(measureHandler);     dojo.disconnect(measureAreaHandler);     dojo.disconnect(measureLengthHandler);     measureTb.deactivate();     map.graphics.clear();     identifyHandler = dojo.connect(map, 'onClick' , doIdentify); } function openGeomMeasure () {   measureActive = true;   map.graphics.clear();    measureAreaHandler = dojo.connect(geomService, "onAreasAndLengthsComplete", outputAreaAndLength);    measureLengthHandler =dojo.connect(geomService, "onLengthsComplete", outputLength);    var measureError = dojo.connect(geomService, "onError" , measureErrHandler);     var fp = dijit.byId('floater_GeomMeasure');         if ((fp.style =="visibility: hidden;") || (fp.style="VISIBILITY:hidden;")) {            fp.style.visibility="visible";            fp.show();         }      measureHandler = dojo.connect(measureTb, "onDrawEnd", getAreaAndLength);   } function getAreaAndLength(geometry) {       map.graphics.clear();         var graphic = map.graphics.add(new esri.Graphic(geometry, highlightFillSymbol));         var geoType = geometry.type;        if (geoType == 'polygon') {         //setup the parameters for the areas and lengths operation       var areasAndLengthParams = new esri.tasks.AreasAndLengthsParameters();          areasAndLengthParams.areaUnit = esri.tasks.GeometryService.UNIT_ACRES;       geomService.simplify([geometry], function(simplifiedGeometries) {           areasAndLengthParams.polygons = simplifiedGeometries;           geomService.areasAndLengths(areasAndLengthParams);       });        }else {        var lengthParams = new esri.tasks.LengthsParameters();       lengthParams.lengthUnit = esri.tasks.GeometryService.UNIT_FOOT;        lengthParams.geodesic = true;            geomService.simplify([geometry], function(simplifiedGeometries) {           lengthParams.polylines = simplifiedGeometries;           geomService.lengths(lengthParams);       });          }          } function measureErrHandler (error) {     console.log ("MeasureErrHandler = " + error); } function outputAreaAndLength(result) {   console.log(dojo.toJson(result));   dojo.byId("measureText").innerHTML = "<b>Area: </b> " + result.areas[0].toFixed(2) + " Acres";     // dojo.byId('distanceDetails').innerHTML = distance; } function outputLength (result) {     console.log(dojo.toJson(result));    dojo.byId("measureText").innerHTML = "<b>Length: </b> :" + result.lengths[0].toFixed(2) + " Feet";  } function startAreaMeasure () {     measureActive = true;     measureTb.deactivate();     measureTb.activate(esri.toolbars.Draw.POLYGON);     dojo.byId("measureText").innerHTML = ""; } function startDistanceMeasure () {     measureActive = true;     measureTb.deactivate();     measureTb.activate(esri.toolbars.Draw.POLYLINE);     dojo.byId("measureText").innerHTML = "";      }

Vind meer berichten getagd met

Accepted answers

TracySchloss

I ended up with a variation of your suggestion:

var minNode = dojo.query('#floater_GeomMeasure .dojoxFloatingMinimizeIcon')[0];   dojo.connect(minNode, "onclick", function(e){ //      console.log("dojo connect minNode onClick");       closeMeasure(); });

This executes my closeMeasure, which includes deactivating the draw toolbar. It worked in IE 8, which is still our default browser.

All comments

TracySchloss

I think I have a different problem. I have a dojo.connect that is supposed to be listening for when the pane is closing to do some clean up by calling the closeMeasure function.

I just realized that 'closeMeasure' isn't getting called after all. I thought it was. My problem is the syntax is listening for when the floating pane is closed. Or should I be listening for something related to the dock?

I have a line that must not be the right way to go about this:

dojo.connect (dijit.byId('floater_GeomMeasure'), "onHide", closeMeasure);

VinayBansal

Try using floating pane closeNode onclick method

var myfloatingPane = dijit.byId('myFloatingPane');
dojo.connect(myfloatingPane.closeNode, "onclick", function (e) {
//Call your function here for deactivating measure toolbar
};

TracySchloss

No, that didn't work. Aren't nodes more for widgets? This is just a standard floating pane with a couple of buttons in it. I saw another thread that I thought was similar to listen for when an infoWindow closed:

<a class="hide" dojoattachpoint="_hide" dojoattachevent="onclick:hide" style="margin-left: 303px; "><div class="sprite"></div></a>

Code related to the event:

dojo.connect(map.infoWindow._hide, "onclick", function(){
      //your code here for handling the close button click.
});

I haven't quite figured out the syntax yet, but it seems like I should maybe be looking at something similar on the minimize dojoattachpoint of the minimize icon instead?

BenFousek

Here's one way to connect to minimize icon of a floating pane. Doesn't work in IE <= 8.

var minNode = dojo.query('#tools-measure-floating-pane .dojoxFloatingMinimizeIcon')[0];
dojo.attr(minNode, 'onclick', 'app.tools.measure.clear()');

TracySchloss

I ended up with a variation of your suggestion:

var minNode = dojo.query('#floater_GeomMeasure .dojoxFloatingMinimizeIcon')[0];   dojo.connect(minNode, "onclick", function(e){ //      console.log("dojo connect minNode onClick");       closeMeasure(); });

This executes my closeMeasure, which includes deactivating the draw toolbar. It worked in IE 8, which is still our default browser.

BenFousek

It worked in IE 8, which is still our default browser.

Great.

I need to update mine as dojo.attr is depreciated anyway.

Doe mee aan het gesprek

Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.

Snelle Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.