Pregunta

Los mapas resbaladizos son widgets web que permiten al usuario desplazarse por un plano bidimensional agarrándolo y arrastrándolo. Este control se hizo popular en los mapas de Google, y hoy en día se puede ver en muchos sistemas de mapeo modernos. Es obvio que al verlos cargar, en realidad son una cuadrícula de imágenes que se cargan según sea necesario a medida que el usuario se desplaza. Mi pregunta es; ¿Cómo se alinean, mueven y cargan dinámicamente esas imágenes en HTML / JS / CSS? ¿Son divs con imágenes de fondo? ¿Están cargados en un div padre con desbordamiento: oculto? ¿Qué estrategias utilizan para evitar la pérdida de memoria a medida que el usuario analiza? ¿Existen bibliotecas de terceros que faciliten su creación? No me interesan los mapas geográficos, solo la interfaz que se usa comúnmente para mostrarlos. Gracias!

¿Fue útil?

Solución

Normalmente, se mueve una cuadrícula de elementos de imagen, y a medida que algunos se alejan del extremo del visor y se ocultan, se mueven al lado opuesto de la cuadrícula y los atributos src cambian para apuntar al nuevo mosaico del mapa.

Todos estos, como usted dice, se cargarán en un elemento padre con desbordamiento: oculto;

En términos de ejemplos, puede ver la implementación de código abierto de capas abiertas:

http://openlayers.org/

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top