<!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" /> <!--The viewport meta tag is used to improve the presentation and behavior of the samples on iOS devices--> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title>Selecting Zip Codes</title> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/css/Popup.css"> <style> html, body { margin: 10px; padding: 10px; font-family:"Verdana"; font-size:small; } #map { border: solid #97DCF2 1px; width: 50%; height: 100%; } #header { border: solid #97DCF2 1px; width: 50%; height: 10%; } #footer { border: solid #97DCF2 1px; width: 50%; height: 10%; } #footer2 { border: solid #97DCF2 1px; width: 50%; height: 10%; } #footer3 { width: 50%; height: 10%; padding: 10; } #footer4 { border: solid #97DCF2 1px; width: 50%; height: 10%; padding: 10; font-size: x-small; } </style> <script type="text/javascript"> djConfig = { parseOnLoad : true }; </script> <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.8"></script> <script type="text/javascript"> dojo.require("esri.map"); dojo.require("esri.layers.FeatureLayer"); dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.layout.AccordionContainer"); dojo.require("esri.dijit.Legend"); dojo.require("esri.toolbars.draw"); dojo.require("esri.tasks.query"); dojo.require("esri.dijit.Popup"); dojo.require("dojo.number"); var selectionToolbar, zipCodeLayer; var legendLayers = []; function init() { // Set the Initial Extent var initialExtent = new esri.geometry.Extent(-123.5328, 32.4344, -112.2582, 37.64041, new esri.SpatialReference({ wkid : 4326 })); // Set up the popup window 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")); var map = new esri.Map("map", { extent : esri.geometry.geographicToWebMercator(initialExtent), infoWindow : popup, slider : true, nav : true }); dojo.connect(map, "onLoad", initSelectToolbar); // Set the basemap var baseMapLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer"); map.addLayer(baseMapLayer); // Set the selection symbols var fieldsSelectionSymbol = new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255, 255, 0, 0.5])); fieldsSelectionSymbol.setOutline(new esri.symbol.SimpleLineSymbol("dashdot", new dojo.Color([255, 0, 0]), 2)); // Establish the feature layer to be populated - the Zip Codes Layer zipCodeLayer = new esri.layers.FeatureLayer("http://arcgis.focusproject.org:8399/arcgis/rest/services/2012APR11_WhereAreTheVeterans_ZipCod/MapServer/0", { mode : esri.layers.FeatureLayer.MODE_ONDEMAND, opacity : .9, outFields : ["*"], }); zipCodeLayer.setSelectionSymbol(fieldsSelectionSymbol); // Set the Feature Layer's symbol map.addLayers([zipCodeLayer]); dojo.connect(zipCodeLayer, "onSelectionComplete", sumVeterans); // When you're done selecting, perform the summation total of the veterans dojo.connect(zipCodeLayer, "onSelectionClear", function(features) { dojo.byId('messages').innerHTML = "<i>No Selected Fields</i>"; }); dojo.connect(map, 'onLoad', function(theMap) { //resize the map when the browser resizes dojo.connect(dijit.byId('map'), 'resize', map, map.resize); }); } // ToolBar Function function initSelectToolbar(map) { selectionToolbar = new esri.toolbars.Draw(map); var selectQuery = new esri.tasks.Query(); dojo.connect(selectionToolbar, "onDrawEnd", function(geometry) { selectionToolbar.deactivate(); selectQuery.geometry = geometry; zipCodeLayer.selectFeatures(selectQuery, esri.layers.FeatureLayer.SELECTION_NEW); }); } // Sum Veterans Function function sumVeterans(features) { var imputedSum = 0; //summarize the cummulative gas production to display dojo.forEach(features, function(feature) { imputedSum = imputedSum + feature.attributes.ImputedVeteran; }); //dojo.byId('messages').innerHTML = "Total Veterans: " + imputedSum + ""; var formattedImputedSum = dojo.number.format(imputedSum) dojo.byId('messages').innerHTML = "Total Veterans: " + formattedImputedSum + ""; } dojo.addOnLoad(init); </script> </head> <body class="claro"> <div id="header" dojotype="dijit.layout.ContentPane" region="top" style="overflow:hidden;"> <b>Veteran Population by Zip Codes in California</b><br> Use the Selection Tool to calculate the total number of veterans within a certain area. </div> <div id="map" dojotype="dijit.layout.ContentPane" region="top" style="overflow:hidden;"></div> <div id="footer" dojotype="dijit.layout.ContentPane" region="bottom" style="overflow:hidden;"> <button dojoType="dijit.form.Button" onClick="selectionToolbar.activate(esri.toolbars.Draw.EXTENT);"> Select Zip Code Polygons </button> <button dojoType="dijit.form.Button" onClick="zipCodeLayer.clearSelection();"> Clear Selection </button> <br> </div> <div id="legendDiv" dojotype="dijit.layout.ContentPane" region="bottom" style="overflow:hidden;"></div> <div id="footer2" dojotype="dijit.layout.ContentPane" region="bottom" style="overflow:hidden;"> <span id="messages"></span> </div> <div id="footer3" dojotype="dijit.layout.ContentPane" region="bottom" style="overflow:hidden;"> </div> <div id="footer4" dojotype="dijit.layout.ContentPane" region="bottom" style="overflow:hidden;"> <img src="https://lh5.googleusercontent.com/-SmFdguzq84o/T5Fqf6acazI/AAAAAAAACnA/vYfGcbRbmCY/s49/blue-1.png" align="middle"> 0 - 896 <img src="https://lh4.googleusercontent.com/-Ns3epG-BoZM/T5Fqf2CruiI/AAAAAAAACm0/2NgNDuzoDT8/s49/blue-2.png" align="middle"> 897 - 2296 <img src="https://lh4.googleusercontent.com/-m8vMvN0uFtg/T5Fqf5_rjPI/AAAAAAAACmw/3r3DFtIz00U/s49/blue-3.png" align="middle"> 2297 - 3973 <img src="https://lh3.googleusercontent.com/-OhM1oitx1HQ/T5FqgQ6UBLI/AAAAAAAACnQ/D8Se4OenyUw/s49/blue-4.png" align="middle"> 3974 - 6574 <img src="https://lh4.googleusercontent.com/-RZ62_uGLCec/T5FqgYeFySI/AAAAAAAACnE/gf6Wr4HMu2Q/s49/blue-5.png" align="middle"> 6575 - 13,263 </body> </html>
Solved! Go to Solution.
Hi Rachel,
Your code looks ok, nothing seems wrong. Except that you have a missing semi-colon on the line
var formattedImputedSum = dojo.number.format(imputedSum)
Could this be causing the problem?
Samir