Latest Contributions by SatyanarayanaNarmala

‎07-08-2015

Hi TIM, Here is my code, where legend does not show anything <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title> </title> <link rel="stylesheet" href="http://js.arcgis.com/3.10/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.10/js/esri/css/esri.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css"> <style type="text/css">body,html,#main{margin:0;padding:0;height:100%;width:100%;}</style> <script src="http://js.arcgis.com/3.13/"></script> <script>dojoConfig = { parseOnLoad: true };</script> <style> html, body { height: 97%; width: 98%; margin: 1%; } #rightPane { width: 90%; } #legendPane { border: solid #97DCF2 1px; } </style> <style> html, body, #map { padding: 0; margin: 0; height: 100%; } /* Change color of icons to match bar chart and selection symbol */ .esriPopup.dark div.titleButton, .esriPopup.dark div.titlePane .title, .esriPopup.dark div.actionsPane .action { color: #000000; font-weight: bold; } /* Additional customizations */ .esriPopup.dark .esriPopupWrapper { border: none; } .esriPopup .contentPane { text-align: left; } .esriViewPopup .gallery { margin: 0 auto; } .title { padding:10px; background:#fafafa; } .title .logo img { float:left; margin-right:10px; } .title .logo h1{ color: #C9584F; padding: 0px; font-size: 30px; font-weight: bold; float:left; font-family:Arial, Helvetica, sans-serif; margin:0px; } .title .logo h1>span{ color: #111; padding: 0px; font-size: 20px; font-weight: bold; } .title .cm { float:right; text-align:center; color: #C9584F; font-size:15px; } .title .cm h2{ color: #C9584F; font-size:15px; font-family:Arial, Helvetica, sans-serif } </style> <script> var map; var veTileLayer; var findTask, findParams; var center, zoom; var grid, store, store3; var county; var resizeTimer; require([ "esri/map", "esri/tasks/query", "dojo/parser", "esri/dijit/Legend", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "esri/tasks/IdentifyTask", "esri/tasks/IdentifyParameters", "dojo/_base/array","dojo/DeferredList", "dijit/form/ComboBox", "dojo/data/ItemFileReadStore","dojo/store/Memory", "esri/virtualearth/VETiledLayer", "dijit/form/Button", "esri/tasks/FindTask", "esri/tasks/FindParameters", "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "dijit/registry", "dojo/_base/connect", "dojox/grid/DataGrid", "esri/dijit/Popup", "esri/dijit/PopupTemplate", "esri/layers/FeatureLayer", "esri/symbols/SimpleFillSymbol", "esri/Color", "dojo/dom-class", "dojo/dom-construct", "dojox/charting/Chart", "dojox/charting/themes/Dollar", "dojo/on", "dijit/layout/AccordionContainer", "dojo/domReady!"], function(Map, query, parser, BorderContainer, ContentPane, Legend, IdentifyTask, IdentifyParameters,arrayUtils,DeferredList, ComboBox, ItemFileReadStore, Memory, VETiledLayer, Button, FindTask, FindParameters, SimpleMarkerSymbol, SimpleLineSymbol, registry, connect, DataGrid, Popup, PopupTemplate, FeatureLayer, SimpleFillSymbol, Color, domClass, domConstruct, Chart, theme, on, Scalebar) { parser.parse(); registry.byId("mySelect1").on("change", doFind); /* map = new Map("map"); function init() { //Creates the Virtual Earth layer to add to the map //Example for adding a Bing Maps key // bingMapsKey: "1B2C3OlkbxWHYa1b2c3qkPrO_Ou3nRrGtSa_5Op-xvPNya1b2c3", veTileLayer = new esri.virtualearth.VETiledLayer({ bingMapsKey:'Ame5R45lEOTdPXxlhxuAXN2sDT8vyEJcgXGeZpPOPHBLbg2XqkPMaL5OJHp0OlV0', mapStyle: esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL }); map.addLayer(veTileLayer); infoWindow: popup } dojo.ready(init);*/ var fill = new SimpleFillSymbol("solid", null, new Color("#A4CE67")); var popup = new Popup({ fillSymbol: fill, titleInBody: false }, domConstruct.create("div")); //Add the dark theme which is customized further in the <style> tag at the top of this page domClass.add(popup.domNode, "dark"); findTask = new FindTask("http://gisserver.cgg.gov.in/arcgis/rest/services/CDMA/swachhts/MapServer/"); map = new Map("map", { basemap: "satellite", /*center: [-122.45, 37.75], // longitude, latitude */ center : [79.2, 18.10], zoom: 6, infoWindow: popup }); var template = new PopupTemplate({ title: "SWACHH TELANGANA APPLICANTS <BR>", description: "<BR>BENEFICIARY ID: {beneficiary_id} <br> <br>BENEFICIARY NAME: {applicant_name} <br><br>FATHERS NAME: {fathername}<br><br> ADDRESS: {address} <br><br> CASTE: {caste} <br> <br> MOBILE: {mobile} <br><br> AADHAR NO:: {aadhar_number}<br><br> COMMUNICATION STATUS: {comm_status} <br><br> PHOTO: <a href=http://swachhts.cgg.gov.in/photos_uploaded/{applicant_photo} > <img src={applicant_photo} WIDTH=200 HEIGHT=200></a> <br><br> SITE PHOTO : <a href=http://swachhts.cgg.gov.in/photos_uploaded/{applicant_site_photo} > <img src={applicant_site_photo} WIDTH=200 HEIGHT=200></a> <br><br> STAGE : {stage}<br>", }); var featureLayer = new FeatureLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/CDMA/swachhts/MapServer/0",{ mode: FeatureLayer.MODE_ONDEMAND, outFields: ["*"], infoTemplate: template }); var rivers = new FeatureLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/CDMA/swachhts/MapServer/0", { mode: FeatureLayer.MODE_ONDEMAND, outFields:["*"] }); var waterbodies = new FeatureLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/CDMA/swachhts/MapServer/2", { mode: FeatureLayer.MODE_ONDEMAND, outFields:["*"] }); veTileLayer = new VETiledLayer({ bingMapsKey:'Ame5R45lEOTdPXxlhxuAXN2sDT8vyEJcgXGeZpPOPHBLbg2XqkPMaL5OJHp0OlV0', mapStyle: esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL }); map.addLayer(veTileLayer); //map.addLayer(featureLayer); var polygonQuery = null; var polygonQueryTask = null; var polygonQuery1 = null; var polygonQueryTask1 = null; // RIYAS: Wait till map is loaded before firing query, needed for getting map spatial reference map.on("load", function () { var queryTask = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/CDMA/swachhts/MapServer/2"); highlightSymbol = new esri.symbol.SimpleMarkerSymbol().setColor(new dojo.Color([255,0,0])); symbol321 = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_SQUARE, 0.1, null, new Color([255, 255, 0, 0.5])); // var queryTask1 = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/sample/pattasample/MapServer/2"); //Define query parameters var query = new esri.tasks.Query(); query.outFields = ["dname"]; query.returnGeometry = true; query.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query.where = "dname <> ''" queryTask.execute(query,populateList); //Define query parameters /*var query1 = new esri.tasks.Query(); query1.outFields = ["dname", "mname"]; query1.returnGeometry = true; query1.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query1.where = "mname<> ''" queryTask1.execute(query1,populateList1);*/ // RIYAS: Setup query to behave as identify polygonQueryTask = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/CDMA/swachhts/MapServer/2"); polygonQuery = new esri.tasks.Query(); polygonQuery.returnGeometry = true; polygonQuery.outFields = ["dname"]; polygonQuery.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS; polygonQuery.outSpatialReference = map.spatialReference; // RIYAS: Setup query to behave as identify polygonQueryTask1 = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/CDMA/swachhts/MapServer/1"); polygonQuery1 = new esri.tasks.Query(); polygonQuery1.returnGeometry = true; polygonQuery1.outFields = ["place", "name"]; polygonQuery1.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS; polygonQuery1.outSpatialReference = map.spatialReference; // RIYAS: Setup query to behave as identify findParams = new FindParameters(); findParams.returnGeometry = true; findParams.layerIds = [0]; findParams.searchFields = ["town_city"]; findParams.outSpatialReference = map.spatialReference; console.log("find sr: ", findParams.outSpatialReference); }); var infoTemplate = new esri.InfoTemplate("District: ${dname}", "District : ${dname}<br/>"); var infoTemplate1 = new esri.InfoTemplate("DISTRICT: ${place}", "District : ${place}<br/> Mandal : ${name}<br/> "); var infoTemplates = [infoTemplate, infoTemplate1]; //map.on("click", executeIdentifyTask); // RIYAS: Execute query to behave as identify function executeIdentifyTask (where, pnt) { //polygonQuery.where = event.mapPoint; //polygonQuery1.where = event.mapPoint; polygonQuery.where = where; polygonQuery1.where = where; var deferred = polygonQueryTask .execute(polygonQuery); var deferred1 = polygonQueryTask1 .execute(polygonQuery1); // InfoWindow expects an array of features from each deferred // object that you pass. If the response from the task execution // above is not an array of features, then you need to add a callback // like the one above to post-process the response and return an // array of features. var defList = new DeferredList([deferred, deferred1]).then(function (results){ var features = []; arrayUtils.forEach(results,function(result, idx){ if (result[0] === true){ features = features.concat(arrayUtils.map(result[1].features, function (feature) { feature.setInfoTemplate(infoTemplates[idx]); return feature; })); } }); map.infoWindow.setFeatures(features); map.infoWindow.show(pnt); }); } //var initialExtent = new esri.geometry.Extent(-85.915,38.105,-85.52,38.33, // new esri.SpatialReference({wkid:4326}) ); // map = new esri.Map("map", {extent:initialExtent}); //Create tiled and dynamic map services and add to the map - for the dynamic service set the transparency //and provide an id so we can access it later // map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer")); map.addLayer(new esri.layers.ArcGISDynamicMapServiceLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/CDMA/swachhts/MapServer", {"opacity":1,"id":"dynamic"})); function populateList(results) { //initialize InfoTemplate //create symbol for selected features symbol = new esri.symbol.SimpleMarkerSymbol(); symbol.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE); symbol.setSize(0.1); symbol.setColor(new dojo.Color([255, 255, 0, 0.5])); //Populate the dropdown list box with unique values // var county; var values = []; var testVals={}; //Add option to display all zoning types to the dropdown list values.push({name:""}) var features = results.features; dojo.forEach (features, function(feature) { county = feature.attributes.dname; if (!testVals[county]) { testVals[county] = true; values.push({name:county,shape:feature.geometry,centroid: feature.geometry.type === "point" ? feature.geometry : feature.geometry.getCentroid() }); // RIYAS: set shape to list store } }); var dataItems = { identifier: 'name', label: 'name', items: values }; var store = new dojo.store.Memory({data:dataItems}); dijit.byId("mySelect").store = store; //remove all graphics on the maps graphics layer map.graphics.clear(); //Performance enhancer - assign featureSet array to a single variable. var resultFeatures = results.features; //Loop through each feature returned for (var i = 0, il = resultFeatures.length; i < il; i++) { //Get the current feature from the featureSet. //Feature is a graphic var graphic = resultFeatures; graphic.setSymbol(symbol); //Set the infoTemplate. graphic.setInfoTemplate(infoTemplate); //Add graphic to the map graphics layer. map.graphics.add(graphic); // This takes the graphics array you get back from your query and // gets the overall extent for them. Make sure return geometry is set to // true in your query. var extent = esri.graphicsExtent(results.features); // Use that to set the extent, 1.5 is something I use in my app, but play with // it to find a setting you like, setting the second parameter to true will get you an extend // that is at the closest level of your cached service. map.setExtent(extent.expand(1.0), true); } } // this replaces your applyLayerDef() function dijit.byId("mySelect").on("change", function () { //Filter the layer to display only the selected zoning types var county = dijit.byId("mySelect").value; var centroid = dijit.byId("mySelect").item.centroid; if (county !== 'ALL') { var layerDefs = []; layerDefs[2] = "dname = " + "'" + county + "'"; layerDefs.visibleLayers = [2]; map.setExtent(dijit.byId("mySelect").item.shape.getExtent(infoTemplate).expand(1.7)); // RIYAS: Get shape from list store and zoom to its extent executeIdentifyTask("dname = '" + county + "'", centroid); // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setLayerDefinitions(layerDefs); } else { // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setDefaultLayerDefinitions(); } var queryTask1 = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/CDMA/swachhts/MapServer/1"); var query1 = new esri.tasks.Query(); query1.outFields = ["*"]; query1.returnGeometry = true; query1.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query1.where = "name <> '' and place ='"+dijit.byId("mySelect").value+"'" queryTask1.execute(query1,populateList1); }); function populateList1(results1) { //initialize InfoTemplate /* alert(dijit.byId("mySelect").value) var query1 = new esri.tasks.Query(); query1.outFields = ["dname", "mname"]; query1.returnGeometry = true; query1.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query1.where = "mname<> ''" queryTask1.execute(query1,populateList1); */ //create symbol for selected features symbol1 = new esri.symbol.SimpleMarkerSymbol(); symbol1.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE); symbol1.setSize(0.1); symbol1.setColor(new dojo.Color([255, 255, 0, 0.5])); //Populate the dropdown list box with unique values var city; var values1 = []; var testVals1={}; //Add option to display all zoning types to the dropdown list values1.push({name:""}) var features1 = results1.features; dojo.forEach (features1, function(feature1) { city = feature1.attributes.name; if (!testVals1[city]) { testVals1[city] = true; values1.push({name:city,shape:feature1.geometry,centroid: feature1.geometry.type === "point" ? feature1.geometry : feature1.geometry.getCentroid()}); // RIYAS: set shape to list store } }); var dataItems1 = { identifier: 'name', label: 'name', items: values1 }; var store1 = new dojo.store.Memory({data:dataItems1}); dijit.byId("mySelect1").store = store1; //remove all graphics on the maps graphics layer map.graphics.clear(); //Performance enhancer - assign featureSet array to a single variable. var resultFeatures1 = results1.features; //Loop through each feature returned for (var i = 0, il = resultFeatures1.length; i < il; i++) { //Get the current feature from the featureSet. //Feature is a graphic var graphic1 = resultFeatures1; graphic1.setSymbol(symbol1); //Set the infoTemplate. graphic1.setInfoTemplate(infoTemplate1); //Add graphic to the map graphics layer. map.graphics.add(graphic1); // This takes the graphics array you get back from your query and // gets the overall extent for them. Make sure return geometry is set to // true in your query. var extent1 = esri.graphicsExtent(results1.features); // Use that to set the extent, 1.5 is something I use in my app, but play with // it to find a setting you like, setting the second parameter to true will get you an extend // that is at the closest level of your cached service. map.setExtent(extent1.expand(1.0), true); } } // this replaces your applyLayerDef() function dijit.byId("mySelect1").on("change", function () { //Filter the layer to display only the selected zoning types var city = dijit.byId("mySelect1").value; var centroid = dijit.byId("mySelect1").item.centroid; if (city !== 'ALL') { var layerDefs1 = []; layerDefs1[2] = "name = " + "'" + city + "'"; layerDefs1.visibleLayers = [2]; //alert(dijit.byId("mySelect1").value) map.setExtent(dijit.byId("mySelect1").item.shape.getExtent(infoTemplate1).expand(1.7)); // RIYAS: Get shape from list store and zoom to its extent executeIdentifyTask("name = '" + city + "'", centroid); // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setLayerDefinitions(layerDefs); } else { // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setDefaultLayerDefinitions(); } }); function doFind() { //Set the search text to the value in the box var house = dijit.byId("mySelect1").value; //alert(house) findParams.searchText = house; findTask.execute(findParams, showResults); } function showResults(results) { map.graphics.clear(); //This function works with an array of FindResult that the task returns symbol = new esri.symbol.SimpleMarkerSymbol(); symbol.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE); symbol.setSize(1); symbol.setColor(new dojo.Color([255, 255, 0, 0.5])); // map.graphics.clear(); // var symbol = new SimpleFillSymbol( // SimpleFillSymbol.STYLE_SOLID, // new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([98, 194, 204]), 2), // new Color([98, 194, 204, 0.5]) // ); //create array of attributes var items = arrayUtils.map(results, function (result) { var graphic = result.feature; graphic.setSymbol(symbol); map.graphics.add(graphic); return result.feature.attributes; }); //Create data object to be used in store var data = { identifier : "beneficiary_id", //This field needs to have unique values label : "beneficiary_id", //Name field for display. Not pertinent to a grid but may be used elsewhere. items : items }; //Create data store and bind to grid. store = new ItemFileReadStore({ data : data }); var grid = registry.byId("grid"); grid.setStore(store); grid.on("rowclick", onRowClickHandler); //Zoom back to the initial map extent map.centerAndZoom(center, zoom); } /* function onRowClickHandler(evt) { map.graphics.clear(); var clickedTaxLotId = evt.grid.getItem(evt.rowIndex).benid; var selectedTaxLot = arrayUtils.filter(map.graphics.graphics, function (graphic) { return ((graphic.attributes) && graphic.attributes.benid === clickedTaxLotId[0]); }); if ( selectedTaxLot.length ) { map.setExtent(selectedTaxLot[0].geometry.getExtent(), true); } }*/ function onRowClickHandler(evt){ var FindDeceasedName = grid.getItem(evt.rowIndex).beneficiary_id; var SelectedFindDeceasedName; dojo.forEach(map.graphics.graphics,function(graphic){ graphic.setSymbol(symbol321); if((graphic.attributes) && graphic.attributes.beneficiary_id === FindDeceasedName){ SelectedFindDeceasedName = graphic; SelectedFindDeceasedName.setSymbol(highlightSymbol); return; } }); var FindDeceasedNameExtent = SelectedFindDeceasedName.geometry; var factor = -200; var extent; extent = new esri.geometry.Extent({ "xmin": FindDeceasedNameExtent.x - factor, "ymin": FindDeceasedNameExtent.y - factor, "xmax": FindDeceasedNameExtent.x + factor, "ymax": FindDeceasedNameExtent.y + factor, "spatialReference": { "wkid": 3857} }); map.setExtent(extent); } function resizeMap() { //Handle browser resize clearTimeout(resizeTimer); resizeTimer = setTimeout(function() { map.resize(); map.reposition(); }, 800); } map.on("layers-add-result", function (evt) { var layerInfo = arrayUtils.map(evt.layers, function (layer, index) { return {layer:layer.layer, title:layer.layer.name}; }); if (layerInfo.length > 0) { var legendDijit = new Legend({ map: map, layerInfos: layerInfo }, "legendDiv"); legendDijit.startup(); } }); map.addLayers([waterbodies, rivers]); // map.addLayer(featureLayer); }); </script> </head> <body class="claro" oncontextmenu="return false"> <div class="title"> <div class="logo"> <a href="http://swachhts.cgg.gov.in/Login.do"><img src="http://elandts.cgg.gov.in:80/website/images/TSlogo.png" width="80" height="80" alt="logo"/> <h1> Swachh Bharat - Swachh Telangana <br><span>Commissioner & Director of Municipal Administration, Government of Telangana </span> </h1> </a> </div> <div class="logo"> <a href="http://swachhts.cgg.gov.in/Login.do"><img src="http://swachhts.cgg.gov.in:80/images/SBM-Logo.png" width="100" height="80" alt="logo"/> </a> </div> <div class="logo"> <a href="http://swachhts.cgg.gov.in/Login.do"><img src="http://swachhts.cgg.gov.in:80/images/swts_logo.png" width="100" height="80" alt="logo"/> </a> </div> <div class="cm"> <div class="pull-right"> <img src="http://elandts.cgg.gov.in:80/website/images/cm.png" style="" class="img-responsive" alt="cm" width="50"/> <br> <h2> Sri K.Chandrasekhar Rao <br> <span> Hon'ble Chief Minister of Telangana</span> </h2> </div> </div> <br clear="all"> </div> <div id="main" style="width:2024px; height:800px; border:1px solid #000;" dojotype="dijit.layout.BorderContainer" design="headline" gutters="true"> <div id="header" dojotype="dijit.layout.ContentPane" region="left" style="height:25px;"> <select id="mySelect" dojotype="dijit.form.ComboBox" style="width:200px;font-size:18px;" autoComplete="true" forceValidOption="false" value="Select a District"></select> <BR> <BR> <select id="mySelect1" dojotype="dijit.form.ComboBox" style="width:200px;font-size:18px;" autoComplete="true" forceValidOption="false" value="Select a Town"></select> <BR> <BR> <button data-dojo-type="dijit.form.Button" onClick="veTileLayer.setMapStyle(esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL);">Aerial</button> <button data-dojo-type="dijit.form.Button" onClick="veTileLayer.setMapStyle(esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL_WITH_LABELS)">Aerial with labels</button><BR> <BR>  <div id="content" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:true" style="width: 100%; height: 50%; margin: 0;"> <div id="rightPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'right'"> <div data-dojo-type="dijit/layout/AccordionContainer"> <div data-dojo-type="dijit/layout/ContentPane" id="legendPane" data-dojo-props="title:'Legend', selected:true"> <div id="legendDiv"></div> </div> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="title:'Pane 2'"> This pane could contain tools or additional content </div> </div> </div> </div> </div> <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="border:1px solid #000;margin:5px"> </div> </div> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'" style="height:150px;"> <table data-dojo-type="dojox/grid/DataGrid" data-dojo-id="grid" id="grid" data-dojo-props="rowsPerPage:'6', rowSelector:'10px'"> <thead> <tr> <th field="beneficiary_id" width="25%">BENEFICIARY ID</th> <th field="applicant_name" width="25%">APPLICANT NAME</th> <th field="fathername" width="25%">FATHERS NAME</th> <th field="aadhar_number" width="25%">AADHAR NO </th> <th field="stage" width="25%">STAGE</th> <th field="caste" width="25%">CASTE</th> </tr> </thead> </table> </div> </div> <div style="position:relative;"> </div> </body> </html>

