Interactive HTML5/JS map of London areas

General information for the website: Real estate agent
Kind of development: Customization of existing website
Num. of web pages/modules: 1
Description of requirements/features: IMPORTANT: we need someone who knows London and has at least worked or lived here.

We're looking to build a London area guide, similar to http://www.vanhan.co.uk/areas-we-cover/

We basically need an improved version of the above example. There are 32 areas that we want to cover initially but with the option to add/remove areas later down the line (areas to be removed could just be inactive). The areas need to be more than just straight lines, they need to be in the right place on the map and approximately the right shape too; ideally we would like them to be as accurate as possible but keeping in tone with a minimalistic style and a simple design. The whole map can be no wider than 880px.

Functionality-wise, when the user hovers over Knightsbridge (for example), that area will be highlighted, as will the area name in the sidebar and vice versa - possibly achieved with class toggles, and when either the area name in the sidebar or the actual area within the map is clicked, the user is then taken to the respective area guide, for this example, website.com/knightsbridge

We need to be able to control general variables such as area names and destination URLs. We will be going with a monochrome design, so grey outlines of the areas with a same grey fill on hover. We'd like to achieve this functionality with JavaScript (could use jQuery).

The map does not need to be responsive as we are looking to hide it on anything smaller than 1024x768 using media queries, leaving only the sidebar with selectable areas to redirect mobile users.

The website is built on a custom PHP/MySQL framework to which you should not need access.

Ultimately we just need a map of London (with the Thames running through it), with the below list of areas, plus a functional HTML page with the map built in and the aforementioned functionality. We want to include all the major parks in the map too but these do not need to direct anywhere or be selectable since we're only focused on the habitable areas and the parks would merely be a visual aid for the approximate area locations (the same applies to the Thames). This map MUST be original and should not be reused or shown outside of our project and the finishing freelancer's portfolio. The client may request you sign an NDA.

These are the areas:

Prime Central London
==
Chelsea
South Kensington
Knightsbridge
Belgravia
Notting Hill
Kensington
Holland Park
Mayfair

South-West London
==
Fulham
Parsons Green
Barnes
Wandsworth
Battersea
Putney
Wimbledon
Richmond
Chiswick

North London
==
Hampstead
St Johns Wood
Primrose Hill
Regents Park
Maida Vale
Little Venice

Central and East London
==
Marylebone
Fitzrovia
Bloomsbury
Shoreditch
Spitalfields
Canary Wharf
Shad Thames
Wapping
The Docklands

Hopefully this is clear enough but please ask below if you need further details.
Specific technologies required: HTML5, JavaScript (can use jQuery), CSS3, SVG
Similar urls: http://www.vanhan.co.uk/areas-we-cover/
Extra notes: I run a small digital agency in Belgravia and have spoken to several international freelancers about this project but I feel that none of them are qualified enough to meet the kind of detail and perfectionism we're looking for, furthermore, we don't have the manpower or the budget to do this in-house at the moment, hence my reach out to a wider area of freelancers.

Unfortunately there is no further money available for the job beyond the specified budget, so please only apply if you are absolutely certain that you can do it at or below that price.

This could be a great opportunity for someone looking to widen their portfolio and it may open up doors for future work with higher pay rates. I'm really keen to work with ambitious developers, graduates and anyone who considers themselves a perfectionist!