Layerpin logo
Empezar a crear

Prepare imágenes grandes para mapas interactivos rápidos

Una guía técnica para exportar, optimizar y configurar planos de gigapíxeles, fotografías aéreas con drones y planos de sitios vectoriales para un rendimiento responsivo de zoom profundo.

LP

Equipo de Layerpin

8 min de lectura
Fotografía aérea panorámica de alta resolución con ricos paisajes y detalles urbanos.

Por qué es importante la preparación de imágenes para mapas interactivos

Los mapas interactivos exigen un rendimiento de imagen mucho mayor que las fotografías web normales. Los visitantes desplazan, pellizcan y amplían para inspeccionar finas etiquetas arquitectónicas, dimensiones de unidades y límites de stands individuales.

Si su imagen es demasiado pequeña, el texto y las líneas se vuelven borrosos e ilegibles cuando se amplía. Si su imagen es una exportación sin formato de 80 MB sin comprimir, los tiempos de carga de la página se disparan, las tasas de rebote aumentan y los dispositivos móviles fallan debido a limitaciones de memoria.

Layerpin cierra esta brecha utilizando una arquitectura de mosaico de zoom profundo. Al preparar correctamente la imagen de origen, desbloquea la capacidad de respuesta instantánea de panorámica y zoom con una claridad vectorial nítida.

  1. 1
    Apunte a una resolución de imagen de origen entre 3000 px y 8000 px a lo largo del borde más largo.
  2. 2
    Utilice perfiles de color RGB/sRGB para garantizar la fidelidad del color en todos los monitores.
  3. 3
    Recorte los márgenes blancos innecesarios y el espacio vacío del lienzo antes de cargarlo.

Las mejores configuraciones de exportación de CAD, Illustrator y Figma

Al exportar planos maestros o planos de planta desde software de diseño (AutoCAD, Revit, Adobe Illustrator, Canva o Figma), siga estas reglas de exportación para obtener resultados óptimos:

Para Vector CAD y Blueprints: exporte a escala 2x o 3x como PNG o WebP de alta calidad. Asegúrese de que los grosores de línea tengan un grosor mínimo de 1 pt a 1,5 pt para que los límites finos de las paredes no desaparezcan en vistas generales amplias con zoom.

Para fotografía aérea y con drones: exporte como JPEG progresivo o WebP con una calidad del 85-90 %. El ojo humano no puede detectar artefactos de compresión con una calidad del 85%, pero el tamaño del archivo se reduce hasta en un 70% en comparación con las exportaciones al 100% sin comprimir.

  1. 1
    Exporte dibujos lineales arquitectónicos como PNG o WebP con el suavizado habilitado.
  2. 2
    Exporte renderizados fotográficos y realistas en 3D como JPEG de alta calidad (85 % de calidad).
  3. 3
    Asegúrese de que las etiquetas de texto en el arte base se conviertan en contornos o se exporten a un alto DPI para evitar el desenfoque de trama.
Vista de cuadrícula aérea ultranítida que muestra una claridad de zoom profunda en un área grande

Cómo Layerpin procesa y ofrece imágenes con zoom profundo

Cuando carga una imagen en Layerpin, nuestro proceso de procesamiento genera una pirámide de imágenes de resolución múltiple (mosaicos de zoom profundo).

En lugar de obligar a un navegador móvil a descargar una imagen de 50 MB de una vez, Layerpin transmite dinámicamente solo los micro mosaicos específicos visibles dentro de la ventana gráfica y el nivel de zoom actuales del visitante. Con un zoom bajo, los mosaicos de descripción general con poco ancho de banda se cargan instantáneamente; A medida que el usuario se acerca a la Sala 402, los fragmentos de mosaicos de alta resolución fluyen sin problemas.

Esta arquitectura reduce la transferencia de imágenes inicial y al mismo tiempo admite planes maestros arquitectónicos de gran tamaño. El tiempo de carga real aún depende de la preparación de la imagen, las condiciones de la red, el alojamiento y el dispositivo del visitante.

Prueba del rendimiento de visualización en dispositivos reales

Antes de lanzar su mapa públicamente, realice siempre una auditoría multidispositivo del mundo real.

Abra su mapa publicado en una ventana privada del navegador y pruébelo en tres condiciones: pantalla retina/4K de escritorio, teléfono móvil de rango medio con conexión celular y tableta en orientación horizontal y vertical.

Confirme que el zoom predeterminado inicial muestra el área de interés completa sin requerir un zoom inmediato y verifique que las etiquetas de texto permanezcan nítidas al desplazarse por las esquinas más alejadas del lienzo.

  1. 1
    Pruebe el tiempo de carga inicial en la red móvil 4G.
  2. 2
    Verifique que el movimiento panorámico y el zoom de pellizco respondan en cada dispositivo de destino.
  3. 3
    Verifique que los límites de la cámara bloqueen a los visitantes dentro de límites significativos del mapa.
Layerpin logo

¿Listo para crear un mapa interactivo?

Crea el mapa en privado, revisa la vista del visitante y publícalo cuando esté listo para compartir. No credit card needed.

Empezar gratis