Community

Help with scope issue

857
11
Jump to solution
08-23-2013 10:47 AM
JessicaKnight1
by
New Contributor III
‎08-23-2013 10:47 AM
I am using this code as an example for my own coding: https://developers.arcgis.com/en/javascript/jssamples/query_buffer.html

I want to be able to have the user click a button to trigger the buffer/selection to be carried out rather than it just the map loading, but I can't figure out how to do that. Anyone have any direction for me? I'm a novice with coding, so I may be missing something easy.
0 Kudos
1 Solution

Accepted Solutions
JohnGravois
by
Frequent Contributor
‎08-23-2013 03:16 PM
you could achieve this the following way:

1.  first add a dom node in the <body> of your html for your new button
<button id="buffer">Buffer</button>

2.  next, add a reference to the dojo module 'on' in the require section of your code and make sure to add a corresponding variable below so that you can reference the module from your code
"esri/config", "dojo/_base/Color", "dojo/dom", "dojo/on", "dojo/domReady" ... esriConfig, Color, dom, on

3.  look for the map click event handler code and place the existing code inside a new event handler to make sure nothing is wired up until your button is clicked
on(dom.byId("buffer"), "click", function () {  myMapClick = map.on("click", function (evt) {   //define input buffer parameters   var params = new BufferParameters();   params.geometries = [evt.mapPoint];   params.distances = [1];   params.unit = GeometryService.UNIT_STATUTE_MILE;    geometryService.buffer(params);  }); });

4.  if you want to disconnect the map click event after every single buffer, call 'myMapClick.remove();' inside the buffer complete event handler
geometryService.on("buffer-complete", function(result){         //disconnect map click each time a buffer is completed  myMapClick.remove();

check out "Working with events" for more info.

View solution in original post

0 Kudos
11 Replies
JohnGravois
by
Frequent Contributor
‎08-23-2013 03:16 PM
you could achieve this the following way:

1.  first add a dom node in the <body> of your html for your new button
<button id="buffer">Buffer</button>

2.  next, add a reference to the dojo module 'on' in the require section of your code and make sure to add a corresponding variable below so that you can reference the module from your code
"esri/config", "dojo/_base/Color", "dojo/dom", "dojo/on", "dojo/domReady" ... esriConfig, Color, dom, on

3.  look for the map click event handler code and place the existing code inside a new event handler to make sure nothing is wired up until your button is clicked
on(dom.byId("buffer"), "click", function () {  myMapClick = map.on("click", function (evt) {   //define input buffer parameters   var params = new BufferParameters();   params.geometries = [evt.mapPoint];   params.distances = [1];   params.unit = GeometryService.UNIT_STATUTE_MILE;    geometryService.buffer(params);  }); });

4.  if you want to disconnect the map click event after every single buffer, call 'myMapClick.remove();' inside the buffer complete event handler
geometryService.on("buffer-complete", function(result){         //disconnect map click each time a buffer is completed  myMapClick.remove();

check out "Working with events" for more info.
0 Kudos
LeandroVin
by
New Contributor II
‎08-24-2013 12:37 PM
Nice! I had the same issue! Thank you.
0 Kudos
JessicaKnight1
by
New Contributor III
‎08-28-2013 12:53 PM
Is there a way to do this in version 3.5 of the API? I quickly tried swapping things over to 3.6 with the new require([]) format, but things didn't want to work.
0 Kudos
JohnGravois
by
Frequent Contributor
‎08-28-2013 12:59 PM
you can use the legacy dojo.require() instead even at 3.6.  can you post what you've got so far?  i'd be happy to take a look.
0 Kudos
JohnGravois
by
Frequent Contributor
‎08-28-2013 01:38 PM
i decided to write up a fiddle using dojo.require() to help you compare and contrast the differences with our published AMD sample.  the live code doesn't work (because you need a proxy to pass the buffer geometry to the spatial query), but it will run on your own machine just fine after you update the proxy reference.

when translating between new AMD samples and old dojo.require() code, the biggest thing you have to watch out for is the way you instantiate new objects.  AMD gives us the opportunity to create a new variable which acts as a shorthand reference to modules that have been loaded, so migrating the code into an older app requires that you switch back to the full path.

//AMD
var map = new Map(...
var symbol = new SimpleMarkerSymbol(..

//non AMD
map = new esri.Map(...
symbol = new esri.symbol.SimpleMarkerSymbol(...
0 Kudos
JessicaKnight1
by
New Contributor III
‎08-29-2013 06:15 AM
Here is my code. I'm definitely still pretty novice at this, so I'm sure its something small that I need to adjust. But I keep getting an "on is not defined" error in Firebug. 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
        <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
        <title>FiberAnalytics Resource Atlas</title>
        <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dijit/themes/claro/claro.css">
        <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dojox/layout/resources/FloatingPane.css">
        <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/esri/dijit/css/Popup.css">
  <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/esri/css/esri.css" />
        <style>
            html, body {
                height: 98%;
                width: 98%;
                margin: 0;
                padding: 5px;
                font-family: helvetica, arial, sans-serif;
                font-size: 90%;
            }
            
            #title {
                background-color: red;
                color: white;
                background-repeat: no-repeat;
                background-position: right;
                background-attachment: fixed;
            }
            
            #footer {
                background-color: red;
                color: white;
            }
            
            #leftPane {
                width: 15%;
                overflow: auto
            }
            
            #mapDiv {
                border: 1px solid #666;
            }
   @import "http://js.arcgis.com/3.6/js/dojo/dijit/themes/claro/claro.css";
      .zoominIcon { background-image:url(images/ZoomIn.png); width:16px; height:16px; }
      .zoomoutIcon { background-image:url(images/ZoomOut.png); width:16px; height:16px; }
      .zoomfullextIcon { background-image:url(images/Full.png); width:16px; height:16px; }
      .zoomprevIcon { background-image:url(images/Previous.png); width:16px; height:16px; }
      .zoomnextIcon { background-image:url(images/Next.png); width:16px; height:16px; }
      .panIcon { background-image:url(images/Pan.png); width:16px; height:16px; }
      .deactivateIcon { background-image:url(images/Decline.png); width:16px; height:16px; }
            
                      
        </style>
  <script type="text/javascript">
          var djConfig = {
          parseOnLoad: true,
          packages: [{   
      "name": "agsjs",
            "location": "http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/2.06/build/agsjs"
   
          }]
        };
        </script>
        <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.5">
        </script>
        <script>
        function checkbox_notify()   // function to notify what checkboxes are selected
  {
   var textbuff = "";
   if( document.getElementById('swine') ) textbuff += "Swine Checked";
  } 
   
    dojo.require("esri.map");
  dojo.require("dijit.layout.BorderContainer");
     dojo.require("dijit.layout.ContentPane");
     dojo.require("esri.toolbars.draw");
  dojo.require("esri.tasks.query");
  dojo.require("esri.tasks.geometry");
  dojo.require("esri.layers.FeatureLayer");
  dojo.require("agsjs.dijit.TOC");
  dojo.require("esri.toolbars.navigation");
       dojo.require("dijit.form.Button");
       dojo.require("dijit.Toolbar");
  dojo.require("dojo.dom");
  dojo.require("dojo.on");
  
  
  
  var map, swineFarms, poultryFarms, dairyFarms, landfills, woodWaste, sawmills, pulpMills, biomass, cofire, biofuel, navToolbar, mapClick;
  
    function init() {
   
   var spatialRef = new esri.SpatialReference({wkid:102113});
   var initialExtent = new esri.geometry.Extent();
                initialExtent.xmin = -9437935.76180124;
                initialExtent.ymin =  3588581.46154952;
                initialExtent.xmax = -8309412.09713561;
                initialExtent.ymax = 4768846.60774257;
    initialExtent.spatialReference = spatialRef;
    
   map = new esri.Map("mapDiv", {
   extent: initialExtent,
       basemap: "streets"
      });
  
   
   var NCResourceAtlas = new esri.layers.ArcGISDynamicMapServiceLayer("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer");
   
    var toc = new agsjs.dijit.TOC({
                        map: map,
                        layerInfos: [{
                            layer: NCResourceAtlas,
                            title: "North Carolina"
                        }]
                    }, 'tocDiv');
   
     
   map.addLayer (NCResourceAtlas);
   
   //add navigation toolbar
   navToolbar = new esri.toolbars.Navigation(map);
         dojo.connect(navToolbar, "onExtentHistoryChange", extentHistoryChangeHandler);
   
    navToolbar.zoomToFullExtent = function(){
                    var map = this.map;
                    map.setExtent(initialExtent);
                }
    
   swineFarms = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/7", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Swine Farm"),
   outFields: ["FARM_NAME", "ANIMAL_POP"]
   });
   
   var symbolSwine = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([247, 34, 101, 0.9]), 1),
           new dojo.Color([207, 34, 171, 0.5])
         );
         swineFarms.setSelectionSymbol(symbolSwine); 
         map.addLayer(swineFarms);
   
   poultryFarms = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/8", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Poultry Farm"),
   outFields: ["EstNumBird"]
   });
0 Kudos
JessicaKnight1
by
New Contributor III
‎08-29-2013 06:17 AM
(Had to do this in multiple parts)

var symbolPoultry = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([255, 255, 0, 0.9]), 1),
           new dojo.Color([235, 255, 60, 0.5])
         );
         poultryFarms.setSelectionSymbol(symbolPoultry); 
         map.addLayer(poultryFarms);
   
   dairyFarms = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/9", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Dairy Farm"),
   outFields: ["FARM_NAME", "CATTLE_DES"]
   });
   
   var symbolDairy = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([0, 204, 102, 0.9]), 1),
           new dojo.Color([0, 204, 40, 0.5])
         );
         dairyFarms.setSelectionSymbol(symbolDairy); 
         map.addLayer(dairyFarms);
   
   landfills = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/10", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Landfill"),
   outFields: ["LANDFID", "PHYS_ADDR"]
   });
   
   var symbolLandfills = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([0, 0, 204, 0.9]), 1),
           new dojo.Color([0, 0, 185, 0.5])
         );
         landfills.setSelectionSymbol(symbolLandfills); 
         map.addLayer(landfills);
   
   woodWaste = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/2", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Wood Waste Facility"),
   outFields: ["COMPANY", "MATERIAL"]
   });
   
   var symbolWaste = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([51, 0, 25, 0.9]), 1),
           new dojo.Color([31, 0, 20, 0.5])
         );
         woodWaste.setSelectionSymbol(symbolWaste); 
         map.addLayer(woodWaste);
   
   sawmills = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/3", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Sawmill"),
   outFields: ["COMPANY"]
   });
   
   var symbolSawmills = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([0, 0, 0, 0.9]), 1),
           new dojo.Color([0, 0, 0, 0.5])
         );
         sawmills.setSelectionSymbol(symbolSawmills); 
         map.addLayer(sawmills);
   
   pulpMills = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/4", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Pulp Mill"),
   outFields: ["FACILITY"]
   });
   
   var symbolPulp = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([160, 160, 160, 0.9]), 1),
           new dojo.Color([160, 160, 160, 0.5])
         );
         pulpMills.setSelectionSymbol(symbolPulp); 
         map.addLayer(pulpMills);
   
   biomass = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/5", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Biomass Facility"),
   outFields: ["NAME", "TECHNOLOGY", "FEEDSTOCKS"]
   });
   
   var symbolBiomass = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([255, 153, 51, 0.9]), 1),
           new dojo.Color([235, 153, 45, 0.5])
         );
         biomass.setSelectionSymbol(symbolBiomass); 
         map.addLayer(biomass);
   
   cofire = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/11", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Potential Cofire Plant"),
   outFields: ["NAME", "COUNTY"]
   });
   
   var symbolCofire = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([102, 255, 255, 0.9]), 1),
           new dojo.Color([85, 255, 230, 0.5])
         );
         cofire.setSelectionSymbol(symbolCofire); 
         map.addLayer(cofire);
   
   biofuels = new esri.layers.FeatureLayer ("http://gismap.oit.ncsu.edu/arcgis/rest/services/FiberAnalytics_IMS/MapServer/12", {
   mode: esri.layers.FeatureLayer.MODE_SELECTION,
   infoTemplate: new esri.InfoTemplate("Biofuels Distributer"),
   outFields: ["Company"]
   });
   
   var symbolBiofuels = new esri.symbol.SimpleMarkerSymbol(
           esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
           new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_NULL, 
           new dojo.Color([127, 0, 255, 0.9]), 1),
           new dojo.Color([100, 0, 230, 0.5])
         );
         biofuels.setSelectionSymbol(symbolBiofuels); 
         map.addLayer(biofuels);
   
   
   
   var geometryService = new esri.tasks.GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
   
   //when the map is clicked create a buffer around the click point of the specified distance.
            
   on(dojo.byId("buffer"), "click", function(){
   
   mapClick = map.on("click", function (evt){
   var params = new esri.tasks.BufferParameters();
   params.distances = [dojo.byId("distance").value];
   params.bufferSpatialReference = new esri.SpatialReference({wkid: 102113});
   params.outSpatialReference = new esri.SpatialReference({wkid: 102113});
   params.unit = eval("esri.tasks.GeometryService." + dojo.byId("unit").value);
     
   params.geometries = [evt.mapPoint];
   geometryService.buffer(params);
   });
   });
