Looking for a sample for Search and zoom to together.

Question

Hello,

I'm working on my school project however javascript api is not easy so far,

so, I've created a map that has search function but now I need out of that result wanted to add "zoom to" button.

I used http://help.arcgis.com/en/webapi/javascript/arcgis/jssamples/find_nomap.html
this as search but couldn't add "zoom to" with it.

http://help.arcgis.com/en/webapi/javascript/arcgis/jssamples/fl_zoomgrid.html
this sample has zoom to button but it was not easy to put these together.

Is there any samples or ways to do that?

Thank you for your time.

Jack

ShaunWeston · Answer

Oh sorry actually in that sample there is no basemap, so this won't work map.centerAndZoom(pt,12);

You'll need to add a basemap under the dynamic layer like this one:

http://help.arcgis.com/en/webapi/javascript/arcgis/jssamples/map_topo.html

GyeyoungChoi · Answer

You will probably have to string a couple of functions together, which isn't too hard to do once you know what you are doing.

e.g. This example here - http://developers.arcgis.com/en/javascript/samples/find_map/

So that's finding a feature and returning the geometry, after that you just need to get that geometry and zoom to it.

So in the code, note the bits I've added in

//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;
          }          
         // Get the geometry          
         var pt = graphic.geometry;          
         // Center the map at the point and zoom to scale level 12
        map.centerAndZoom(pt,12);          
        map.graphics.add(graphic);

Thanks Shaun,

I've tried your code but then after search map disappears.

Jack

ShaunWeston · Answer

You will probably have to string a couple of functions together, which isn't too hard to do once you know what you are doing.

e.g. This example here - http://developers.arcgis.com/en/javascript/samples/find_map/

So that's finding a feature and returning the geometry, after that you just need to get that geometry and zoom to it.

So in the code, note the bits I've added in

//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;
          }          
         // Get the geometry          
         var pt = graphic.geometry;          
         // Center the map at the point and zoom to scale level 12
        map.centerAndZoom(pt,12);          
        map.graphics.add(graphic);