Построение интерактивной карты

Question

Мне было поручено создать интерактивную карту всех штатов в США, и мне просто интересно, как лучше это сделать?

Я знаю, что я мог бы довольно легко построить это во Flash, но одно из требований - чтобы он работал на iPhone, поэтому очевидно, что правила Flash out!

Требования:

1. Должен работать во всех браузерах и портативные устройства.
2. Должен обновляться через Wordpress.
3. Должен включать небольшой информационный блок, который всплывает, когда каждое состояние наведено.
4. Внешний вид карты будет разработан нами (мы хотели бы полный контроль над это как мы графические дизайнеры!) это также исключает пользовательский Google карта.

Я провел здесь поиск и нашел два примера. Первый - именно то, что мы хотим, но выполняется во флэш-памяти - пример

Было предложено использовать this , но я не думаю, что смогу создавать всплывающие пузырьки при наведении курсора на каждое состояние.

Кто-нибудь знает какие-нибудь альтернативы?

UPDATE:

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

Answer 1

Я знаю, что этой теме уже несколько месяцев, но на случай, если люди все еще ищут.Я создал плагин WordPress, который может делать то, что вам нужно.Посмотрите пример того, что вы можете с ним сделать:

http://cmoreira.net/interactive-world-maps-demo/usa-custom-election-map/

Это не соответствует всем вашим требованиям, но также может быть хорошим вариантом.

Answer 2

Вы можете использовать простой старый тег <map> и поместить некоторый javascript для отображения всплывающего окна.

(Я думаю, что возможно даже использовать только CSS. Вы создаете все всплывающие окна, но не отображаете их. В части :hover каждого «Штата США» вы видите соответствующее всплывающее окно.)

Но есть проблема с вашим запросом: совместить совместимость переносных устройств и зависание невозможно!

Это может быть слишком много для того, что вы хотите сделать, но при работе с картами (если вы недовольны ненастраиваемой картой Google / Yahoo / Microsoft), я бы порекомендовал OpenLayers. OpenStreetMap используйте его, как и другие известные веб-сайты.

Не беспокойтесь о части WordPress.Конечно, вы бы сэкономили время, если существующий плагин существует, но я думаю, что это наименее важная вещь для рассмотрения.Я написал несколько плагинов, созданных вручную для WordPress.Это действительно просто (по сравнению с TYPO3 например!)