In my Javascript API Web application I'm using the infoWindow to query a parcel layer and display display information in a popup when I click the parcel. I've set this functionality to turn on and off depending on if the parcel is visible, and I control the visibility of my different layers with check boxes in a legend.
Every time the parcel layer is checked on of off it calls the clickConnect function with a value of true or false. Depending on this, click connect will call the executeIdentifyTask function, which query's the parcel layer, when clicked, and displays the info in a popup. This works great unless I try to use the esri.dijit.Measurement tool while the parcel layer is turned on. In which case i still get a pop up every time I click, which gets in the way of me measuring parcels.
Is there a way that I could turn the popup/query functionality off while I'm using the measure tool and the parcel layer is turned on? I'm a bit of a beginner at using javascript/dojo so I'm not sure how to do this. I've searched the ESRI forums for answers to this question without much success thus far.
Any help would be greatly appreciated! I hope I was clear in my explanation, if not let me know!
Javascript from my map app relevant to the question:
var app = {};
app.map = null;
var legendLayers = [];
var clickHandler;
function init() {
//add popup
var popup = new esri.dijit.Popup({
fillSymbol: new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,0,0]), 2), new dojo.Color([255,255,0,0.25]))
}, dojo.create("div"));
//add geometry service
esri.config.defaults.geometryService = new esri.tasks.GeometryService("http://server/rest/services/Utilities/Geometry/GeometryServer");
//initalize map
app.map = new esri.Map("map", {
basemap : "streets",
center : [-111.924531, 40.611871],
zoom : 13,
infoWindow: popup
});
//add parcel layer
var parcels = new esri.layers.ArcGISDynamicMapServiceLayer("http://server/arcgis/rest/services/Parcels_UT/MapServer", {
id : 'parcels',
visible : false
});
legendLayers.push({
layer : parcels,
title : 'Parcels'
});
//add parcel query data
var content = "<b>Address</b>: ${ADDR}" + "<br /><b>Owner Name</b>: ${OWNER}" + "<br /><b>Parcel ID</b>: ${APN}" + "<br /><b>City</b>: ${CITY}" + "<br /><b>Acres</b>: ${TOTAL_ACRE}" + " <br /><a href='${COUNTY_LIN}'>County Assessor Site</a>"
var popUpTemplate = new esri.InfoTemplate("Parcel", content);
//add paercel layer as feature layer
var featureLayer = new esri.layers.FeatureLayer("http://server/arcgis/rest/services/Parcels_UT/MapServer/0",{
mode: esri.layers.FeatureLayer.MODE_SELECTION,
outFields: ["*"],
infoTemplate:popUpTemplate
});
//create legend
dojo.connect(app.map, 'onLayersAddResult', function(results) {
var legend = new esri.dijit.Legend({
map : app.map,
layerInfos : legendLayers
}, "legendDiv");
legend.startup();
});
app.map.addLayers([parcels]);
dojo.connect(app.map, 'onLayersAddResult', function(results) {
//add legend check boxes
dojo.forEach(legendLayers, function(layer) {
var layerName = layer.title;
var checkBox = new dijit.form.CheckBox({
name : "checkBox" + layer.layer.id,
value : layer.layer.id,
checked : layer.layer.visible,
onChange : function(evt) {
var clayer = app.map.getLayer(this.value);
clayer.setVisibility(!clayer.visible);
this.checked = clayer.visible;
//toggle the feature layer with the parcel layer
if (this.value ==="parcels" && this.checked === true){
clickConnect(true);
console.log("parcels");
} else if (this.value ==="parcels"){
clickConnect(false);
console.log("noParcels");
}
}
});
//add the check box and label to the table of contnents
dojo.place(checkBox.domNode, dojo.byId("toggle"), "after");
var checkLabel = dojo.create('label', {
'for' : checkBox.name,
innerHTML : layerName
}, checkBox.domNode, "after");
dojo.place("<br />", checkLabel, "after");
});
});
dojo.connect(app.map, 'onLoad', function(map) {
initToolbar(app.map);
});
function executeIdentifyTask(evt) {
var query = new esri.tasks.Query();
query.geometry = pointToExtent(app.map,evt.mapPoint,10);
var deferred = featureLayer.selectFeatures(query,esri.layers.FeatureLayer.SELECTION_NEW);
app.map.infoWindow.setFeatures([deferred]);
app.map.infoWindow.show(evt.mapPoint);
}
function clickConnect(connect){
if(connect){
//perform the identify task on click
clickHandler = dojo.connect(app.map, "onClick", executeIdentifyTask);
}else{
//disconnect the click handler
dojo.disconnect(clickHandler);
clickHandler = null;
}
}
}
function initToolbar(mymap) {
//define a new line symbol and point symbol to use for measure tools
var pms = new esri.symbol.PictureMarkerSymbol("images/flag.png", 24, 24);
pms.setOffset(9, 11);
var sls = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DOT, new dojo.Color([255, 0, 0, .55]), 4);
var measurement = new esri.dijit.Measurement({
map : mymap,
lineSymbol : sls,
pointSymbol : pms
}, dojo.byId('measurementDiv'));
measurement.startup();
measurement.setTool("area", false);
}
function pointToExtent(map, point, toleranceInPixel) {
var pixelWidth = map.extent.getWidth() / map.width;
var toleraceInMapCoords = toleranceInPixel * pixelWidth;
return new esri.geometry.Extent( point.x - toleraceInMapCoords,
point.y - toleraceInMapCoords,
point.x + toleraceInMapCoords,
point.y + toleraceInMapCoords,
map.spatialReference );
}
dojo.ready(init);
Best Answer
It's not listed in the documentation, but you can access the functions that control the Measurement Widget through areaToggleButton and distanceToggleButton. Here's an example using your your initToolbar function.