如何在two.js中捕获形状或组上的单击事件？

Question

我已经使用two.js绘制了一个形状，我希望编写代码来处理该形状上的单击事件。不是画布，而是形状本身。

front_left.domElement = $('#two-' + front_left.id)
    .css('cursor', 'pointer')
    .click(function(e){
        alert("Hello World!");
    });

这个看起来应该工作的代码从回答中摘取：

circle.domElement = $('#two-' + circle.id)
  .css('cursor', 'pointer')
  .click(function(e) {
    circle.fill = getNonMainRandomColor(getRandomColor());
  });

但是它不适用于我使用最新的JQuery和最新的two.js，而且它似乎也不适用于例句，因为代码读起来好像点击圆圈是为了改变颜色，但是在我尝试过的任何浏览器或计算机上都不会发生任何事情。

那么，如何捕获和响应使用two.js绘制的形状/组的单击事件？

Answer 1

谢谢你的留言。这个答案不再起作用的原因是two.js自那以后发生了变化。我添加了一个这里的例子。其要点是：

1. 使用svg渲染器
2. 每当您创建一个形状时，它都有一个私有属性_renderer
3. 您可以访问elem，这是它对应的dom元素。
4. 但!在访问呈现器之前，请确保它已更新。

例如：

var shape = two.makeCircle(two.width / 2, two.height / 2, 50);
two.update();
shape._renderer.elem.addEventListener('click', handler, false);

而且，如果你觉得冒险，你可以混合渲染，如在这个例子。