0

我目前的项目是一张美国的热图:

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

它是在 Raphael 和几个预先打包的库的帮助下呈现的,以生成状态的路径。在我的代码中,我生成了一个代表每个状态的 Raphael 对象的引用数组;然后我对它们进行迭代,projection.map使用 Raphael 的.click()方法为每个(实际的 Raphael 对象存储在)附加一个点击处理程序:

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);
  }
};

这适用于 50 个州中的 48 个。但是,由于某种原因,阿拉斯加(AK)和俄克拉荷马(OK)似乎没有获得点击处理程序——也就是说,当我点击它们时,什么也没有发生。

在控制台查看console.log上面代码中调用的输出,我看不出 AK & OK 的 Raphael 对象与任何其他状态的对象之间有任何差异,所以我对可能的原因感到困惑。

谁能确定或猜测发生了什么,或者建议我如何进一步调试?是否有任何关于如何绘制这些形状(例如,可能不是完全封闭的路径?)可能导致点击处理程序无法附加的信息?

4

1 回答 1

0

嘘,想通了。我在阿拉斯加 (AK) 的州代码中打错字,而不是使用 OK。这就解释了为什么这是两个问题状态。我研究了一个多小时,直到休息后,用一双崭新的眼睛,我立即发现了这个错字。

于 2012-07-06T05:24:04.363 回答