Contenu <\/p>\nToggle<\/span>

Duraci\u00f3n: aproximadamente 9-12 horas (repartidas en 6 sesiones)<\/a>
- Programa :<\/a><\/li>
- Resultado esperado<\/a><\/li>
- Env\u00ede su proyecto individual – Sesi\u00f3n 6<\/a><\/li>
- \u00bfC\u00f3mo hacerlo?<\/a><\/li><\/ul><\/li>
- M\u00e9todo de ense\u00f1anza del curso Leaflet<\/a>
  - 1. Presentaci\u00f3n de diapositivas<\/a><\/li>
  - 2. Texto explicativo detallado<\/a><\/li>
  - 3. Ejercicio pr\u00e1ctico al final de la sesi\u00f3n<\/a><\/li>
  - 4. Clave de respuestas disponible\u2026 \u00a1pero despu\u00e9s del esfuerzo!<\/a><\/li>
  - En resumen<\/a><\/li><\/ul><\/li>
  - \u00bfListo para empezar? Ir a la primera sesi\u00f3n: \u00a1Mostrar un mapa con Leaflet!<\/a><\/li><\/ul><\/nav><\/div>\n
    <\/span>Duraci\u00f3n: aproximadamente 9-12 horas (repartidas en 6 sesiones)<\/span><\/h2>\n\n\n\n
    <\/span>Programa :<\/span><\/h3>\n\n\n\n
    \n
    Introducci\u00f3n a Leaflet online<\/a><\/strong>\n
    \n
    – Instalaci\u00f3n, estructura b\u00e1sica de un mapa<\/li>\n\n\n\n
    – Adici\u00f3n de fondos de mapa (OSM, mapas base de terceros)<\/li>\n<\/ul>\n<\/li>\n\n\n\n
    Capas e interactividad <\/a><\/strong>\n
    \n
    – Puntos, polil\u00edneas, pol\u00edgonos<\/li>\n\n\n\n
    – Personalizaci\u00f3n, eventos, interacciones<\/li>\n<\/ul>\n<\/li>\n\n\n\n
    Capas GeoJSON y datos externos<\/a> <\/strong>\n
    \n
    – Carga de datos GeoJSON<\/li>\n\n\n\n
    – Visualizaci\u00f3n condicional, s\u00edmbolos din\u00e1micos<\/li>\n<\/ul>\n<\/li>\n\n\n\n
    Controles y herramientas de interfaz <\/a><\/strong>\n
    \n
    – Tooltips, ventanas emergentes, leyendas, grupos de capas<\/li>\n\n\n\n
    – Control de capas y filtros sencillos<\/li>\n<\/ul>\n<\/li>\n\n\n\n
    Eventos de usuario e interactividad (en l\u00ednea el 19 \/05\/2025)<\/strong>\n\n
    – Reacci\u00f3n ante clics, hovers, selecci\u00f3n de elementos<\/li>\n\n\n\n
    – Creaci\u00f3n de un mapa interactivo sencillo<\/li>\n<\/ul>\n<\/li>\n\n\n\n
    Miniproyecto de mapa web personalizado (en l\u00ednea el 22 \/05\/2025)<\/strong>\n\n
    – Creaci\u00f3n de un miniproyecto<\/li>\n\n\n\n
    – Puesta en l\u00ednea (GitHub Pages u otra soluci\u00f3n gratuita)<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n\n\n\n\n\n\n
    <\/span>Resultado esperado<\/span><\/h3>\n\n\n\n
    Al final del curso, ser\u00e1s capaz de crear un mapa de Leaflet con tus propios datos y ponerlo en l\u00ednea para compartirlo con el mundo.<\/p>\n\n\n\n
    <\/span>Env\u00ede su proyecto individual – Sesi\u00f3n 6<\/span><\/h3>\n\n\n\n
    En la \u00faltima sesi\u00f3n de este m\u00f3dulo, habr\u00e1 realizado un proyecto individual que incorpore los principales elementos estudiados (capas, estilos, interacciones, controles, etc.).<\/p>\n\n\n\n
    Te invitamos a compartir tu proyecto con nosotros, para que podamos darte un feedback personalizado y, si lo deseas, incluirlo entre los ejemplos que aparecer\u00e1n en nuestras futuras publicaciones<\/p>\n\n\n\n
    <\/span>\u00bfC\u00f3mo hacerlo?<\/span><\/h3>\n\n\n\n
    Publique su proyecto (c\u00f3digo y mapa) en GitHub o en un servicio equivalente (el m\u00e9todo se describir\u00e1 en la sesi\u00f3n 6) y, a continuaci\u00f3n, env\u00edenos el enlace a su repositorio mediante el formulario previsto a tal efecto.<\/p>\n\n\n\n
    Los proyectos se examinar\u00e1n de acuerdo con los siguientes criterios:<\/p>\n\n\n\n
    \n
    Buena utilizaci\u00f3n de la API del Leaflet<\/li>\n\n\n\n
    Legibilidad y organizaci\u00f3n del c\u00f3digo<\/li>\n\n\n\n
    Calidad visual y funcional del mapa<\/li>\n\n\n\n
    Pertinencia del tema y de los datos elegidos<\/li>\n<\/ul>\n\n\n\n
    \n\n\n\n
    Para los ejercicios del curso, puede descargar un kit de inicio<\/a> en formato zip desde este enlace.<\/p>\n\n\n
    [wpdm_package id=’13356′]<\/p>\n\n\n\n
    
    Descomprima el contenido en un directorio de su elecci\u00f3n donde pueda almacenar todos los archivos de este curso.<\/p>\n\n\n\n
    <\/span>M\u00e9todo de ense\u00f1anza del curso Leaflet<\/span><\/h2>\n\n\n\n
    Este curso de introducci\u00f3n a Leaflet.js, la librer\u00eda JavaScript para mapeo interactivo, est\u00e1 dise\u00f1ado para ayudarle a aprender de forma progresiva, utilizando un enfoque activo, visual y guiado.<\/p>\n\n\n\n
    Cada sesi\u00f3n sigue una estructura did\u00e1ctica sencilla y eficaz:<\/p>\n\n\n\n
    \n\n\n\n
    <\/span>1. Presentaci\u00f3n de diapositivas<\/span><\/h3>\n\n\n\n
    Cada sesi\u00f3n comienza con una presentaci\u00f3n de diapositivas en la que se resumen los conceptos esenciales que hay que recordar:<\/p>\n\n\n\n
    \n
    conceptos ilustrados con ejemplos reales,<\/li>\n\n\n\n
    extractos de c\u00f3digo comentados,<\/li>\n\n\n\n
    diagramas o capturas de pantalla,<\/li>\n\n\n\n
    iconos y pistas visuales para ayudarle a recordar.<\/li>\n<\/ul>\n\n\n\n
    El objetivo: comprender r\u00e1pidamente las funciones y posibilidades de Leaflet.let.<\/p>\n\n\n\n
    \n\n\n\n
    <\/span>2. Texto explicativo detallado<\/span><\/h3>\n\n\n\n
    Cada diapositiva va acompa\u00f1ada de un texto explicativo did\u00e1ctico que:<\/p>\n\n\n\n
    \n
    desarrolla el contenido de la diapositiva,<\/li>\n\n\n\n
    explica el \u00abpor qu\u00e9\u00bb y el \u00abc\u00f3mo\u00bb de cada funci\u00f3n,<\/li>\n\n\n\n
    sugiere variantes de c\u00f3digo o consejos adicionales,<\/li>\n\n\n\n
    introduce buenas pr\u00e1cticas y errores comunes que conviene evitar.<\/li>\n<\/ul>\n\n\n\n
    Este texto est\u00e1 concebido como una ayuda a la lectura aut\u00f3noma, que puede consultarse antes o despu\u00e9s de la sesi\u00f3n.\u00e8s la s\u00e9ance.<\/p>\n\n\n\n
    \n\n\n\n
    <\/span>3. Ejercicio pr\u00e1ctico al final de la sesi\u00f3n<\/span><\/h3>\n\n\n\n
    Al final de cada sesi\u00f3n, encontrar\u00e1 un ejercicio pr\u00e1ctico para completar:<\/p>\n\n\n\n
    \n
    aplicaci\u00f3n directa de los conceptos tratados,<\/li>\n\n\n\n
    escenario realista: mapa de una ubicaci\u00f3n, adici\u00f3n de marcadores, estilo din\u00e1mico, etc.<\/li>\n\n\n\n
    instrucciones claras, con pasos guiados si es necesario.<\/li>\n<\/ul>\n\n\n\n
    Los ejercicios son una etapa esencial para afianzar su aprendizaje y poner a prueba su comprensi\u00f3n.<\/p>\n\n\n\n
    \n\n\n\n
    <\/span>4. Clave de respuestas disponible\u2026 \u00a1pero despu\u00e9s del esfuerzo!<\/span><\/h3>\n\n\n\n
    Un enlace al final del art\u00edculo le lleva a la clave de respuestas del ejercicio, con:<\/p>\n\n\n\n
    \n
    una soluci\u00f3n comentada,<\/li>\n\n\n\n
    c\u00f3digo funcional para copiar y pegar o adaptar,<\/li>\n\n\n\n
    a veces variantes o \u00e1reas de mejora.<\/li>\n<\/ul>\n\n\n\n
    Le recomendamos encarecidamente que realice el ejercicio usted mismo antes de consultar la soluci\u00f3n.
    Es la mejor manera de mejorar tu autonom\u00eda, reforzar tu memoria y asimilar los conceptos.<\/p>\n\n\n\n
    \n\n\n\n
    <\/span>En resumen<\/span><\/h3>\n\n\n\n
    Cada sesi\u00f3n del curso se basa en:<\/p>\n\n\n\n
    \n
    una presentaci\u00f3n visual de diapositivas para ayudarle a comprender r\u00e1pidamente,<\/li>\n\n\n\n
    un texto explicativo claro para ayudarle a profundizar,<\/li>\n\n\n\n
    un ejercicio pr\u00e1ctico para ayudarle a experimentar,<\/li>\n\n\n\n
    una hoja de respuestas guiadas para ayudarle a corregirse y a ir m\u00e1s lejos.<\/li>\n<\/ul>\n\n\n\n
    Este m\u00e9todo le permite aprender Leaflet paso a paso, a su ritmo, tanto si es principiante como si ya tiene conocimientos b\u00e1sicos de HTML\/JavaScript.<\/p>\n\n\n\n
    \n\n\n\n
    <\/span>\u00bfListo para empezar?
    Ir a la primera sesi\u00f3n: \u00a1Mostrar un mapa con Leaflet!<\/a><\/strong><\/span><\/h2>\n","protected":false},"excerpt":{"rendered":"
    Duraci\u00f3n: aproximadamente 9-12 horas (repartidas en 6 sesiones) Programa : Resultado esperado Al final del curso, ser\u00e1s capaz de crear un mapa de Leaflet con tus propios datos y ponerlo en l\u00ednea para compartirlo con el…<\/p>\n","protected":false},"author":1,"featured_media":13141,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sfsi_plus_gutenberg_text_before_share":"","sfsi_plus_gutenberg_show_text_before_share":"","sfsi_plus_gutenberg_icon_type":"","sfsi_plus_gutenberg_icon_alignemt":"","sfsi_plus_gutenburg_max_per_row":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false},"categories":[3018],"tags":[2939,2941,2032,2235],"class_list":["post-13135","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-webmapping-es","tag-leaflet-es","tag-programa-es","tag-tutorial","tag-webmapping-es"],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t

<\/span>Programa :<\/span><\/h3>\n\n\n\n\nIntroducci\u00f3n a Leaflet online<\/a><\/strong>\n\n– Instalaci\u00f3n, estructura b\u00e1sica de un mapa<\/li>\n\n\n\n– Adici\u00f3n de fondos de mapa (OSM, mapas base de terceros)<\/li>\n<\/ul>\n<\/li>\n\n\n\n