‎07-07-2015

Hi , i am trying to create a unique render . How can i define the values as. 0-10000 10000-20000 instead of i have used rendering sample of javascript api for this . Thanks, satya

‎06-30-2015

Hi Ricky, Solved the Issue. Thanks for your help. Regds, satya

‎06-30-2015

Robert, here is the table with complete URL.

‎06-30-2015

Hi, i am trying to display photos from url . i am getting the following pop up. how can i get a full image. var template = new PopupTemplate({ title: "SWACHH TELANGANA APPLICANTS <BR>", description: "<BR>BENEFICIARY ID: {beneficiary_id} <br> <br>BENEFICIARY NAME: {applicant_name} <br><br>FATHERS NAME: {fathername}<br><br> ADDRESS: {address} <br><br> CASTE: {caste} <br> <br> MOBILE: {mobile} <br><br> AADHAR NO:: {aadhar_number}<br><br> COMMUNICATION STATUS: {comm_status} <br><br> PHOTO: <img src={applicant_photo}/> <br><br> SITE PHOTO : <img src={applicant_site_photo_path}/><br><br> STAGE : {stage}<br>", });

‎06-26-2015

Hi Robert, dojo.forEach(map.graphics.graphics,function(graphic){ //deselect all graphics first graphic.setSymbol(symbol321); if((graphic.attributes) && graphic.attributes.FID === FindDeceasedName){ SelectedFindDeceasedName = graphic; //Apply the highlight symbol to only the one that matches SelectedFindDeceasedName.setSymbol(highlightSymbol); return; } }); Thanks, Satya.

‎06-26-2015

Hi, this is my code initially set the symbol symbol321 = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_SQUARE, 0.1, null, new Color([255, 255, 0, 0.5])); function onRowClickHandler(evt){ var FindDeceasedName = grid.getItem(evt.rowIndex).FID; var SelectedFindDeceasedName; dojo.forEach(map.graphics.graphics,function(graphic){ if((graphic.attributes) && graphic.attributes.FID === FindDeceasedName){ SelectedFindDeceasedName = graphic; SelectedFindDeceasedName.setSymbol(symbol321); return; } }); var FindDeceasedNameExtent = SelectedFindDeceasedName.geometry; SelectedFindDeceasedName.setSymbol(highlightSymbol); var factor = 0.1; var extent; extent = new esri.geometry.Extent({ "xmin": FindDeceasedNameExtent.x - factor, "ymin": FindDeceasedNameExtent.y - factor, "xmax": FindDeceasedNameExtent.x + factor, "ymax": FindDeceasedNameExtent.y + factor, "spatialReference": { "wkid": 3857} }); map.setExtent(extent); } still previously highlighted is not cleared. Regds, Satya

‎06-25-2015

hi all, i have highlighted a point based on selection using SelectedFindDeceasedName.setSymbol(highlightSymbol); how can u dehighlight the same before highlighting the other point feature thanks, satya

‎06-25-2015

Thank u Robert But to zoom to the feature not working getting the following error TypeError: a is null ...his._layers},setExtent:function(a,c){a=new I(a.toJson());var b=a.getWidth(),d... Regds, Satya

‎06-22-2015

hi, i could not make it out. can u provide me the solution. regds, satyanarayana N

‎06-22-2015

Hi ALL, i am trying to implement the same with some drill down functionality. when i zoom to village level the point features should be highlighted, displaying their attributes in a table as in this example. i am getting the values from the layers but not filling in the table. -------- console.log(values3); where am i going wrong, here is the code //Populate the dropdown list box with unique values var FID; var values3 = []; var item123 = []; var testVals3={}; //Add option to display all zoning types to the dropdown list values3.push({name:""}) var features3 = results3.features; dojo.forEach (features3, function(feature3) { FID = feature3.attributes.FID; if (!testVals3[FID]) { testVals3[FID] = true; //values3.push({name:ben_id,shape:feature3.geometry,centroid: feature3.geometry.type === "point" ? feature3.geometry : feature3.geometry.getCentroid()}); // RIYAS: set shape to list store values3.push(feature3.attributes); /*values3.push({"ben_id":ben_id, "ben_name": feature3.attributes.ben_name, "dname": feature3.attributes.dname, "father_nam": feature3.attributes.father_nam, "mname": feature3.attributes.mname, "scheme_nam": feature3.attributes.scheme_nam, "uid": feature3.attributes.uid, "vname": feature3.attributes.vname, */ } }); var dataItems3 = { identifier: 'FID', label: 'FID', items: item123 }; console.log(values3); var store3 = new ItemFileReadStore({data:dataItems3}); var grid = registry.byId("grid"); grid.setStore(store3); grid.on("rowclick", onRowClickHandler); map.centerAndZoom(center, zoom); //remove all graphics on the maps graphics layer //map.graphics.clear(); //Performance enhancer - assign featureSet array to a single variable. var resultFeatures3 = results3.features; //Loop through each feature returned for (var i = 0, il = resultFeatures3.length; i < il; i++) { //Get the current feature from the featureSet. //Feature is a graphic var graphic3 = resultFeatures3; graphic3.setSymbol(symbol1); //Set the infoTemplate. graphic3.setInfoTemplate(infoTemplate3); //Add graphic to the map graphics layer. map.graphics.add(graphic3); // This takes the graphics array you get back from your query and // gets the overall extent for them. Make sure return geometry is set to // true in your query. var extent2 = esri.graphicsExtent(results3.features); // Use that to set the extent, 1.5 is something I use in my app, but play with // it to find a setting you like, setting the second parameter to true will get you an extend // that is at the closest level of your cached service. map.setExtent(extent2.expand(1.0), true); } } function onRowClickHandler(evt) { var clickedTaxLotId = evt.grid.getItem(evt.rowIndex).FID; var selectedTaxLot = arrayUtils.filter(map.graphics.graphics, function (graphic) { return ((graphic.attributes) && graphic.attributes.FID === clickedTaxLotId); }); if ( selectedTaxLot.length ) { map.setExtent(selectedTaxLot[0].geometry.getExtent(), true); } } Thanks, satya

‎06-22-2015

Hi Robert, i am trying to implement the same with some drill down functionality. when i zoom to village level the point features should be highlighted, displaying their attributes in a table as in this example. i am getting the values from the layers but not filling in the table. where am i going wrong, here is the code <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title>AP Housing Application</title> <link rel="stylesheet" href="http://js.arcgis.com/3.10/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/dojox/grid/resources/Grid.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/dojox/grid/resources/claroGrid.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.10/js/esri/css/esri.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css"> <style type="text/css">body,html,#main{margin:0;padding:0;height:100%;width:100%;}</style> <script src="http://js.arcgis.com/3.13/"></script> <script>dojoConfig = { parseOnLoad: true };</script> <style> html, body, #map { padding: 0; margin: 0; height: 100%; } /* Change color of icons to match bar chart and selection symbol */ .esriPopup.dark div.titleButton, .esriPopup.dark div.titlePane .title, .esriPopup.dark div.actionsPane .action { color: #000000; font-weight: bold; } /* Additional customizations */ .esriPopup.dark .esriPopupWrapper { border: none; } .esriPopup .contentPane { text-align: left; } .esriViewPopup .gallery { margin: 0 auto; } .title { padding:10px; background:#fafafa; } .title .logo img { float:left; margin-right:10px; } .title .logo h1{ color: #C9584F; padding: 0px; font-size: 30px; font-weight: bold; float:left; font-family:Arial, Helvetica, sans-serif; margin:0px; } .title .logo h1>span{ color: #111; padding: 0px; font-size: 20px; font-weight: bold; } .title .cm { float:right; text-align:center; color: #C9584F; font-size:15px; } .title .cm h2{ color: #C9584F; font-size:15px; font-family:Arial, Helvetica, sans-serif } </style> <script> var map; var veTileLayer; var findTask, findParams; var center, zoom; var grid, store, store3; var county; var resizeTimer; require([ "esri/map", "esri/tasks/query", "dojo/parser", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "esri/tasks/IdentifyTask", "esri/tasks/IdentifyParameters", "dojo/_base/array","dojo/DeferredList", "dijit/form/ComboBox", "dojo/data/ItemFileReadStore","dojo/store/Memory", "esri/virtualearth/VETiledLayer", "dijit/form/Button", "esri/tasks/FindTask", "esri/tasks/FindParameters", "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "dijit/registry", "dojo/_base/connect", "dojox/grid/DataGrid", "esri/dijit/Popup", "esri/dijit/PopupTemplate", "esri/layers/FeatureLayer", "esri/symbols/SimpleFillSymbol", "esri/Color", "dojo/dom-class", "dojo/dom-construct", "dojox/charting/Chart", "dojox/charting/themes/Dollar", "dojo/on", "dojo/domReady!"], function(Map, query, parser, BorderContainer, ContentPane, IdentifyTask, IdentifyParameters,arrayUtils,DeferredList, ComboBox, ItemFileReadStore, Memory, VETiledLayer, Button, FindTask, FindParameters, SimpleMarkerSymbol, SimpleLineSymbol, registry, connect, DataGrid, Popup, PopupTemplate, FeatureLayer, SimpleFillSymbol, Color, domClass, domConstruct, Chart, theme, on, Scalebar) { parser.parse(); /* map = new Map("map"); function init() { //Creates the Virtual Earth layer to add to the map //Example for adding a Bing Maps key // bingMapsKey: "1B2C3OlkbxWHYa1b2c3qkPrO_Ou3nRrGtSa_5Op-xvPNya1b2c3", veTileLayer = new esri.virtualearth.VETiledLayer({ bingMapsKey:'Ame5R45lEOTdPXxlhxuAXN2sDT8vyEJcgXGeZpPOPHBLbg2XqkPMaL5OJHp0OlV0', mapStyle: esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL }); map.addLayer(veTileLayer); infoWindow: popup } dojo.ready(init);*/ var fill = new SimpleFillSymbol("solid", null, new Color("#A4CE67")); var popup = new Popup({ fillSymbol: fill, titleInBody: false }, domConstruct.create("div")); //Add the dark theme which is customized further in the <style> tag at the top of this page domClass.add(popup.domNode, "dark"); map = new Map("map", { basemap: "satellite", /*center: [-122.45, 37.75], // longitude, latitude */ center : [79.2, 18.10], zoom: 6, infoWindow: popup }); var template = new PopupTemplate({ title: "AP HOUSING APPLICANTS <BR>", description: "<BR> BENEFICIARY ID: {ben_id} <br> <br>BENEFICIARY NAME: {ben_name} <br><br>FATHER'S NAME: {father_nam}<br><br>AADHAR ID : {uid} <br><br> SCHEME NAME: {scheme_nam} <br><br>LATITUDE: {lat} <br><br> LONGITUDE: {lon} <br>", }); var featureLayer = new FeatureLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer/0",{ mode: FeatureLayer.MODE_ONDEMAND, outFields: ["*"], infoTemplate: template }); veTileLayer = new VETiledLayer({ bingMapsKey:'Ame5R45lEOTdPXxlhxuAXN2sDT8vyEJcgXGeZpPOPHBLbg2XqkPMaL5OJHp0OlV0', mapStyle: esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL }); map.addLayer(veTileLayer); map.addLayer(featureLayer); var polygonQuery = null; var polygonQueryTask = null; var polygonQuery1 = null; var polygonQueryTask1 = null; var polygonQuery2 = null; var polygonQueryTask2 = null; var polygonQuery3 = null; var polygonQueryTask3 = null; // RIYAS: Wait till map is loaded before firing query, needed for getting map spatial reference map.on("load", function () { var queryTask = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer/1"); // var queryTask1 = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/sample/pattasample/MapServer/2"); //Define query parameters var query = new esri.tasks.Query(); query.outFields = ["dname"]; query.returnGeometry = true; query.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query.where = "dname <> ''" queryTask.execute(query,populateList); //Define query parameters /*var query1 = new esri.tasks.Query(); query1.outFields = ["dname", "mname"]; query1.returnGeometry = true; query1.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query1.where = "mname<> ''" queryTask1.execute(query1,populateList1);*/ // RIYAS: Setup query to behave as identify polygonQueryTask = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer/1"); polygonQuery = new esri.tasks.Query(); polygonQuery.returnGeometry = true; polygonQuery.outFields = ["dname"]; polygonQuery.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS; polygonQuery.outSpatialReference = map.spatialReference; // RIYAS: Setup query to behave as identify polygonQueryTask1 = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer/2"); polygonQuery1 = new esri.tasks.Query(); polygonQuery1.returnGeometry = true; polygonQuery1.outFields = ["dname", "mname"]; polygonQuery1.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS; polygonQuery1.outSpatialReference = map.spatialReference; // RIYAS: Setup query to behave as identify polygonQueryTask2 = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer/3"); polygonQuery2 = new esri.tasks.Query(); polygonQuery2.returnGeometry = true; polygonQuery2.outFields = ["dname", "mname", "vname"]; polygonQuery2.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS; polygonQuery2.outSpatialReference = map.spatialReference; polygonQueryTask3 = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer/0"); polygonQuery3 = new esri.tasks.Query(); polygonQuery3.returnGeometry = true; polygonQuery3.outFields = ["*"]; polygonQuery3.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS; polygonQuery3.outSpatialReference = map.spatialReference; }); var infoTemplate = new esri.InfoTemplate("District: ${dname}", "District : ${dname}<br/>"); var infoTemplate1 = new esri.InfoTemplate("DISTRICT: ${dname}", "District : ${dname}<br/> Mandal : ${mname}<br/> "); var infoTemplate2 = new esri.InfoTemplate("DISTRICT: ${dname}", "District : ${dname}<br/> Mandal : ${mname}<br/> Village : ${vname}<br/>"); var infoTemplate3 = new esri.InfoTemplate("DISTRICT: ${ben_id}", "BENEFICIARY : ${ben_id}<br/>BENEFICIARY name : ${ben_name}<br/>fathers name : ${father_nam}<br/> AADHAR : ${uid}<br/> scheme name : ${scheme_nam}<br/> District : ${dname}<br/> Mandal : ${mname}<br/> Village : ${vname}<br/>"); var infoTemplates = [infoTemplate, infoTemplate1,infoTemplate2,infoTemplate3]; //map.on("click", executeIdentifyTask); // RIYAS: Execute query to behave as identify function executeIdentifyTask (where, pnt) { //polygonQuery.where = event.mapPoint; //polygonQuery1.where = event.mapPoint; polygonQuery.where = where; polygonQuery1.where = where; polygonQuery2.where = where; polygonQuery3.where = where; var deferred = polygonQueryTask .execute(polygonQuery); var deferred1 = polygonQueryTask1 .execute(polygonQuery1); var deferred2 = polygonQueryTask2 .execute(polygonQuery2); var deferred3 = polygonQueryTask3 .execute(polygonQuery3); // InfoWindow expects an array of features from each deferred // object that you pass. If the response from the task execution // above is not an array of features, then you need to add a callback // like the one above to post-process the response and return an // array of features. var defList = new DeferredList([deferred, deferred1, deferred2, deferred3]).then(function (results){ var features = []; arrayUtils.forEach(results,function(result, idx){ if (result[0] === true){ features = features.concat(arrayUtils.map(result[1].features, function (feature) { feature.setInfoTemplate(infoTemplates[idx]); return feature; })); } }); map.infoWindow.setFeatures(features); map.infoWindow.show(pnt); }); } //var initialExtent = new esri.geometry.Extent(-85.915,38.105,-85.52,38.33, // new esri.SpatialReference({wkid:4326}) ); // map = new esri.Map("map", {extent:initialExtent}); //Create tiled and dynamic map services and add to the map - for the dynamic service set the transparency //and provide an id so we can access it later // map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer")); map.addLayer(new esri.layers.ArcGISDynamicMapServiceLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer", {"opacity":1,"id":"dynamic"})); function populateList(results) { //initialize InfoTemplate //create symbol for selected features symbol = new esri.symbol.SimpleMarkerSymbol(); symbol.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE); symbol.setSize(0.1); symbol.setColor(new dojo.Color([255, 255, 0, 0.5])); //Populate the dropdown list box with unique values // var county; var values = []; var testVals={}; //Add option to display all zoning types to the dropdown list values.push({name:""}) var features = results.features; dojo.forEach (features, function(feature) { county = feature.attributes.dname; if (!testVals[county]) { testVals[county] = true; values.push({name:county,shape:feature.geometry,centroid: feature.geometry.type === "point" ? feature.geometry : feature.geometry.getCentroid() }); // RIYAS: set shape to list store } }); var dataItems = { identifier: 'name', label: 'name', items: values }; var store = new dojo.store.Memory({data:dataItems}); dijit.byId("mySelect").store = store; //remove all graphics on the maps graphics layer map.graphics.clear(); //Performance enhancer - assign featureSet array to a single variable. var resultFeatures = results.features; //Loop through each feature returned for (var i = 0, il = resultFeatures.length; i < il; i++) { //Get the current feature from the featureSet. //Feature is a graphic var graphic = resultFeatures; graphic.setSymbol(symbol); //Set the infoTemplate. graphic.setInfoTemplate(infoTemplate); //Add graphic to the map graphics layer. map.graphics.add(graphic); // This takes the graphics array you get back from your query and // gets the overall extent for them. Make sure return geometry is set to // true in your query. var extent = esri.graphicsExtent(results.features); // Use that to set the extent, 1.5 is something I use in my app, but play with // it to find a setting you like, setting the second parameter to true will get you an extend // that is at the closest level of your cached service. map.setExtent(extent.expand(1.0), true); } } // this replaces your applyLayerDef() function dijit.byId("mySelect").on("change", function () { //Filter the layer to display only the selected zoning types var county = dijit.byId("mySelect").value; var centroid = dijit.byId("mySelect").item.centroid; if (county !== 'ALL') { var layerDefs = []; layerDefs[2] = "dname = " + "'" + county + "'"; layerDefs.visibleLayers = [2]; map.setExtent(dijit.byId("mySelect").item.shape.getExtent(infoTemplate).expand(1.7)); // RIYAS: Get shape from list store and zoom to its extent executeIdentifyTask("dname = '" + county + "'", centroid); // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setLayerDefinitions(layerDefs); } else { // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setDefaultLayerDefinitions(); } var queryTask1 = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer/2"); var query1 = new esri.tasks.Query(); query1.outFields = ["dname", "mname"]; query1.returnGeometry = true; query1.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query1.where = "mname<> '' and dname='"+dijit.byId("mySelect").value+"'" queryTask1.execute(query1,populateList1); }); function populateList1(results1) { //initialize InfoTemplate /* alert(dijit.byId("mySelect").value) var query1 = new esri.tasks.Query(); query1.outFields = ["dname", "mname"]; query1.returnGeometry = true; query1.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query1.where = "mname<> ''" queryTask1.execute(query1,populateList1); */ //create symbol for selected features symbol1 = new esri.symbol.SimpleMarkerSymbol(); symbol1.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE); symbol1.setSize(0.1); symbol1.setColor(new dojo.Color([255, 255, 0, 0.5])); //Populate the dropdown list box with unique values var city; var values1 = []; var testVals1={}; //Add option to display all zoning types to the dropdown list values1.push({name:""}) var features1 = results1.features; dojo.forEach (features1, function(feature1) { city = feature1.attributes.mname; if (!testVals1[city]) { testVals1[city] = true; values1.push({name:city,shape:feature1.geometry,centroid: feature1.geometry.type === "point" ? feature1.geometry : feature1.geometry.getCentroid()}); // RIYAS: set shape to list store } }); var dataItems1 = { identifier: 'name', label: 'name', items: values1 }; var store1 = new dojo.store.Memory({data:dataItems1}); dijit.byId("mySelect1").store = store1; //remove all graphics on the maps graphics layer map.graphics.clear(); //Performance enhancer - assign featureSet array to a single variable. var resultFeatures1 = results1.features; //Loop through each feature returned for (var i = 0, il = resultFeatures1.length; i < il; i++) { //Get the current feature from the featureSet. //Feature is a graphic var graphic1 = resultFeatures1; graphic1.setSymbol(symbol1); //Set the infoTemplate. graphic1.setInfoTemplate(infoTemplate1); //Add graphic to the map graphics layer. map.graphics.add(graphic1); // This takes the graphics array you get back from your query and // gets the overall extent for them. Make sure return geometry is set to // true in your query. var extent1 = esri.graphicsExtent(results1.features); // Use that to set the extent, 1.5 is something I use in my app, but play with // it to find a setting you like, setting the second parameter to true will get you an extend // that is at the closest level of your cached service. map.setExtent(extent1.expand(1.0), true); } } // this replaces your applyLayerDef() function dijit.byId("mySelect1").on("change", function () { //Filter the layer to display only the selected zoning types var city = dijit.byId("mySelect1").value; var centroid = dijit.byId("mySelect1").item.centroid; if (city !== 'ALL') { var layerDefs1 = []; layerDefs1[2] = "mname = " + "'" + city + "'"; layerDefs1.visibleLayers = [2]; map.setExtent(dijit.byId("mySelect1").item.shape.getExtent(infoTemplate1).expand(1.7)); // RIYAS: Get shape from list store and zoom to its extent executeIdentifyTask("mname = '" + city + "'", centroid); // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setLayerDefinitions(layerDefs); } else { // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setDefaultLayerDefinitions(); } var queryTask2 = new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer/3"); var query2= new esri.tasks.Query(); query2.outFields = ["dname", "mname","vname"]; query2.returnGeometry = true; query2.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query2.where = "vname<> '' and dname='"+dijit.byId("mySelect").value+"'and mname='"+dijit.byId("mySelect1").value+"'" //query1.where = "mname<> '' and dname='"+dijit.byId("mySelect").value+"'" queryTask2.execute(query2,populateList2); }); function populateList2(results2) { //initialize InfoTemplate /* alert(dijit.byId("mySelect").value) var query1 = new esri.tasks.Query(); query1.outFields = ["dname", "mname"]; query1.returnGeometry = true; query1.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query1.where = "mname<> ''" queryTask1.execute(query1,populateList1); */ //create symbol for selected features symbol1 = new esri.symbol.SimpleMarkerSymbol(); symbol1.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE); symbol1.setSize(0.1); symbol1.setColor(new dojo.Color([255, 255, 0, 0.5])); //Populate the dropdown list box with unique values var vill; var values2 = []; var testVals2={}; //Add option to display all zoning types to the dropdown list values2.push({name:""}) var features2 = results2.features; dojo.forEach (features2, function(feature2) { vill = feature2.attributes.vname; if (!testVals2[vill]) { testVals2[vill] = true; values2.push({name:vill,shape:feature2.geometry,centroid: feature2.geometry.type === "point" ? feature2.geometry : feature2.geometry.getCentroid()}); // RIYAS: set shape to list store } }); var dataItems2 = { identifier: 'name', label: 'name', items: values2 }; var store2 = new dojo.store.Memory({data:dataItems2}); dijit.byId("mySelect2").store = store2; //remove all graphics on the maps graphics layer map.graphics.clear(); //Performance enhancer - assign featureSet array to a single variable. var resultFeatures2 = results2.features; //Loop through each feature returned for (var i = 0, il = resultFeatures2.length; i < il; i++) { //Get the current feature from the featureSet. //Feature is a graphic var graphic2 = resultFeatures2; graphic2.setSymbol(symbol1); //Set the infoTemplate. graphic2.setInfoTemplate(infoTemplate2); //Add graphic to the map graphics layer. map.graphics.add(graphic2); // This takes the graphics array you get back from your query and // gets the overall extent for them. Make sure return geometry is set to // true in your query. var extent2 = esri.graphicsExtent(results2.features); // Use that to set the extent, 1.5 is something I use in my app, but play with // it to find a setting you like, setting the second parameter to true will get you an extend // that is at the closest level of your cached service. map.setExtent(extent2.expand(1.0), true); } } // this replaces your applyLayerDef() function dijit.byId("mySelect2").on("change", function () { //Filter the layer to display only the selected zoning types var vill = dijit.byId("mySelect2").value; var centroid = dijit.byId("mySelect2").item.centroid; if (vill !== 'ALL') { var layerDefs1 = []; layerDefs1[2] = "vname = " + "'" + vill + "'"; layerDefs1.visibleLayers = [2]; map.setExtent(dijit.byId("mySelect2").item.shape.getExtent(infoTemplate2).expand(1.7)); // RIYAS: Get shape from list store and zoom to its extent executeIdentifyTask("vname = '" + vill + "'", centroid); // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setLayerDefinitions(layerDefs); } else { // RIYAS: cannot set layer defintion for dynamic map service. //map.getLayer("dynamic").setDefaultLayerDefinitions(); } var queryTask3= new esri.tasks.QueryTask("http://gisserver.cgg.gov.in/arcgis/rest/services/HOUSING/SRIKHOUSAP/MapServer/0"); var query3= new esri.tasks.Query(); query3.returnGeometry = true; query3.outFields = ["*"]; query3.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query3.where = "dname='"+dijit.byId("mySelect").value+"'and mname='"+dijit.byId("mySelect1").value+"'and vname='"+dijit.byId("mySelect2").value+"'" //query1.where = "mname<> '' and dname='"+dijit.byId("mySelect").value+"'" queryTask3.execute(query3,populateList3); }); function populateList3(results3) { //initialize InfoTemplate /* alert(dijit.byId("mySelect").value) var query1 = new esri.tasks.Query(); query1.outFields = ["dname", "mname"]; query1.returnGeometry = true; query1.outSpatialReference = map.spatialReference; // RIYAS: Set query to return shape in map's spatial reference query1.where = "mname<> ''" queryTask1.execute(query1,populateList1); */ //create symbol for selected features map.graphics.clear(); symbol1 = new esri.symbol.SimpleMarkerSymbol(); symbol1.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE); symbol1.setSize(1); symbol1.setColor(new dojo.Color([255, 255, 0, 0.5])); var items123 = arrayUtils.map(results3.features, function (result3) { var graphic = result3; graphic.setSymbol(symbol); map.graphics.add(graphic); return result3.attributes; }); //Populate the dropdown list box with unique values var FID; var values3 = []; var item123 = []; var testVals3={}; //Add option to display all zoning types to the dropdown list values3.push({name:""}) var features3 = results3.features; dojo.forEach (features3, function(feature3) { FID = feature3.attributes.FID; if (!testVals3[FID]) { testVals3[FID] = true; //values3.push({name:ben_id,shape:feature3.geometry,centroid: feature3.geometry.type === "point" ? feature3.geometry : feature3.geometry.getCentroid()}); // RIYAS: set shape to list store values3.push(feature3.attributes); /*values3.push({"ben_id":ben_id, "ben_name": feature3.attributes.ben_name, "dname": feature3.attributes.dname, "father_nam": feature3.attributes.father_nam, "mname": feature3.attributes.mname, "scheme_nam": feature3.attributes.scheme_nam, "uid": feature3.attributes.uid, "vname": feature3.attributes.vname, */ } }); var dataItems3 = { identifier: 'FID', label: 'FID', items: item123 }; console.log(values3); var store3 = new ItemFileReadStore({data:dataItems3}); var grid = registry.byId("grid"); grid.setStore(store3); grid.on("rowclick", onRowClickHandler); map.centerAndZoom(center, zoom); //remove all graphics on the maps graphics layer //map.graphics.clear(); //Performance enhancer - assign featureSet array to a single variable. var resultFeatures3 = results3.features; //Loop through each feature returned for (var i = 0, il = resultFeatures3.length; i < il; i++) { //Get the current feature from the featureSet. //Feature is a graphic var graphic3 = resultFeatures3; graphic3.setSymbol(symbol1); //Set the infoTemplate. graphic3.setInfoTemplate(infoTemplate3); //Add graphic to the map graphics layer. map.graphics.add(graphic3); // This takes the graphics array you get back from your query and // gets the overall extent for them. Make sure return geometry is set to // true in your query. var extent2 = esri.graphicsExtent(results3.features); // Use that to set the extent, 1.5 is something I use in my app, but play with // it to find a setting you like, setting the second parameter to true will get you an extend // that is at the closest level of your cached service. map.setExtent(extent2.expand(1.0), true); } } function onRowClickHandler(evt) { var clickedTaxLotId = evt.grid.getItem(evt.rowIndex).FID; var selectedTaxLot = arrayUtils.filter(map.graphics.graphics, function (graphic) { return ((graphic.attributes) && graphic.attributes.FID === clickedTaxLotId); }); if ( selectedTaxLot.length ) { map.setExtent(selectedTaxLot[0].geometry.getExtent(), true); } } function resizeMap() { //Handle browser resize clearTimeout(resizeTimer); resizeTimer = setTimeout(function() { map.resize(); map.reposition(); }, 800); } }); </script> </head> <body class="claro" oncontextmenu="return false">  <div id="main" style="width:2024px; height:1012px; border:1px solid #000;" dojotype="dijit.layout.BorderContainer" design="headline" gutters="true"> <div id="header" dojotype="dijit.layout.ContentPane" region="left" style="height:25px;"> <select id="mySelect" dojotype="dijit.form.ComboBox" style="width:300px;font-size:18px;" autoComplete="true" forceValidOption="false" value="Select a District"></select> <BR> <BR> <select id="mySelect1" dojotype="dijit.form.ComboBox" style="width:300px;font-size:18px;" autoComplete="true" forceValidOption="false" value="Select a Mandal"></select> <BR> <BR> <select id="mySelect2" dojotype="dijit.form.ComboBox" style="width:300px;font-size:18px;" autoComplete="true" forceValidOption="false" value="Select a Village"></select> <BR> <BR> <button data-dojo-type="dijit.form.Button" onClick="veTileLayer.setMapStyle(esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL);">Aerial</button> <button data-dojo-type="dijit.form.Button" onClick="veTileLayer.setMapStyle(esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL_WITH_LABELS)">Aerial with labels</button> <button data-dojo-type="dijit.form.Button" onClick="veTileLayer.setMapStyle(esri.virtualearth.VETiledLayer.MAP_STYLE_ROAD)">Roads</button> </div> <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="border:1px solid #000;margin:5px"> </div> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'" style="height:150px;"> <table data-dojo-type="dojox/grid/DataGrid" data-dojo-id="grid" id="grid" data-dojo-props="rowsPerPage:'11', rowSelector:'20px'"> <thead> <tr> <th field="FID"width="30%">FID</th> <th field="ben_id"width="30%">BENEFICIARY ID</th> <th field="ben_name"width="30%" >BENEFICIARY NAME</th> <th field="father_nam" width="30%">FATHERS NAME</th> <th field="uid" width="30%">AADHAR NO </th> <th field="scheme_nam" width="30%">SCHEME NAME</th> <th field="lat" width="30%">LATITUDE</th> <th field="long" width="30%">LONGITUDE</th> <th field="dname" width="30%">DISTRICT</th> <th field="mname" width="30%">MANDAL </th> <th field="vname" width="30%">VILLAGE</th> </tr> </thead> </table> </div> </div> <div style="position:relative;"> </div> </body> </html> thanks satya

‎06-09-2015

Hi Jake, Thanks, Got it Instead of disabling the other polygon's of layer, we can just highlight the selected content and displaying others right?

‎06-08-2015

Hi Jake, here is my code. let me know where i am wrong. <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>Zoom to Combo Box Selection</title> <link rel="stylesheet" href="http://js.arcgis.com/3.13/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; } </style> <script src="http://js.arcgis.com/3.13/"></script> <script> var map; require([ "esri/map", "esri/layers/FeatureLayer", "esri/graphicsUtils", "esri/symbols/SimpleLineSymbol", "esri/graphic", "esri/geometry/webMercatorUtils", "esri/symbols/SimpleFillSymbol", "esri/Color", "dojo/on", "esri/tasks/query", "dojo/dom", "dijit/registry", "dojo/_base/array", "dojo/parser", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/form/ComboBox", "dojo/domReady!" ], function( Map, FeatureLayer, graphicsUtils, SimpleLineSymbol, Graphic, webMercatorUtils, SimpleFillSymbol, Color, on, Query, dom, registry, arrayUtils, parser) { parser.parse(); map = new esri.Map("map", { basemap : "satellite", center : [79, 19], zoom : 7 }); var stateLayer = new FeatureLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/sample/patta1/MapServer/1",{ mode: FeatureLayer.MODE_ONDEMAND, outFields: ["*"] }); var countyLayer = new FeatureLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/sample/patta1/MapServer/2",{ mode: FeatureLayer.MODE_ONDEMAND, outFields: ["*"] }); map.addLayer(stateLayer); map.addLayer(countyLayer); var polygonHighlightSymbol = new SimpleFillSymbol( SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol( SimpleLineSymbol.STYLE_SOLID, new Color([255, 0, 0]), 1), new Color([125, 125, 125, 0.35]) ); //Query State var query = new Query(); query.where = "1=1"; stateLayer.queryFeatures(query, function(featureSet) { var stateList = []; dojo.map(featureSet.features, function(feature) { stateList.push(feature.attributes.dname); }); arrayUtils.forEach(stateList, function(feature){ registry.byId("stateName").get('store').add({ name: feature}); }) }); registry.byId("countyName").set('disabled', true); registry.byId("stateName").on("change", function(){ map.graphics.clear(); registry.byId("countyName").set('disabled', false); var query = new Query(); query.where = "dname='" + registry.byId("stateName").get('value') + "'"; console.info(query.where); query.returnGeometry = true; stateLayer.queryFeatures(query, function (featureSet) { var Geom = featureSet.features[0].geometry; var gra = new Graphic(Geom); var extent = webMercatorUtils.geographicToWebMercator(gra.geometry); gra.setSymbol(polygonHighlightSymbol); map.graphics.add(gra); map.setExtent(extent.getExtent()); }); //Query County var query = new Query(); query.where = "dname='" + registry.byId("stateName").get('value') + "'"; countyLayer.queryFeatures(query, function(featureSet) { var countyList = []; dojo.map(featureSet.features, function(feature) { countyList.push(feature.attributes.mname); }); arrayUtils.forEach(countyList, function(feature){ registry.byId("countyName").get('store').add({ name: feature}); }) }); }); registry.byId("countyName").on("change", function(){ map.graphics.clear(); var query = new Query(); query.where = "dname='" + registry.byId("stateName").get('value') + "' AND mname='" + registry.byId("countyName").get('value') + "'"; console.info(query.where); query.returnGeometry = true; countyLayer.queryFeatures(query, function(featureSet){ var Geom = featureSet.features[0].geometry; var gra = new Graphic(Geom); var extent = webMercatorUtils.geographicToWebMercator(gra.geometry); gra.setSymbol(polygonHighlightSymbol); map.graphics.add(gra); map.setExtent(extent.getExtent()); }) }) }); </script> </head> <body class="claro"> <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline'" style="width:100%;height:100%;margin:0;"> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'" style="height:40px;"> State name:  <select id="stateName" data-dojo-type="dijit.form.ComboBox" style="width:200px;font-size:16px;" value="Select a State"></select> County name: <select id="countyName" data-dojo-type="dijit.form.ComboBox" style="width:200px;font-size:16px;" value="Select a County"></select> </div> <div id="map" data-dojo-props="region:'center'" data-dojo-type="dijit/layout/ContentPane" style="border:1px solid #000;"></div> </div> </body> </html>

‎06-08-2015

Hi Jake,Jake Skinner the code u sent is working fine with the base map such as imagery or topo. But when i add feature layers, and select the state its not displaying anything.

Online Status	Offline
Date Last Visited	‎12-19-2023 07:25 AM

My Ideas

Latest Contributions by SatyanarayanaNarmala

Re: Map with a single feature layer won't display a legend

Define values for unique rendering

Re: POP UP PHOTOS

Re: POP UP PHOTOS

POP UP PHOTOS

Re: Dehighlighting a highlighted feature

Re: Dehighlighting a highlighted feature

Dehighlighting a highlighted feature

Re: Display Query Task results in Dojo DataGrid

Re: Display Query Task results in Dojo DataGrid

Display Query Task results in Dojo DataGrid

Re: Need to change find task to query task in DataGrid

Re: Drop down list

Re: Drop down list

Re: Drop down list

Re: Assign attributes

POP UP PHOTOS

Re: Congratulations to the winners of the first 20...

ArcGIS Server with JavaScript API

Esri Forestry Group (EFG)