将 D3.js 事件绑定到函数？答案

【问题标题】：Bind D3.js event to function?将 D3.js 事件绑定到函数？
【发布时间】：2013-07-12 11:41:57
【问题描述】：

由于我通过咖啡使用 D3.js，以下代码可以正常工作：

$ ->
  force = d3.layout.force()
    .on('tick', -> alert('tick triggered'))

但这些没有，因为当时没有任何tick 函数：

$ ->
  force = d3.layout.force()
    .on('tick', tick)
  tick = ->
    alert('tick triggered')

那么有什么方法可以将 D3 事件绑定到函数？

顺便说一句，我试过了

$ ->
  tick = ->
    alert('tick triggered')
  force = d3.layout.force()
    .on('tick', tick)

但在滴答声运行时出现了一些 Problem parsing d="MNaN,NaNLNaN,NaN" 错误。

【问题讨论】：

请将您的代码上传到JSFiddle
tick 是undefined，当您尝试在第二个中使用它时，第三个就可以了。您的NaN 问题是另外一回事。
@muistooshort 是的，这就是重点！
什么试图解析那堆 NaN？

标签： javascript jquery d3.js coffeescript force-layout

【解决方案1】：

在这里尝试改变

tick = ->

使用这个

tick: =>

【讨论】：

【解决方案2】：

$ ->
  force = d3.layout.force()
    .on('tick', tick)
  tick = ->
    alert('tick triggered')

意思

$(function() {
  var force, tick;
  force = d3.layout.force().on('tick', tick);
  return tick = function() {
    return alert('tick triggered');
  };
});

这里return tick = function(){} 是非法返回声明。

也许您需要在 Coffee 代码末尾添加 tick 或 null。像这样。

$ ->
  force = d3.layout.force()
    .on('tick', tick)
  tick = -> alert('tick triggered')
  null
//////////////
$(function() {
  var force, tick;
  force = d3.layout.force().on('tick', tick);
  tick = function() {
    return alert('tick triggered');
  };
  return null;
});

【讨论】：