Why doesn't the click handler work on this Raphael object?
My current project is a heat map of the United States:

http://up.massrelevance.com/cnbc/top-states/heatmap.html

It's rendered with the help of Raphael and a couple of prepackaged libraries to generate the paths for the states. At some point in my code, I generate an array of references to the Raphael object representing each state; then I iterate over them, attaching a click handler to each (the actual Raphael object is stored in `projection.map`) using Raphael's `.click()` method:

    Heatmap.prototype.stateClick = function() {
      var projection, 
          state, 
          _this = this;
      for (state in this.projections) {
        projection = this.projections[state];
        console.log(state);
        console.log(projection.map[0]);
        (function(state, projection) {
          projection.map.click(function() {
            _this.overlay.update(state, _this.states[state]);
            _this.overlay.reveal();
          });
        })(state, projection);
      }
    };

This works fine for 48 of the 50 states. However, for some reason, Alaska (AK) and Oklahoma (OK) don't seem to get the click handler - that is, when I click them, nothing happens.

Watching the console for the output of the `console.log` calls in the code above, I can't see any differences between the Raphael objects for AK & OK from any other state's object, so I'm baffled as to what the cause may be.

Can anyone determine or guess what's happening, or maybe suggest how I might debug this further? Is there anything about how these shapes are drawn (e.g., maybe not with fully closed paths?) that may cause the click handler to fail to attach?

Thanks!
Why doesn't the click handler work on this Raphael object?
===

My current project is a heat map of the United States:

http://up.massrelevance.com/cnbc/top-states/heatmap.html

It's rendered with the help of Raphael and a couple of prepackaged libraries to generate the paths for the states. At some point in my code, I generate an array of references to the Raphael object representing each state; then I iterate over them, attaching a click handler to each (the actual Raphael object is stored in `projection.map`) using Raphael's `.click()` method:

    Heatmap.prototype.stateClick = function() {
      var projection, 
          state, 
          _this = this;
      for (state in this.projections) {
        projection = this.projections[state];
        console.log(state);
        console.log(projection.map[0]);
        (function(state, projection) {
          projection.map.click(function() {
            _this.overlay.update(state, _this.states[state]);
            _this.overlay.reveal();
          });
        })(state, projection);
      }
    };

This works fine for 48 of the 50 states. However, for some reason, Alaska (AK) and Oklahoma (OK) don't seem to get the click handler - that is, when I click them, nothing happens.

Watching the console for the output of the `console.log` calls in the code above, I can't see any differences between the Raphael objects for AK & OK from any other state's object, so I'm baffled as to what the cause may be.

Can anyone determine or guess what's happening, or maybe suggest how I might debug this further? Is there anything about how these shapes are drawn (e.g., maybe not with fully closed paths?) that may cause the click handler to fail to attach?

Thanks!