Reusable Interactive Tourism Mapping Plugin

Problem

Tourism websites need a map that shows visitors the highlights of a region. I first needed one for a large regional tourism portal. The agency built many tourism sites, so a map made for one site would have had to be built again for every other.

Approach

• I built an interactive map for the regional tourism portal and its regional subsites.
• I built it alone, from the first version to the later changes.
• I made it a separate component, so other sites could use it without a rewrite.
• I kept maintaining it for years as new sites and new customers came in.
• I worked with the project manager and the client on what the map should show.

Architecture and design decisions

• I built the map with Leaflet.js and Vue.js.
• I packaged it as a plugin that a site can add, and not as code written for one site.
• The map loads tourism data and shows it to the visitors of the website.
• I kept the plugin separate from the sites that use it, so one fix or one new feature reached every site.

Outcomes

• The map became part of every tourism site the agency built.
• It became the base for the tourism sites of all customers.
• I was the only developer behind it, and I kept it running for years.
• New tourism sites got a working map without starting from zero.

Known gaps

• I do not describe where the tourism data came from or what format it had.
• I have no numbers on how many visitors used the map or how often.
• The page does not cover performance, accessibility or how the map worked on small screens.
• I do not know if the plugin is still in use after I left.