anchor.diff:    </div>
       <div>
         <p style="text-align: center">Swing & Miss</p>
  +      <p style="text-align: center">Number of Events Tracked: <%= @swings.count(:px) %></p>
       <div class="heatmapContainer" id="swings">
         <%= javascript_tag do %>
  +      // determine what the max heatmap value should be
  +      var swing_count = <%= @swings.count(:px) %>;
  +      var max_count;
  +      if (swing_count <= 20) {
  +      max_count = 1.2;
  +      } else {
  +      max_count = 2.5;
  +      }
         // create configuration object
         var height = document.getElementsByClassName('heatmapContainer')[0].clientHeight;
         var width = document.getElementsByClassName('heatmapContainer')[0].clientWidth;
  
positive.code:       // create heatmap with configuration
        var heatmapInstance = h337.create(config);
        var data = {
        max: 6,
        min: 0,
        data: [
        <% @events.try(:each) do |event| %>
  
negative.code:       // create heatmap with configuration
        var heatmapInstance = h337.create(config);
        var data = {
        max: max_count,
        min: 0,
        data: [
        <% @swings.try(:each) do |event| %>
  