I have dojo combo box to display district names when I select one district it should zoom to that particular district.selection
is working fine but zooming not happening I am getting Districtna.getExtent().expand(2)
is null.
Can any one tell me why I am not getting geometry of selected district.
Below the code I am using to zoom the selected district :
<!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="https://js.arcgis.com/3.16/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.16/esri/css/esri.css">
<style>
html, body, #map {
padding:0;
margin:0;
height:100%;
}
#HomeButton {
position: absolute;
top: 95px;
left: 20px;
z-index: 50;
}
#search {
display: block;
position: absolute;
z-index: 2;
top: 20px;
left: 74px;
}
</style>
<script src="https://js.arcgis.com/3.16/"></script>
<script>
var map;
require([
"esri/map", "esri/dijit/BasemapGallery","esri/dijit/HomeButton","esri/dijit/Search",
"esri/layers/ArcGISDynamicMapServiceLayer","esri/layers/FeatureLayer", "dojo/parser","esri/dijit/Attribution",
"dijit/form/ComboBox", "dojo/data/ItemFileReadStore", "dojo/_base/array", "dijit/registry", "esri/tasks/query",
"dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/TitlePane",
"dojo/domReady!"
], function(
Map, BasemapGallery,HomeButton,Search,ArcGISDynamicMapServiceLayer,FeatureLayer,
parser,Attribution, ComboBox, ItemFileReadStore, array, registry,Query
) {
parser.parse();
map = new Map("map", {
basemap: "topo",
center: [77.2, 14],
zoom: 7
});
var operationalLayer = new ArcGISDynamicMapServiceLayer("http://117.247.176.60:6080/arcgis/rest/services/BC_SH/BC_SH/MapServer");
var school = new FeatureLayer("http://117.247.176.60:6080/arcgis/rest/services/BC_SH/BC_SH/MapServer/0", {
mode: FeatureLayer.MODE_SELECTION,
outFields: ["*"]
});
map.addLayers([operationalLayer,school]);
var search = new Search({
map: map
}, "search");
search.startup();
var home = new HomeButton({
map: map
}, "HomeButton");
home.startup();
//add the basemap gallery, in this case we'll display maps from ArcGIS.com including bing maps
var basemapGallery = new BasemapGallery({
showArcGISBasemaps: true,
map: map
}, "basemapGallery");
basemapGallery.on('load',function(){
basemapGallery.remove('basemap_0');
basemapGallery.remove('basemap_1'); //remove unwanted base map from base map gallery
basemapGallery.remove('basemap_2');
basemapGallery.remove('basemap_3');
basemapGallery.remove('basemap_4');
basemapGallery.remove('basemap_5');
basemapGallery.remove('basemap_8');
});
basemapGallery.startup();
basemapGallery.on("error", function(msg) {
console.log("basemap gallery error: ", msg);
});
var populateList = function(results) {
//Populate the ComboBox with unique values
var zone;
var values = [];
var testVals = {};
values.push({
name: "ALL"
})
//Loop through the QueryTask results and populate an array
//with the unique values
var features = results.features;
array.forEach(features, function(feature) {
zone = feature.attributes.DistrictName;
if (zone) {
if (!testVals[zone]) {
testVals[zone] = true;
values.push({
name: zone
});
}
}
});
//Create a ItemFileReadStore and use it for the
//ComboBox's data source
var dataItems = {
identifier: 'name',
label: 'name',
items: values
};
var store = new ItemFileReadStore({
data: dataItems
});
registry.byId("mySelect").set('store', store);
}
queryTask = new esri.tasks.QueryTask("http://117.247.176.60:6080/arcgis/rest/services/BC_SH/BC_SH/MapServer/0");
var query = new esri.tasks.Query();
query.returnGeometry = false;
query.outFields = ["DistrictName"];
query.where = "DistrictName<> ''";
queryTask.execute(query, populateList);
app = {
zoomRow: function(id){
var districtname=id.toString();
alert(districtname);
// school.clearSelection();
var query = new Query();
query.where = "DistrictName='" + districtname + "'";
query.outFields = ["DistrictName"];
query.returnGeometry = true;
school.selectFeatures(query, FeatureLayer.SELECTION_NEW, function (features) {
var Districtna = features[0].geometry;
var theExtent = Districtna.getExtent().expand(2);
map.setExtent(theExtent);
});
}
};
});
</script>
</head>
<body class="claro">
<div id="search"></div>
<div id="map"
data-dojo-type="dijit/layout/ContentPane"
data-dojo-props="region:'center'"
style="padding:0;">
<div style="position:absolute; right:10px; top:10px; z-Index:999;">
<div data-dojo-type="dijit/TitlePane"
data-dojo-props="title:'Switch Basemap', closable:false, open:false">
<div data-dojo-type="dijit/layout/ContentPane" style="width:200px; height:280px; overflow:auto;">
<div id="basemapGallery"></div>
</div>
</div>
</div>
<div style="position:absolute; right:250px; top:10px; z-Index:999;" value="Select District" id="mySelect" data-dojo-type="dijit.form.ComboBox" onchange="app.zoomRow(document.getElementById('mySelect').value);"/>
<div id="HomeButton"></div>
</div>
</body>
</html>