<\/HEAD>
<\/P>
De vez en cuando puedes recibir una solicitud extraña de tus usuarios sobre características que les gustaría agregar a una aplicación. Podrían querer integrar alguna API loca<\/EM> o funcionar completamente sin conexión<\/EM>, ninguna de estas cosas podría considerarse fácil, pero se podría manejar hasta cierto punto. Tal vez quieran guardar la última extensión del mapa cuando cierran y vuelven a abrir su navegador, ¡puedes hacer eso<\/A>! Algo que he hecho antes es guardar selecciones, para que cuando un usuario cierre el navegador, pueda volver a la aplicación y los últimos elementos que seleccionó sigan seleccionados<\/STRONG>. No sé, hombre, gente de oficina<\/EM>. Pero oye, ¡puedes hacer eso!<\/P><\/P>
Paso a Paso<\/H2>Los pasos son bastante simples.<\/P>Crea una clave única para almacenar selecciones<\/LI>Cuando una selección esté completa, almacena la selección<\/LI>Cuando se borre la selección, limpia el almacenamiento<\/LI>Cuando la aplicación inicie, revisa el almacenamiento o las selecciones guardadas y vuelve a seleccionar<\/LI><\/OL><\/P>¡Facilísimo!<\/EM><\/P><\/P>Generar una clave única es sencillo. Dado que localStorage está particionado por dominios, simplemente tomo mi ubicación más reciente y le agrego algún identificador único. Algo así:<\/P>var key = location.href + '--id-selection';<\/P><\/P>Demasiado fácil.<\/EM><\/P><\/P>Luego solo necesitas almacenar la selección cuando esté completa. suficientemente fácil.<\/P>featureLayer
.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW)
.then(function(results) {
var data = results.map(function(x) { return x.toJson(); });
localStorage.setItem(key, JSON.stringify(data));
});<\/PRE><\/P>¿Entonces qué estamos haciendo aquí? Bueno, cada Graphic tiene un método toJson<\/A> para generar una representación de objeto simple. De hecho, este método está por todas partes en la API (pista pista, mira qué más puedes hacer con él<\/SPAN>). Así que podemos mapear sobre los resultados y ejecutar toJson en ellos para obtener los datos JSON. Luego podemos guardarlo en localStorage después de<\/> que lo stringify<\/> . Esto es importante, localStorage es un entorno amigable con cadenas. Los objetos simples solo se verán como "[object Object]", lo cual no es útil.<\/> <\/> <\/> <\/> Luego asegúrate de que si hay algún lugar en tu aplicación donde se borre la selección, también elimines el elemento de localStorage.on(dom.byId(\"clearSelectionButton\"), \"click\", function () {\n featureLayer.clearSelection();\n localStorage.removeItem(key);\n});<\/> < P > < EM > Suficientemente simple.< \/ EM > < \/ P > < P > < \/ P > < P > Ahora la parte genial. Cuando una aplicación inicia, queremos revisar localStorage para selecciones guardadas. Me gusta tener un método auxiliar simple para hacer el análisis real de gráficos, así que podría verse algo así.var parseToGraphics = function (str) {\n if (!str) { return undefined; }\n return JSON.parse(str).map(function(x) {\n return new Graphic(x);\n });\n};< \/ PRE > < P > < \/ P > < P > Así que < A href=\"https:\/ \/developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse\" rel=\"nofollow noopener noreferrer\" target=\"_blank\">JSON.parse</ A > hace lo opuesto a JSON.stringify. Intentará convertir datos en cadena en objetos JavaScript simples. Otra característica genial en la ArcGIS API for JavaScript es que algunos constructores aceptan representaciones JSON de lo que intentas crear. Igual que el constructor de < A href=\"https:\/ \/developers.arcgis.com/javascript/jsapi/graphic-amd.html#graphic2\" rel=\"nofollow noopener noreferrer\" target=\"_blank\">Graphic</ A >. Esto te permite crear Graphics como un maníaco de Graphics. Luego puedes esperar a que tu FeatureLayer cargue y revisar localStorage.featureLayer.on('load', function() {\n var items = parseToGraphics(ls.getItem(key));\n if (items) {\n var q = new Query();\n q.objectIds = items.map(function(x) {\n return x.attributes.OBJECTID;\n });\n featureLayer\n .selectFeatures(q, FeatureLayer.SELECTION_NEW);\n }\n});< \/ PRE > < P > < \/ P > < P > Y < STRONG >< EM > ¡BOOM!< \/ EM >< \/ STRONG > Acabas de guardar selecciones y mostrar los últimos elementos seleccionados cuando una aplicación carga. Puedes ver un ejemplo de este < A href=\"http:\/ \/jsbin.com/tipope/3/edit?js,output\" rel=\"nofollow noopener noreferrer\" target=\"_blank\">jsbin</ A >. Tengo que advertirte, jsbin parece un poco inestable para esta app a veces, al menos en mi máquina, pero esto funciona, confía en mí.< \/ P > < P > < \/ P > < P >< EM > ¿Por qué guardar todo el Graphic si solo usas ObjectIds?< \/ EM > Oye, no te digo cómo revolver tu avena. Pero buena pregunta. Si sabes con certeza que solo vas a seleccionar por ObjectIds, entonces claro, solo guarda los ObjectIds. Me gusta tener los gráficos porque así tengo opciones. Puede que quieras hacer algún tipo de análisis o selección separado usando la selección guardada. O tal vez quieras mostrarlo en el InfoWindow para el primer elemento seleccionado cuando la aplicación inicia.featureLayer.on('load', function() {\n var items = parseToGraphics(ls.getItem(key));\n if (items) {\n var q = new Query();\n q.objectIds = items.map(function(x) {\n return x.attributes.OBJECTID;\n });\n featureLayer\n .selectFeatures(q, FeatureLayer.SELECTION_NEW)\n .then(function() {\n items.map(function(x) {\n x.setInfoTemplate(infoTemplate);\n });\n map.infoWindow.setFeatures(items);\n map.infoWindow.show(items[0].geometry.getCentroid());\n });\n }\n});< \/ PRE >< P > Puedes ver una demo de esto < A href= \ "http:\ / \ /jsbin.com/tipope/4/edit?js,output \ " rel= \ "nofollow noopener noreferrer \ " target= \ "_blank \ " > en jsbin </ A > . Esta muestra necesita algo de trabajo, pero entiendes la idea. Normalmente uso esto para mostrar contenido Popup en alguna otra parte de la aplicación sincronizada con el mapa.< \/ P > < P > < \/ P > < P > Al guardar el Graphic, al menos tienes < EM > algunas opciones con las que puedes jugar </ EM>. Pero si sabes que no necesitas todo esto, entonces claro, optimiza y guarda solo los ObjectIds.< \/ P > < P > < \/ P > < H2 id= \ "toc-hId-1015441306 \ " id= \ "toc-hId-1015441306 \ " > Salva El Mundo </ H2 >< P > Así que no tengas miedo de experimentar con localStorage u otras formas de almacenamiento para persistir datos en tu aplicación. Diviértete con ello y crea aplicaciones geniales.< \/ P >< P >< \/ P >< P > Para más consejos y trucos geodev, visita mi blog: http://odoe.net/blog/< \/ A >< \/ P >< \/ BODY >< \/ HTML >
