Heatmap.js — это JavaScript библиотека для отрисовки теплокарт на элементах canvas из HTML5 на основе ваших данных.
Библиотека распространяется по двойной лицензии: MIT и Beerware. Так что можете свободно использовать ее в своих проектах.
Смотрим.
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, в которой реализовано хранилище даных, основы динамической перерисовки и настройки градиентов.