🎯 Animated Area Measurement Demo

Look for the beautiful animated button in the bottom-right corner of the map!

Live Area Measurement Results

Área (m²)

0.00 m²

Área (ft²)

0.00 ft²

Área (acres)

0.0000 acres

¡Mira el botón "Medir Área" en la esquina inferior derecha!Tiene una animación de borde rotatorio con colores que cambian continuamente.

Cargando mapa interactivo...

Preparando la experiencia visual

✨ Borde rotatorio: Los colores del borde rotan continuamente (azul → púrpura → cian → verde → amarillo → rojo)

🌟 Efecto shimmer: Brillo sutil que se mueve por el botón cuando está activo

💫 Glow effect: Resplandor suave alrededor del botón cuando está activo

🎯 Punto pulsante: Indicador visual que pulsa cuando el modo medición está activo

📱 Responsive: Funciona perfectamente en móviles y escritorio

🌙 Dark mode: Se adapta automáticamente al tema oscuro

1. Busca el botón animado: Está en la esquina inferior derecha del mapa

2. Haz clic en "Medir Área": Se abrirá un modal con Mapbox GL JS

3. Dibuja un rectángulo: Usa las herramientas de Mapbox para dibujar

4. Ve los resultados: El área se calcula automáticamente con Turf.js

5. Cambia unidades: m², ft², o acres según necesites

6. Cierra el modal: Haz clic en "Cerrar" o presiona ESC