This project is a D3.js-based visualization of towns across the United Kingdom. It dynamically fetches town data from an API, displays the towns on an interactive map, and provides several features for user interaction and enhanced visualization.
Data Fetching and Visualization:
The application fetches town data from a remote API feed and plots them on a map of the UK. The map dynamically updates to display the number of towns based on user input. Map Drawing:
Uses D3.js and GeoJSON data to draw the geographical boundaries of the United Kingdom. The map is rendered using the geoMercator projection to ensure an accurate representation of the region. Town Plotting:
Plots towns on the map as circles with sizes that correspond to their population. Each town is represented by a circle, with larger circles indicating higher populations. Interactive Elements:
Reload Button: Allows users to refresh the data, displaying a new set of towns. Slider and Input: Enables users to specify the number of towns displayed on the map. Tooltips: Hovering over a town displays a tooltip with details like the county and population. Animations: Smooth transitions when towns are added or updated on the map, providing a more engaging experience.
#Enhancements Tooltip Information: Displaying additional information like town name, county, and population on hover. Circle Size Adjustment: Circle sizes on the map change dynamically based on the population, providing a visual representation of population density. Data Reload Animation: Animates the transition of town circles when data is reloaded. Heat Map Option: Option to view a heat map where colors represent population density.
Below are some examples of the visualizations generated by this project. The images demonstrate different types of maps such as the Bubble Map and the Heat Map.
Here are two examples of the Bubble Map, where the size of each circle represents the population of each town:
Here are two examples of the Heat Map, where the color intensity represents the population density of each town:
