heatmap

Heatmap.js — это JavaScript библиотека для отрисовки теплокарт на элементах canvas из HTML5 на основе ваших данных.

Библиотека распространяется по двойной лицензии: MIT и Beerware. Так что можете свободно использовать ее в своих проектах.

Смотрим.

Скачать последнюю версию с GithubЭкземпляры тепловых карт строят цветные теплокарты на основе относительных данных. Что это значит? Это значит, что при добавлении одной единственной точки, она будет отображаться красным (горячим) цветом, но при добавлении еще одной с более высоким весом, будет проходить автоматический пересчет цветов точек.

Heatmap — полностью настраиваемая библиотека. Вы можете выбирать цвета, менять прозрачность, радиусы точек и так далее.

Если вы хотите знать, как работает heatmap.js, то можете прочитать статью о внутренней жизни heatmap.js (eng).

Что такое тепловая карта?

Если вы никогда не слышали о тепловых картах, то кратко поясним, что это такое. Теплокарта — это графическое представление точек данных с разной частотой. Там, где количество точек больше, та область выделяется красным цветом, а там, где точек меньше — синим.

Также можно зайти и посмотреть статью о теплокартах на Википедии.

Примеры

• Теплокарта на основе статичных данных
• Теплокарта реального времени на основе движения курсора мыши
• Теплокарта реального времени на основе щелчков мыши
• Карты Google
• OpenLayers
• Теплокарта клавиатуры — визуализация нажатия клавиш [new!]
• Heatmap Animator — анимция тепловых карт с течением времени!  [new!]

Документация и поддержка браузеров

Пока что документирование функций и опций heatmap.js спрятано в исходниках.

Библиотека heatmap.js поддерживается браузерами: Firefox 3.6+, Chrome 10, Safari 5, Opera 11 и IE 9+.

Даты выхода версий программ

• 2011-04-22: Релиз 1.0 библиотеки heatmap.js, в которой реализовано хранилище даных, основы динамической перерисовки и настройки градиентов.