Communitygithub.com

trip-map-3d

Convierte una conversación sobre un viaje en un sitio web 3D interactivo con terreno real, rutas diarias y clima.

¿Qué es trip-map-3d?

Esta habilidad transforma cualquier itinerario de viaje en un sitio web interactivo con mapas 3D realistas, rutas animadas por día, pins, tarjetas informativas, clima y soporte offline. Está diseñada para agentes de IA como Claude Code, Cursor o Codex, y permite a los usuarios describir su viaje en lenguaje natural y obtener un sitio completamente funcional a partir de un único archivo `trip.yaml`. El agente guía al usuario paso a paso: primero recopila la información necesaria (destino, fechas, actividades diarias, alojamiento, idioma y preferencias), luego genera el archivo YAML validado con geocodificación, y finalmente construye y publica el sitio mediante GitHub Pages. Incluye reglas importantes: usa servicios gratuitos sin abusar de APIs públicas, respeta licencias de fotos y datos, y mantiene los créditos legales. La salida es un sitio moderno, responsivo y autónomo, ideal para viajeros, agencias o entusiastas que quieran compartir sus rutas de forma visual.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/orodmorais/trip-map-3d/tree/HEAD

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

¿Qué hace trip-map-3d?

Convierte un viaje en un sitio web: un mapa 3D real por región, una ruta animada por día, pins, tarjetas, clima y soporte offline. Todo proviene de un solo archivo, trip.yaml.

1. Pregunta sobre el viaje

Pregunta por lo que no tengas, unas cuantas preguntas a la vez:

  • Dónde, cuándo y cuántos días.
  • Para cada día: qué planean hacer y en qué orden. Los nombres son suficientes.
  • Dónde se hospedan. Adviérteles primero que el sitio es público en una cuenta gratuita de GitHub, por lo que un barrio es suficiente. Nunca escribas una dirección postal a menos que ellos insistan después de esa advertencia.
  • Idioma (en, pt-BR, es) y unidades.
  • Opcional: lugares de surf, mareas, fotos, un tema.

Las fotos deben ser propias o tener licencia. No descargues fotos de internet por ellos.

2. Escribe trip.yaml

Sigue examples/trip.example.yaml. Solo se requieren title, dates.start y days. Siempre agrega la ciudad al nombre del lugar: "Panteón, Roma", no "Panteón".

3. Construir y revisar

python -m pip install -r requirements.txt
python -m pipeline check trip.yaml

Lee el informe línea por línea con el usuario. El geocodificador puede estar equivocado con seguridad, así que muéstrale cada lugar que encontró. Cualquier línea marcada como CHECK necesita revisión. Si un lugar es incorrecto o falta, agrega lat y lon en places: en lugar de reintentar la búsqueda.

Luego construye:

python -m pipeline build trip.yaml --out dist
python -m pip install -r requirements-dev.txt
python tools/check_site.py dist --shots shots --hashes "" dia-1

Abre las capturas de pantalla y míralas antes de decir que funciona. Verifica que cada lugar encaje, que ninguna ruta quede debajo de una tarjeta y que no se haya impreso ningún error.

4. Publicar, solo después de que el usuario confirme

Confirma el nombre del repositorio y que será público. Luego:

  1. Haz push a un repositorio creado a partir de esta plantilla.
  2. En Configuración, Pages, establece Source en GitHub Actions. Este paso es manual.
  3. El workflow construye y publica en cada push.

Reglas

  • Los servicios públicos son compartidos. Nunca hagas bucles sobre ellos. trip.lock.json guarda cada respuesta: hazle commit y nunca lo elimines para reintentar.
  • Este proyecto no usa la API pública de Nominatim. Su política prohíbe ser integrado en herramientas como esta como geocodificador genérico. Si el usuario pregunta por Nominatim, dirígelo a la política de uso y a services.geocoder para su propia instancia.
  • La API gratuita de Open-Meteo es para uso no comercial. Una agencia de viajes necesita una clave de pago: establece services.open_meteo_key.
  • Mantén los créditos de datos en el sitio. Son legalmente requeridos (consulta DATA_SOURCES.md).

Skills relacionados