Есть JSON данные от Google Analytics API по которым нужно нарисовать карту мира с помощью highmaps.js c выделением всех стран и показом названия страны. Когда курсор останавливается над страной, подсказка покажет данные по стране из JSON'a, например сколько посетителей или сколько сессий было из этой страны, в зависимости от того что содержится в JSON массиве.

При клике на какую либо страну - карта увеличится показывая только границы этой страны и выделит все города этой страны. Когда курсор остановится над городом - точно такая же подсказка как выше появится показывая данные только для этого города.

И страны и города должны быть окрашенны в зависимости от присовенных данных. Т.е. страна со 100 посетителями будет красного цвета но с большим темным цветом чем страна с 40 посетителями.


В JSON будут следущие данные:

1. Код страны по ISO


2. Полное название страны


3. Полное название региона \ штата


4. Полное название города


5. Координаты (широта)


6. Координаты (долгота)


7. Данные для отображения (например пользователи или сессии и тд)

Можно будет добавлять и другие данные если они вам понадобятся (в зависимости от того дает ли эту информацию Google Analytics API).

То что мне нужно очень похоже на следущее демо:
http://www.highcharts.com/maps/demo/all-maps

Но намного проще, т.е. нужно более минималистичное (не нужен dropdown и разные типы карт, нужны именно города а не регионы и тд) решение.

Пример json данных во вложении.

Часто встречаются данные где город или страну не удалось определить '(not set)' или 'ZZ' в таких случаях нужно под картой просто вывести в subtitle количество таких стран когда просматривается карта мира и количество таких городов когда просматривается карта страны.