0 Kudos
JessicaKnight1
by
New Contributor III
‎08-29-2013 06:17 AM
Final part. 

geometryService.on("buffer-complete", function(result){
   mapClick.remove();
          map.graphics.clear();
          //draw the buffer geometry on the map as a map graphic
          var symbol = new esri.symbol.SimpleFillSymbol(
            esri.symbol.SimpleFillSymbol.STYLE_NULL,
            new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SHORTDASHDOTDOT,
            new dojo.Color([105,105,105]), 2),new dojo.Color([255,255,0,0.25])
          );
          var bufferGeometry = result.geometries[0]
          var graphic = new esri.Graphic(bufferGeometry, symbol);
          map.graphics.add(graphic);

          //Select features within the buffered polygon. To do so we'll create a query to use the buffer graphic
          //as the selection geometry.
          var query = new esri.tasks.Query();
          query.geometry = bufferGeometry;
          if( document.getElementById('swine').checked ) swineFarms.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
         if( document.getElementById('poultry').checked ) poultryFarms.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
             if( document.getElementById('dairy').checked ) dairyFarms.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
             if( document.getElementById('landfill').checked ) landfills.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
             if( document.getElementById('woodwaste').checked ) woodWaste.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
             if( document.getElementById('sawmill').checked ) sawmills.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
             if( document.getElementById('pulp').checked ) pulpMills.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
             if( document.getElementById('biomass').checked ) biomass.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
             if( document.getElementById('cofire').checked ) cofire.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
             if( document.getElementById('biofuel').checked ) biofuels.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function(results){ });
   
    });
  

        esri.config.defaults.io.proxyUrl = "/proxy";
        esri.config.defaults.io.alwaysUseProxy = false;
   
   
      }

   function initToolbar(map) {
     tb = new esri.toolbars.Draw(map);
     dojo.connect(tb, "onDrawEnd", doBuffer);
    }
 
  function showBuffer(bufferedGeometries) {
        var symbol = new esri.symbol.SimpleFillSymbol(
         esri.symbol.SimpleFillSymbol.STYLE_SOLID,
         new esri.symbol.SimpleLineSymbol(
          esri.symbol.SimpleLineSymbol.STYLE_SOLID,
           new dojo.Color([255,0,0,0.65]), 2
         ),
         new dojo.Color([255,0,0,0.35])
        );

        dojo.forEach(bufferedGeometries, function(geometry) {
         var graphic = new esri.Graphic(geometry,symbol);
         map.graphics.add(graphic);
        });
        tb.deactivate();
        map.showZoomSlider();
      } 
   
  function clearAll() {
   map.graphics.clear();
   swineFarms.clearSelection();
   poultryFarms.clearSelection();
   dairyFarms.clearSelection();
   landfills.clearSelection();
   woodWaste.clearSelection();
   sawmills.clearSelection();
   pulpMills.clearSelection();
   biomass.clearSelection();
   cofire.clearSelection();
   biofuels.clearSelection();
  }
  
  function extentHistoryChangeHandler() {
        dijit.byId("zoomprev").disabled = navToolbar.isFirstExtent();
        dijit.byId("zoomnext").disabled = navToolbar.isLastExtent();
      }


    dojo.ready(init);
  </script> 
  

  </head>
    <body class="claro">
        <div id="navToolbar" data-dojo-type="dijit.Toolbar">
         <div data-dojo-type="dijit.form.Button" id="zoomin"  data-dojo-props="iconClass:'zoominIcon', onClick:function(){navToolbar.activate(esri.toolbars.Navigation.ZOOM_IN);}">Zoom In</div>
         <div data-dojo-type="dijit.form.Button" id="zoomout" data-dojo-props="iconClass:'zoomoutIcon', onClick:function(){navToolbar.activate(esri.toolbars.Navigation.ZOOM_OUT);}">Zoom Out</div>
         <div data-dojo-type="dijit.form.Button" id="zoomfullext" data-dojo-props="iconClass:'zoomfullextIcon', onClick:function(){navToolbar.zoomToFullExtent();}">Full Extent</div>
         <div data-dojo-type="dijit.form.Button" id="zoomprev" data-dojo-props="iconClass:'zoomprevIcon', onClick:function(){navToolbar.zoomToPrevExtent();}">Prev Extent</div>
         <div data-dojo-type="dijit.form.Button" id="zoomnext" data-dojo-props="iconClass:'zoomnextIcon', onClick:function(){navToolbar.zoomToNextExtent();}">Next Extent</div>
         <div data-dojo-type="dijit.form.Button" id="pan" data-dojo-props="iconClass:'panIcon', onClick:function(){navToolbar.activate(esri.toolbars.Navigation.PAN);}">Pan</div>
         <div data-dojo-type="dijit.form.Button" id="deactivate" data-dojo-props="iconClass:'deactivateIcon' ,onClick:function(){navToolbar.deactivate();}">Deactivate</div>
      </div>
        <div id="appcontent" data-dojo-type="dijit/layout/BorderContainer" design="headline" gutters="true" style="width: 100%; height: 90%; margin: 0;">
  
            <div id="title" data-dojo-type="dijit/layout/ContentPane" region="top">
                <h1>FiberAnalytics Woody Biomass Resource Atlas</h1>
            </div>
   
            <div data-dojo-type="dijit/layout/ContentPane" id="leftPane" region="left" splitter="true">
                <div data-dojo-type="dijit/TitlePane" id="legendPane" title="Legend">
                        <div id="tocDiv">
                        </div>
                </div>
             </div>
                              
            <div id="rightPane" data-dojo-type="dijit/layout/ContentPane" region="right">
                <div data-dojo-type="dijit/TitlePane" title="Find Nearby Facilities">
                    Select a buffer distance and facility type and
     <br/>place a point on the map.   
                 <br/>                
    <div><b><u>Buffer Parameters</u></b></div>
    <b>Distance:</b> <input type="text" id="distance" size="5" value="25" />
         <select id="unit" style="width:100px;">
          <option value="UNIT_STATUTE_MILE">Miles</option>
          <option value="UNIT_FOOT">Feet</option>
          <option value="UNIT_KILOMETER">Kilometers</option>
          <option value="UNIT_METER">Meters</option>
          <option value="UNIT_NAUTICAL_MILE">Nautical Miles</option>
          <option value="UNIT_US_NAUTICAL_MILE">US Nautical Miles</option>
          <option value="UNIT_DEGREE">Degrees</option>
         </select><br />
    <div><b>Facility Types</b></div>         
         <input type="checkbox" id="swine" data-dojo-type="dijit/form/CheckBox" onclick="checkbox_notify();"><label for="swine">Swine</label>
         <input type="checkbox" id="poultry" data-dojo-type="dijit/form/CheckBox"><label for="poultry">Poultry</label>
         <input type="checkbox" id="dairy" data-dojo-type="dijit/form/CheckBox"><label for="dairy">Dairy</label>
         <br>
         <input type="checkbox" id="landfill" data-dojo-type="dijit/form/CheckBox"><label for="landfill">Landfill</label>
         <input type="checkbox" id="woodwaste" data-dojo-type="dijit/form/CheckBox"><label for="woodwaste">Wood Waste</label>
         <input type="checkbox" id="sawmill" data-dojo-type="dijit/form/CheckBox"><label for="sawmill">Sawmill</label>
         <br>
         <input type="checkbox" id="pulp" data-dojo-type="dijit/form/CheckBox"><label for="pulp">Pulp</label>
         <input type="checkbox" id="biomass" data-dojo-type="dijit/form/CheckBox"><label for="biomass">Biomass Facilities</label>
         <input type="checkbox" id="cofile" data-dojo-type="dijit/form/CheckBox"><label for="cofile">Co-Fire</label>
         <br>
         <input type="checkbox" id="biofuel" data-dojo-type="dijit/form/CheckBox"><label for="biofuel">Biofuel Distributers</label>
    <br>
    <button data-dojo-type="dijit.form.Button" id="buffer">Place Point</button>
    <button data-dojo-type="dijit.form.Button" type="button" onclick="clearAll();">Clear Graphics</button>
    <br>
            </div>
            </div>
            <div id="mapDiv" data-dojo-type="dijit/layout/ContentPane" region="center" style="overflow:hidden;">
            </div>
            <div id="footer" data-dojo-type="dijit/layout/ContentPane" region="bottom">
                <center>
                    Created by Jessica Knight, NCSU Extension Forestry 2013
                </center>
            </div>
        </div>
    </body>
</html>
0 Kudos
JeffPace
by MVP Alum
MVP Alum
‎08-29-2013 06:44 AM
your code is in legacy style (dojo.require, etc..)

so you need to use

dojo.connect() instead of on (which is AMD style)

the onclick event is named different also
0 Kudos