Heatmap

Home :: Projects

Heatmap provides a simple, single helper method that generates a cloud-style heatmap based on a provided histogram. The size and color of each element is determined by its associated value.

Heatmap - A simple plugin for generating cloud-style heatmaps in Rails.
A simple plugin for generating cloud-style heatmaps in Rails.



heatmap

http://github.com/Bantik/heatmap

git://github.com/Bantik/heatmap.git

No way.

5

Tweaks to element size.

Installation

Install the plugin as usual:

script/plugin install git@github.com:Bantik/heatmap.git

Then add this line to your application controller:

helper_method :heatmap

That's it!

Usage

To generate a heatmap, simply call the method from the view, passing in a preprepared histogram. The size and color of each key is calculated based on the associated value from the histogram.

In the controller:

  def index
    @histogram = {
      'Foo' => 13,
      'Bar' => 15,
      'Trouble' => 5,
      'Braids' => 1,
      'Something' => 9,
      'Else' => 13,
      'Many' => 20,
      'Zombies' => 7,
      'nothing' => 0
    }
  end

In your view:

  <%= heatmap(@histogram) -%>

You'll probably want to style the heatmap. There are two classes that you need to set styles for: heatmap, which is the enclosing div, and heatmap_element, which is applied to each key in the heatmap.

Sample CSS to get you started:

    .heatmap {
      border-top: 1px solid #aaaaaa;
      border-bottom: 1px solid #aaaaaa;
      width: 300px;
      padding: 1em;
    }

    .heatmap_element {
      display: block;
      text-align: center;
      margin: .25em;
      padding-top: 0em;
      float: left;
    }

Sample output:

Many
Bar
Foo
Else
Something
Zombies
Trouble
Braids



License and Legal Stuff

This work is licensed under a MIT License.


Back to Projects