Technologies:
- HTML, CSS, JavaScript – used to create the structure and functionality of the map.
- SVG (Scalable Vector Graphics) – utilized for visualizing the map and marking administrative units.
- jQuery – applied for handling click events and enabling tooltips.
- Bootstrap – used for styling elements and integrating tooltips.
Main Functionality:
- Interactive Areas: each administrative unit is represented as an SVG <path> object, which changes color when hovered over.
- Clickable Regions: clicking on a specific area redirects the user to a corresponding external resource.
- Tooltips: hovering over an area displays its name in a stylized tooltip.
- Responsiveness: media queries in CSS ensure compatibility with different screen sizes.
Map Content Description: This interactive map represents the historical administrative units of Jutland (Denmark). It includes names and borders of regions and provides links to informational pages about each region. The visual design features contrasting colors to highlight areas and hover effects to enhance interactivity.
Summary: This project serves as an example of an interactive web map that combines SVG graphics, CSS animations, dynamic JavaScript event handlers, and Bootstrap-styled tooltips to enhance the user experience.
If you are interested in collaborating or have any questions, you can contact me on this page – Contact me