Создайте тепловую карту США с помощью всплывающих подсказок мыши и без вспышки - PullRequest
0 голосов
/ 30 сентября 2010

В настоящее время я использую интерактивную флеш-карту на моем сайте, которая отображает различные цвета для разных штатов США на основе некоторых данных.У меня также есть функция наведения мыши для отображения дополнительных данных, когда пользователь наводит курсор на состояние.

Существуют ли какие-либо инструменты для достижения вышеуказанной функциональности без использования flash (совместимо с мобильными устройствами).Я готов заплатить за эти инструменты в случае необходимости.

Ответы [ 2 ]

2 голосов
/ 30 сентября 2010

Для сайтов, совместимых с мобильными устройствами, вам придется использовать Javascript.

JQuery - отличное место для старта, если вы до этого не делали много с Javascript.Это даст вам довольно простые механизмы для обработки событий наведения мыши и всплывающих окон.

Вы можете попытаться упорядочить все изображения состояний, используя HTML и CSS, но вы также можете посмотреть на HTML.5 Канва элемент .Он работает в большинстве современных браузеров, и есть хак , чтобы заставить его работать в IE.

В зависимости от того, как вы это делаете, вы также можете узнать о картах изображений .Существует множество инструментов, помогающих с созданием карт изображений .

ОБНОВЛЕНИЕ Я работал с некоторыми диаграммами и натолкнулся на этот пример используя библиотеку JS под названием Raphae l.Кажется, это очень похоже на то, что вы ищете.

Также, когда я смотрел на этот пример, я понял, что если вы кодируете для мобильного сенсорного экрана устройства (iPhone,iPad, Android и т. д.), у вас не будет события «зависания» (по понятным причинам).Возможно, вы захотите попытаться определить, поддерживает ли браузер «зависание», и, если нет, вместо этого сделайте анимацию «щелчком».

0 голосов
/ 15 ноября 2011

Рассмотрите возможность использования Google Visualization GeoChart .

Это на основе SVG;извините, я не знаю, как это ограничить для мобильных устройств.

Я боюсь, что вы можете зацикливаться на том, что контент при наведении может быть не таким гибким, как вам бы хотелось.

...