HI everyone,
I don't know how to center the result of a findind task in my map, the aim is to select a State (being highlighted on the map) and then zoom and center into the selected State, but only is selected and zoomed in the middle. Anyone could help me? thanks in advance.
Part of the code is this:
//create find task with url to map service
findTask = new esri.tasks.FindTask("http://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer");
//create find parameters and define known values
findParams = new esri.tasks.FindParameters();
findParams.returnGeometry = true;
findParams.layerIds = [2];
findParams.searchFields = ["state_name"];
}
function execute(searchText) {
//set the search text to find parameters
findParams.searchText = searchText;
findTask.execute(findParams, showResults);
}
function showResults(results) {
//symbology for graphics
var markerSymbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255, 0, 0]), 1), new dojo.Color([0, 255, 0, 0.25]));
var lineSymbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASH, new dojo.Color([255, 0, 0]), 1);
var polygonSymbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NONE, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255, 0, 0]), 2), new dojo.Color([255, 255, 0, 0.25]));
//find results return an array of findResult.
map.graphics.clear();
var dataForGrid = [];
//Build an array of attribute information and add each found graphic to the map
dojo.forEach(results, function(result) {
var graphic = result.feature;
dataForGrid.push([result.layerName, result.foundFieldName, result.value]);
switch (graphic.geometry.type) {
case "point":
graphic.setSymbol(markerSymbol);
break;
case "polyline":
graphic.setSymbol(lineSymbol);
break;
case "polygon":
graphic.setSymbol(polygonSymbol);
break;
}
map.graphics.add(graphic);
map.centerAndZoom(??????, 12); //Here is the problem.
Solved! Go to Solution.
Hi Eduardo,
Have a look at this example I created - States - Find Task
There are a number of options for zooming the map to the State - the best one is option 3 as it will fit the extent to the map:
function showResults(results) { var polygonSymbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NONE, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255, 0, 0]), 2), new dojo.Color([255, 255, 0, 0.25])); //find results return an array of findResult. map.graphics.clear(); var dataForGrid = []; dojo.forEach(results, function(result) { var graphic = result.feature; dataForGrid.push([result.layerName, result.foundFieldName, result.value]); graphic.setSymbol(polygonSymbol); map.graphics.add(graphic); var zoomToPt = graphic.geometry.getCentroid(); // Option 1: This zooms to a fixed zoom level that may not be appropriate for some states //map.centerAndZoom(zoomToPt, 12); // Option 2: This keeps the zoom level and pans to the zoom point //map.centerAt(zoomToPt); // Option 3: This sets the map extent to the feature extent map.setExtent(graphic.geometry.getExtent(),true); }); }
As you know that the result of the find task is a polygon (State boundary) then you can use the getCentroid() method to get your target point.
Alternatively, you may want to look at polygon.getExtent() to get the feature extent and then use getCentroid() on the extent. This will work better for multipart features - such as Hawaii.
Thank you,
I am not an expert programming, I've tried many things but I don't get it. Always the same result, the boundary is highlighted but without being zoomed and centered.I am writing a bad code surely.
Hi Eduardo,
Have a look at this example I created - States - Find Task
There are a number of options for zooming the map to the State - the best one is option 3 as it will fit the extent to the map:
function showResults(results) { var polygonSymbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NONE, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255, 0, 0]), 2), new dojo.Color([255, 255, 0, 0.25])); //find results return an array of findResult. map.graphics.clear(); var dataForGrid = []; dojo.forEach(results, function(result) { var graphic = result.feature; dataForGrid.push([result.layerName, result.foundFieldName, result.value]); graphic.setSymbol(polygonSymbol); map.graphics.add(graphic); var zoomToPt = graphic.geometry.getCentroid(); // Option 1: This zooms to a fixed zoom level that may not be appropriate for some states //map.centerAndZoom(zoomToPt, 12); // Option 2: This keeps the zoom level and pans to the zoom point //map.centerAt(zoomToPt); // Option 3: This sets the map extent to the feature extent map.setExtent(graphic.geometry.getExtent(),true); }); }
Many many thanks. I had done it using zoom and center but getExtent is much better!!.
Just wanted to throw it out there that I recently posted a way to let you zoom to anything.
Many thanks, problem solved!!.