dojo.connect(geocoder, "onSelect", doSomething); function doSomething(results){ console.log(results); map.setExtent(results.extent); map.setZoom(12); }
Solved! Go to Solution.
var geocoder = new esri.dijit.Geocoder({ map: map, autocomplete: true, arcgisGeocoder: false, autoNavigate: false, geocoders: myGeocoders, value: '146317' },"search");
//define a symbol var symbol = new esri.symbol.PictureMarkerSymbol({ "angle":0, "xoffset":0, "yoffset":10, "type":"esriPMS", "url":"http://static.arcgis.com/images/Symbols/Shapes/YellowPin1LargeB.png", "contentType":"image/png", "width":24, "height":24 }); //ar matches = results; //add a point to the map to show the result location var graphic = result.feature; graphic.setSymbol(symbol); map.graphics.add(graphic); //alternative would be to use center and zoom map.centerAndZoom(result.extent.getCenter(), 18);
var geocoder = new esri.dijit.Geocoder({ map: map, autocomplete: true, arcgisGeocoder: false, autoNavigate: false, geocoders: myGeocoders, value: '146317' },"search");
//define a symbol var symbol = new esri.symbol.PictureMarkerSymbol({ "angle":0, "xoffset":0, "yoffset":10, "type":"esriPMS", "url":"http://static.arcgis.com/images/Symbols/Shapes/YellowPin1LargeB.png", "contentType":"image/png", "width":24, "height":24 }); //ar matches = results; //add a point to the map to show the result location var graphic = result.feature; graphic.setSymbol(symbol); map.graphics.add(graphic); //alternative would be to use center and zoom map.centerAndZoom(result.extent.getCenter(), 18);
Was struggling with this also. Super helpful, thanks.
UPDATE - I just tried changing my map navigation mode from "css-transforms" to "classic" and that seemed to fix my problem, even though I was testing in Chrome and FF. However, I have noticed some other interesting behavior: My map starts at CONUS, the country wide view. If I search for, say LAX, the map pans and zooms using my custom handler, the tiles update (and look fine), the feature layer works too (it really did seem to be a navigationMode problem). However, while zoomed into LAX, if I then use the locator service and search for DCA, the map pans to DCA (no zooming since finding LAX already set the zoom level to 18 per your code example), but takes about 10 seconds to update the tiles. Looking at the NET calls in Firebug, it seems as if it is making calls to every tile between LAX and DCA at that zoom level - necessarily way too many. Is that expected behavior?
Thanks, and sorry for the long post...
Jay
<!DOCTYPE HTML> <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>FeatureLayer On Demand</title> <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; } #header { margin: 2px; border: solid 4px #224a54; color:black; font-size:12pt; text-align:left; font-weight:bold; height:40px; } </style> <script type="text/javascript">var djConfig = {parseOnLoad: true};</script> <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3"></script> <script type="text/javascript"> dojo.require("esri.map"); dojo.require("esri.layers.FeatureLayer"); dojo.require("dijit.form.Button"); dojo.require("dijit.Dialog"); var map; function init() { //Instantiate Map map = new esri.Map("map", { basemap: "gray", center: [-97, 38], zoom: 5, navigationMode: "classic" }); } function zoomToCA(){ map.centerAndZoom([-118.4075, 33.9424], 18); } function zoomToDC(){ map.centerAndZoom([-77.038472, 38.85188],18); } dojo.addOnLoad(init); </script> </head> <body class="claro"> <div style="position:relative;float:left; width:100%;height:100%;"> <div id="header" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'"> <button data-dojo-type="dijit.form.Button" data-dojo-props="onClick:function(){zoomToCA();}">Zoom to CA</button> <button data-dojo-type="dijit.form.Button" data-dojo-props="onClick:function(){zoomToDC();}">Zoom to DC</button> </div> <div id="map" style="width:100%;height:100%;"> </div> </div> </body> </html>
Jay is your app public? If so can you send the url so I can test? I can't reproduce the issue with my simple test app.