<\/HEAD>
<\/P>
Mantengamos esto corto y dulce. ¿Cuántas veces has estado trabajando con la ArcGIS API for JavaScript y has tenido que hacer zoom a una característica? ¿Te has rascado la cabeza ante algunos comportamientos extraños al usar map#centerAndZoom<\/A>? Quizás te encontraste escribiendo algunas sentencias switch\/case o if\/else para hacer zoom en el mapa según si estabas haciendo zoom a un punto, un polígono o una polilínea.<\/SPAN><\/SPAN><\/P><\/P>Lee la documentación<\/STRONG><\/SPAN><\/P>Antes de ver cómo hacer zoom fácilmente a las características, veamos por qué el método centerAndZoom odia tu mapa.<\/SPAN><\/P>La firma del método centerAndZoom es centerAndZoom(mapPoint, levelOrFactor). ¿Qué significa levelOrFactor? Veamos la definición.<\/SPAN><\/P><\/P>"<\/STRONG>Cuando se usa una <\/SPAN>ArcGISTiledMapServiceLayer<\/STRONG><\/SPAN>, el mapa se hace zoom al nivel especificado. Cuando se usa una <\/SPAN>DynamicMapServiceLayer<\/STRONG><\/SPAN>, el mapa se acerca o aleja por el factor especificado. Por ejemplo, usa 0.5 para hacer zoom dos veces más cerca y 2.0 para alejarse dos veces más."<\/STRONG><\/SPAN><\/EM><\/SPAN><\/P><\/P>Eso es mucho mejor. ¿No? ¿Todavía confundido? Ok, básicamente si estás usando una <\/SPAN>ArcGISTiledMapServiceLayer <\/SPAN>puedes hacer zoom en el mapa a un nivel específico de detalle. Piensa en el control deslizante de zoom en un mapa. Sin embargo, si estás usando una <\/SPAN>DynamicMapServiceLayer <\/SPAN>entonces se vuelve extraño. Ahora puedes acercarte dos veces más o alejarte dos veces más, pero necesitas especificar el factor en decimal, así que piensa en porcentajes. Supongo que quieres acercarte dos veces más, así que 0.5 parece una apuesta segura, pero si usas 0.25, eso sería qué, acercarse 4 veces más.<\/SPAN><\/P><\/P>Haz el trabajo<\/STRONG><\/SPAN><\/P>Ok, con eso en mente, ya sabes qué hacer. Armé este pequeño módulo hace un tiempo cuando me cansé de escribir lo mismo una y otra vez y verificar los tipos de geometría y diferentes escenarios. Estoy dispuesto a apostar que esto manejará el 90% de las situaciones que encuentres (No tengo números exactos para respaldar esto, pero confía en mí<\/EM>).<\/SPAN><\/P>define([\n 'dojox\/lang\/functional\/curry'\n], function(curry) {\n var zoom = curry(function(map, geometry) {\n if (geometry.type === 'point') {\n var mz = map.getMaxZoom() ;\n if (mz > -1) {\n map.centerAndZoom(geometry, mz - 2);\n } else {\n map.centerAndZoom(geometry, 0.25);\n }\n } else {\n map.setExtent(geometry.getExtent());\n }\n });\n return zoom;});//code sample remains untranslated as code<\/PRE><\/P>Aquí hay una demo en vivo<\/A>.
Así que básicamente verificas si la geometría es un punto. Si es un punto, obtienes el nivel máximo de zoom del mapa. En este punto tienes dos opciones:
- Si es mayor que -1, haz zoom a ese nivel y réstale 2 para no acercarte demasiado. O no, eso depende de ti.
- Haz zoom con un factor de 0.25, lo que significa acercarte 4 veces al nivel actual de zoom.
Si la geometría no es un punto, es fácil, los polígonos, polilíneas y multipuntos pueden devolver una extensión,<\A> así que puedes simplemente establecer la extensión actual del mapa a la extensión de la geometría.
Súbelo un nivel<\strong>
Esto funciona bastante bien, pero digamos que quieres una solución más flexible. La versión anterior funciona bien cuando se le pasa una geometría, pero ¿qué tal un gráfico o un arreglo de gráficos? Todos estos son objetos válidos a los que quizás quieras hacer zoom. Así que para eso, construyamos un módulo que pueda manejar casi cualquier cosa que le lances.
  define([\n       'dojox/lang/functional/curry',\n       'esri/graphic',\n       'esri/graphicsUtils'\n   ], function(curry, Graphic, gUtils) {\n       var zoomToPoint = function(m, geometry) {\n           var mz = m.getMaxZoom();\n           if (mz > -1) {\n               return m.centerAndZoom(geometry, mz - 2);\n           } else {\n               return m.centerAndZoom(geometry, 0.25);\n & nbsp& nbsp& nbsp& nbsp& nbsp} \n& nbsp& nbsp& nbsp& nbsp}; \n& nbsp& nbsp& nbsp& nbsp var zoomToGeom = function(m , geometry) { \n& nbsp& nbsp& nbsp& nbsp& nbsp if (geometry.type === 'point') { \n& nbsp& nbsp& nbsp& nbsp& nbsp& nbsp return zoomToPoint(m , geometry); \n& nbsp& nbsp& nbsp& nbsp& nbsp} else { \n& nbsp& nbsp& nbsp& nbsp& nbsp& nbsp return m.setExtent(geometry.getExtent()); \n& nbsp& nbsp& nbsp& nbsp} \n& nbsp& nbsp& nbsp}; \n& nb sp& nb sp var zoomToGraphics = function(m , graphics) { \n& nb sp& nb sp if (!graphics.length) return ; \n& nb sp& nb sp if (graphics.length > 1) { \n& nb sp& nb sp& nb sp return gUtils.graphicsExtent(graphics); \n& nb sp& nb sp } else { \n& nb sp& nb sp var g = graphics[0]; \n& nb sp& nb sp var geometry = g.geometry ; \n& nb sp& nb sp if (geometry.type === 'point') { \n& nb sp& nb sp return zoomToPoint(m , geometry); \n}& nb sp}& nb sp }; \ n& ;nbsp var zoomToGraphic = function(m , graphic) { \ n& ;nbsp& ;nbsp return zoomToGeom(m , graphic.geometry); \ n& ;nbsp}; \ n& ;nbsp var zoom = curry(function(m , gs) { \ n& ;nbsp& ;nbsp if (gs.type) { \ n& ;nbsp& ;nbsp& ;nbsp return zoomToGeom(m , gs); \ n& ;nbsp& ;nbsp} \ n& ;nbsp& ;nbsp if (gs instanceof Array) { \ n& ;nbsp& ;nbsp& ;nbsp return zoomToGraphics(m , gs); \ n& ;nbsp& ;nbsp} \ n& ;nbsp& ;nbsp if (gs instanceof Graphic) { \ n& ;nbsp& ;nbsp& ;nbsp return zoomToGraphic(m , gs); \ n& ;nbsp}); \ n& ;nbsp return zoom;});//code sample remains untranslated as code Este módulo utiliza el módulo esri/graphicsUtils<\A> para manejar arreglos de Graphics, puede manejar un solo Graphic o Geometry. Haz clic aquí para ver un demostración de este módulo <\/A> en acción.<\/SPAN><\/P><\/P>
¡Bam hecho!<\/STRONG><\/SPAN><\/P>Woah woah<\/EM>. ¿Qué es este
curry<\/A> disparate? Ok, entonces colé este. Usar curry básicamente te permite evaluar funciones parcialmente. Lo que significa que pasas el mapa a la función antes de que necesites pasar la geometría. Aquí hay una explicación de curry en JavaScript<\/A>.<\/SPAN><\/P>Esto no es un requisito estricto, pero sí le da un poco de sabor.<\/SPAN><\/P><\/P>Juega con ello, modifícalo, abúsalo y programa.<\/SPAN><\/P><\/BODY><\/HTML>